Child Themes and the function.php File

  • Share

In my last post, “Customizing a WordPress Theme – The Right Way“, I mentioned that the function.php file is used to add new functionality to your Child theme. Many times this may be to add additional HTML elements and tags to allow for use in styling (i.e., CSS). Another use of the function.php file within a Child Theme is to replace a Parent Theme function with one of your own or simply to remove a Parent Theme function. This post will step you through making changes to the function.php file.

Adding a Stylesheet with function.php

In my No-Nonsense Child Theme I needed to add some IE styling. This meant that I needed a stylesheet that only applied to IE. This can be done in a couple of ways. One method is to modify the head.php file to add the stylesheet link code and the other is to use a function to insert the stylesheet link code into the rendered page. I prefer the second method as you leave the header.php file untouched.

To use the function.php file to add the stylesheet I needed to add the following within the <head> section of the page:

[php]<!–[if lte IE 7]>
<link rel="stylesheet" type="text/css" media="all"
href="http:// … /lte-ie7-styles.css" />
<![endif]–>[/php]

To do this I added the following code to the function.php file within my Child Theme folder:

[php]function set_lte_ie7_css() {
?>
<!–[if lte IE 7]>
<link rel="stylesheet" type="text/css" media="all"
href="<?php bloginfo( ‘stylesheet_directory’ ); ?>/lte-ie7-styles.css" />
<![endif]–>
<?php
}
add_action(‘wp_head’, ‘set_lte_ie7_css’);[/php]

The function is pretty simple in that it just prints out the <link> HTML needed for defining the stylesheet reference. The function utilizes the bloginfo(‘stylesheet_directory’) WordPress function to define the URL path less the stylesheet name. This is the correct way to do this. In the case of a Child Theme this will point to the Child Theme folder.

The set_lte_ie7_css function is then called at the correct time, that is, within the <head> section of the page by the add_action line of code below the function. The ‘wp_head’ parameter instructs WordPress to fire the function during the building of the <head> section of the page.

Removing Parent Theme Functions

Another use of the function.php file can be to remove Parent Theme functions. To do this one would simply write a remove_action or remove_filter call. For example, the following removes the formatting that the Twenty Ten theme would use for post excerpts:

[php]remove_filter( ‘excerpt_more’, ‘twentyten_auto_excerpt_more’ );
remove_filter( ‘get_the_excerpt’, ‘twentyten_custom_excerpt_more’ );[/php]

Well, it was meant to but it didn’t. Figuring out the issue and then remedying it can be challenging. The issue in this case was that the removal in the Child Theme function.php file was being executed before the Parent Theme had added the filters. To determine the issue some debugging code was added to the removal code as follows:

[php]$remove1 = remove_filter( ‘excerpt_more’, ‘twentyten_auto_excerpt_more’ );
$remove2 = remove_filter( ‘get_the_excerpt’, ‘twentyten_custom_excerpt_more’ );
printf (‘$remove1=%1$s
$remove2=%2$s
‘,$remove1,$remove2);[/php]

The above then spit out the variable labels without a value, meaning the remove_filter calls were not executing successfully. Now that I knew that the call I was making to remove these filters was failing because it was being called before the Parent Theme had run the code to create the filters, I had to write my code to ensure it occurred after the Parent Theme instantiated the filters. The way to deal with this was to craft a function that would run later in the evaluation tree. The following is the resulting function, which was then called via the add_action line of code. The add_action $tag parameter was specified to invoke the function at the end of the WordPress code that builds the <head> section. The following is this code:

[php]function remove_tt_excerpt_filters() {
remove_filter( ‘excerpt_more’, ‘twentyten_auto_excerpt_more’ );
remove_filter( ‘get_the_excerpt’, ‘twentyten_custom_excerpt_more’ );
}
add_action(‘wp_head’, ‘remove_tt_excerpt_filters’);[/php]

At this point all was good and I was able to add the excerpt filters that I wanted.

I hope this Post has got you started a bit on how you might use the function.php file in a Child Theme. You may also find the WordPress Function Reference handy while working on the function.php file.

  • Share
This entry was posted in Website Development and tagged , , , , . Bookmark the permalink.

About Jeff Lambert

Entrepreneur Jeff Lambert is the President and founder of JVHM, Inc., a software development business located in the San Francisco Bay Area but serving clients around the globe. Jeff's expertise includes website design and development, Facebook development, blogging integration, SEO, video production, CRM systems, database design and development and more. In his "spare" time Jeff likes to hang out with his family, run, play tennis, fly and breath fresh, clean air.

Leave a Reply

Your email address will not be published. Required fields are marked *