Home  »  ArticlesGuidesHow ToTechnology   »   How to Override Parent Theme Functions in WordPress

How to Override Parent Theme Functions in WordPress

If you are a budding WordPress theme developer there is one thing you will have to end up knowing sooner or later. That is, how to override parent theme functions in WordPress.

The reason you would want to do this is to be able to alter some or most of the behavior of a parent theme while retaining other features that are inherited into your child theme.

With this WordPress feature, three main parts of the parent theme can be manipulated. They are the templates, the main CSS stylesheet, and the functions.

1. The templates: These are replaced by those in the child theme if they bear the same name and location. This is necessary to retain the well-formed output which normally ends up in your web browser as HTML.

2. CSS Style: The style.css file of your child theme, and any others by extension, are appended below the ones from the parent theme. The browser will then process the CSS giving priority to the last occurrence of any matching rules.

3. Functions: The functions.php file contains functions specific to your theme. unlike templates or CSS styles, you cannot override parent theme functions simply by declaring the same function in the child theme.

The parent theme functions are registered after those of the child theme which means any similar function names will be overridden by those of the parent theme in WordPress.

So how do I Override Parent Theme Functions?

Because the functions in WordPress are first registered before being used, it allows you to specify which function ends up being used on your website. There are three main ways you can do this:

  1. Use pluggable functions
  2. Change function priority
  3. Remove functions from the hook that they are attached to

Using Pluggable Functions

You can use PHP’s core function function_exists() to check if the function has already been declared. If it has not been declared then the function will be declared and used.

if ( ! function_exists ( 'my_function' ) ) {
    function my_function() {
        // Contents of your parent theme function here.
    }
}

function my_function() {
    // Contents for your child theme function override here.
}

This method is the best practice for those developing parent themes and will stop the parent theme function from being declared if it has been declared in the child theme.

Change Function Priority

It is not always the case that you encounter a parent theme developed with pluggable functions, which in itself is a bad design for a parent theme.

WordPress provides another solution to this problem. Basically in WordPress functions are generally added to an action or filter hook. When this is done you may also supply a priority level to it.

If you do not supply a priority it is given the default of 10. If you find the parent theme function has no priority assigned then anything above 10 should give it a higher priority as in WordPress functions are added to the filter hook in ascending order.

Here is an example of how this works in your child theme.

function your_function() {
    // Contents for your parent theme function here.
}
add_action( 'init', 'your_function', 20 );

function your_function() {
    // Contents for your child function override here.
}
add_action( 'init', 'your_function', 25 );

Remove Functions From the Hook

Another alternative is to completely remove the parent theme function from the filter hook and add your child theme in its place. This option can also be used to remove a function from the filter hook and net necessarily replace it if you do not need an alternative.

This can be done using the WordPress functions remove_action() and remove_filter() depending on whether the function was added to an action or a filter hook in the parent theme.

This is how you can remove a function from an action or a filter hook.

function child_remove_parent_function() {
    remove_action( 'init', 'parent_function', 10 );
}
add_action( 'wp_loaded', 'child_remove_parent_function' );

The remove_action() and remove_filter() functions must be attached to a filter hook for it to work and that is why it is not called stand-alone.

You will also need to specify the priority of the original function and set the same priority level or lower because technically you cannot remove an action before it has been triggered.

At this point, the parent function is no longer registered and you are now free to declare it in your child theme as shown above.

You can find more details about the remove_action() API here and remove_filter() from this location.

Hopefully, this guide should point you on your way on how to override parent theme functions in WordPress.

Found this article interesting? Follow Brightwhiz on Facebook, Twitter, and YouTube to read and watch more content we post.

Available under:
Articles, Guides, How To, Technology