How to Override Parent Theme Functions in a Child Theme

The best practice to customize your WordPress (parent) theme and override template files or functions is by using a child theme. We’ve already published a basic tutorial on how to create wordpress child themes. However, while overriding template files in a child theme is easy, overriding parent theme functions in a child theme takes some additional efforts if you want to do it the right way.




When it comes to overriding parent theme functions in your child theme, you have to keep track of a couple of things. Beforehand, it is important to know that all functions in your parent theme are running as well when using a child theme. However, functions in your child theme will be loaded first. With this in mind, there basically are three common ways to override parent theme functions in WordPress while using a child theme based on the given scenario:

Taking advantage of pluggable functions

Let’s start with pluggable functions. What does the word pluggable actually mean? Pluggable means that the parent theme function is wrapped in a function_exists() if-condition to check whether the function already exists – if so, the function will not be executed, otherwise, WordPress will run the function. Here is an example of a pluggable function with conditional tag:

Example of a pluggable function

[php]
if (!function_exists(‘my_parent_theme_function’)) {
function my_parent_theme_function() {
// Code of your pluggable function
}
}
[/php]

Now remember what was mentioned earlier – child theme functions are being executed first in WordPress. That means you can simply take the function from the parent theme, without the conditional tag, put it in file functions.php of your child theme and let it run whatever you like. That way the function in your child theme will be executed instead of the function in your parent theme. And this is what the function without the if-statement would look like in your child theme:

Example of overriding pluggable function

[php]
function my_parent_theme_function() {
// Code of your new function in the child theme
}
[/php]

Making use of hooks, actions, and filters

With this approach you will remove the outcome of the parent theme function from the action hook it is attached to and thus prevent it from affecting your website. After that you can code custom functionality in your child theme and hook it accordingly for use on your website. Here is an example of a function attached to the after_setup_theme action hook:

Example of function attached to hook

[php]

function my_parent_theme_function() {
// Code of your parent theme function
}
add_action(‘after_setup_theme’, ‘my_parent_theme_function’);

[/php]

To override this function in your custom child theme, you first would need to use remove_action() or remove_filter(), depending on what is given to unhook the function in your child theme. In this case the function has been added with add_action(), so you need to use remove_action():

Example of removing function from hook

[php]
remove_action(‘after_setup_theme’, ‘my_parent_theme_function’);
[/php]

With this in mind, you can now code a custom function in your child theme to unhook the function from your parent theme. It’s important to know that in order to unhook the parent theme function, you would either need to use an action hook that is called after the hook which is being used in the parent theme or you would need to work with priorities instead to ensure that your child theme function is executed after the parent theme function in order to unhook the function accordingly.

Example of unhooking the parent theme function

[php]
function remove_my_parent_theme_function() {
remove_action(‘after_setup_theme’, ‘my_parent_theme_function’);
}
add_action(‘wp_loaded’, ‘remove_my_parent_theme_function’);
[/php]

After you’ve successfully removed the parent theme function, you can know code a new custom function in your child theme based on your personal requirements.



Override Parent Theme Functions

Leave a Reply

%d bloggers like this: