Basic Tutorials for Roots?

1

I’ve just found out about Roots and I was hoping someone knew of a realllllly basic tutorial on starting to move around in the theme. I’ve seen a couple examples posted but I’m a bit confused by the file hierarchy and how it is all related. I’ve read through quite a few posts and the getting started section of the Roots website but they all seem to assume a lot.

Thanks

2

Most of the documentation assumes you’ve used WordPress previously. If you haven’t then it could be worthwhile reading up on the WordPress theming basics.

Roots uses the same template hierarchy as any WordPress theme but the wrapper saves duplication of the calls to load the header, footer and sidebar. I posted an image here that takes you through the process step-by-step. You can also use it to change the base markup but the theme wrapper post should explain that.

The templates folder has nothing to do with the wrapper (aside from sidebar.php being loaded by it). It’s just a convenient folder to hold reusable markup and loops.

Everything else is largely the same as any other theme, except that we recommend that custom code goes in lib/custom.php instead of cluttering up functions.php.

Is there anything else specific you’ve had an issue with?

3

Thanks, I’ve played in Roots using the Wordpress Hierarchy and the templates so I can see how it works. What I seem not to understand is best practices for customizing the templates in the proper places. For instance if I were to build a site with a custom home page, a two column blog page, and a three column every other page, or maybe variations of two or three columns on pages depending on page, what would you do, something like this?

  1. custom home page --> Copy page.php to front-page.php, then using the two includes build my page design around them, and turn off the sidebar on front-page, and add any custom widget areas

  2. custom blog page --> possibly no need, two column page built into Roots theme

  3. custom 2 or 3 column pages --> not sure what to do in an example like this
    a) new base.html? copied to base-page.html so you can add an extra column, then create a 2 and a 3 column page template that you would select at the WP admin level
    b) repeat sidebar markup of original base.php for two sidebars to make 3rd column and custom hide sidebar function in custom.php, or customize the Roots sidebar hide function to accomodate extra sidebar
    c) would you then change lib/config.php and add your own roots_display_custom_sidebar_class() for setting widths with any applicable logic, or would you put that in custom.php

2 Likes
4

  1. That’s absolutely fine. Either use the included template files, or copy them to create new ones if you need to make any significant changes. Less significant changes are usually best off with simple conditionals, but it’s really down to personal preference.

  2. You shouldn’t need to change anything for this. Just set up the blog page in the dashboard and make sure its using the default template.

  3. The problem with versatility is that there is more than one way to do something; but it’s a much nicer problem than having no way of doing something. I would keep one base.php, duplicate all the sidebar associated code and edit the helper functions in lib/config.php. It’s the most flexible way of doing something and the display of either sidebar follows the same logic.

1 Like
5

Just to say that the pdf book answered most of my newbie questions quite thoroughly - especially on best practises and the theory behind the folder structures etc. :slight_smile:

1 Like