get_stylesheet_directory_uri and Child Themes

Posted on: May 2nd, 2013

Summary: get_stylesheet_directory_uri looks into the child theme folder and not the parent folder when called.

This month I’m working on a re-design for a site run on WordPress multisite. I’ve not really done much work with it before, but the goal is to have one main theme and a child theme based off of that for each individual user to then add styling as they see fit.

Things were going well with the main theme, which was based on Bones (my favorite theme starter). I created a child theme, followed the Codex instructions to a T, but could not get my JavaScript or CSS to load. style.css for the child theme was feeding WordPress the correct info, Theme Title, Author, etc, but it was trying to grab theme-child/library/css/style.css, which didn’t exist.

At first I didn’t realize the issue, so I added in a template path to create a style.css file in library/css but then the scripts weren’t loading. So I took a look into functions.php. A majority of the functions in Bones are handeled in bones.php, so I ended up having to look there.

That’s when it was clear what the issue was. bones.php was using get_stylesheet_directory_uri() to find the root of the template. This is fine for a standard theme, but when planning to build child themes, you’ll need to adjust.

get_stylesheet_directory_uri()

Codex: Retrieve stylesheet directory URI for the current theme/child theme. Checks for SSL. Note: Does not contain a trailing slash.

The Codex goes on to say that “In the event a child theme is being used, this function will return the child’s theme directory URI. Use get_template_directory_uri() to avoid being overridden by a child theme.” So it will pull in the standard template files like usual, index.php etc. but for specific areas where you are getting a directory_uri, template (parent theme) uri is needed.

Well sometimes I don’t read so good and I was baffled by why everything was going to the child theme folder. After digging into bones.php the switch was pretty easy. There were only a few instances were get_stylesheet_directory_uri() showed up, so I changed those and everything snapped into place.

But what does get_template_directory_uri() do?

get_template_directory_uri()

Codex: Retrieve template directory URI for the current theme. Checks for SSL. Note: Does not return a trailing slash following the directory address.

This gives you the parent theme folder and fixes your issues if a child theme is being used. All is fixed and everyone is happy.

One thing to remember is that you’ll need to use “echo get_template_directory_uri();” to actually get the output of the URL.

Have questions or want to discuss? Holler at me in the comments.

previous post: Getting Kicked Out of Your First Startup next post: Using the Audio Waveform Effect – After Effects