Theme activation

Installing

Download Roots and upload it to /wp-content/themes/roots/ - then you can activate the theme through the WordPress admin

Activation

Automatically create Home page

When you activate Roots we'll automatically create a page called Home with filler content. We then automatically set the Reading Settings of the blog to make the Home page the static frontpage.

If your site isn't going to have a static homepage and instead will be showing your latest posts, you'll need to go into the Reading Settings after theme activation and change this.

Automatically set the permalink structure

Roots will automatically set the permalink structure to /%postname%/.

Change the uploads folder and options

Instead of the default /wp-content/uploads/ we tell WordPress to use simply /assets/ and to not organize uploads by year and month.

Automatically create the menu and set it's location

Roots comes with one navigation by default. We create the menu, automatically set it's location, and then add all current pages to the Navigation.

Google Analytics

Unlike previous versions of Roots theme, as of v5 there is no theme options page within the Wordpress Admin area. Instead, to add your (optional) Google Analytics code, edit this section of the inc/roots-config.php file like so:

define('GOOGLE_ANALYTICS_ID',  'YOUR CODE HERE');

Adding additional JavaScript files to your theme

The preferred option of loading additional JavaScript files is through the inc/roots-scripts.php file. For example, here we have amended the standard version of the file (as of v.5.0) to illustrate how to add an additional jQuery file, only if not in the Admin area and on a page called 'Page1', 'Page2' or 'Page3':

function roots_scripts() {
  // more code above here deals with styles
  wp_register_script('roots_plugins', ''.$template_uri.'/js/plugins.js', false, null, false);
  wp_register_script('roots_script', ''.$template_uri.'/js/script.js', false, null, false);
  wp_enqueue_script('roots_plugins');
  wp_enqueue_script('roots_script');
  // additional section to illustrate how to add additional JS files. This one based on a page array.
  if ( !is_admin() && is_page(array('Page1','Page2','Page3')) ) {
  	wp_register_script('roots_list', ''.$template_uri.'/js/replaceList.js', false, null, false);
  	wp_enqueue_script('roots_list');
  }	
  // end of changes to standard version of file
}

How to disable existing CSS styles (such as Bootstrap)

If you want to remove the default styles that load with Roots, amend the following code in inc/roots-scripts.php

<?php

function roots_scripts() {
  wp_enqueue_style('roots_style', get_template_directory_uri() . '/css/style.css', false, null);
  /* wp_enqueue_style('roots_bootstrap_style', get_template_directory_uri() . '/css/bootstrap.css', array('roots_style'), null);

   
  if (BOOTSTRAP_RESPONSIVE) {
    wp_enqueue_style('roots_bootstrap_responsive_style', get_template_directory_uri() . '/css/bootstrap-responsive.css', array('roots_bootstrap_style'), null);
  }

  wp_enqueue_style('roots_app_style', get_template_directory_uri() . '/css/app.css', false, null);
  */
  
  if (is_child_theme()) {
    wp_enqueue_style('roots_child_style', get_stylesheet_uri(), array('roots_style'), null);
  }
// more code follows...