After you have got a child theme and learned how to customize the theme template files, you might now want to know how you can customize theme functions to make everything fit with your requirements.
Please keep reading and you will find the information you need to know in the instruction below. Again, we are still using the Fineliner theme to demonstrate some parts in the series.
Finding the Correct Functions
The first thing you would have to do is to find the right functions you want to customize. Technically, you need to read and track the code in a theme.
Don’t know where to start? We would suggest opening the functions.php file of a parent theme as it is the file that is used when the theme code is initialized. Start with that file and you will know in detail how the theme works. If a theme author added comments in the code, that would be very helpful for you to find the right bit you are looking for.
In our Fineliner theme, we added comments in each section of the code in the functions.php file. So, when you are reading it, you can know what are the related files that store the functions you need.
However, themes from different authors usually have different file and folder structures. Some authors might also have documentation for developers. If you are not sure about the code, we would recommend asking the author of the theme you are using.
How to Customize Theme Functions?
Once you find the functions you need, the next thing to do is to make sure that the functions are “pluggable.” The word “pluggable functions” means that the functions can directly be overridden in a child theme. You can tell if the functions are wrapped with the if-else block of the function_exists() function.
For example, in the custom-uxbarn-portfolio.php file of the Fineliner theme, we have a function that stores the strings of the portfolio post type like this:
[php]
if ( ! function_exists( ‘uxbarn_custom_port_cpt_args’ ) ) {
function uxbarn_custom_port_cpt_args( $args ) {
$args = array(
‘label’ => __( ‘Portfolio’, ‘uxbarn’ ),
‘labels’ => array(
‘singular_name’ => __( ‘Portfolio’, ‘uxbarn’ ),
‘add_new’ => __( ‘Add New Portfolio Item’, ‘uxbarn’ ),
‘add_new_item’ => __( ‘Add New Portfolio Item’, ‘uxbarn’ ),
‘new_item’ => __( ‘New Portfolio Item’, ‘uxbarn’ ),
‘edit_item’ => __( ‘Edit Portfolio Item’, ‘uxbarn’ ),
‘all_items’ => __( ‘All Portfolio Items’, ‘uxbarn’ ),
‘view_item’ => __( ‘View Portfolio’, ‘uxbarn’ ),
‘search_items’ => __( ‘Search Portfolio’, ‘uxbarn’ ),
‘not_found’ => __( ‘Nothing found’, ‘uxbarn’ ),
‘not_found_in_trash’ => __( ‘Nothing found in Trash’, ‘uxbarn’ ),
),
‘menu_icon’ => UXB_THEME_ROOT_IMAGE_URL . ‘admin/uxbarn-admin-s.jpg’,
‘description’ => __( ‘Portfolio of your business’, ‘uxbarn’ ),
‘public’ => true,
‘show_ui’ => true,
‘capability_type’ => ‘post’,
‘hierarchical’ => false,
‘has_archive’ => false,
‘supports’ => array( ‘title’, ‘editor’, ‘thumbnail’, ‘revisions’, ‘comments’ ),
‘rewrite’ => array( ‘slug’ => __( ‘portfolio’, ‘uxbarn’ ), ‘with_front’ => false )
);
return $args;
}
}
[/php]
Then we know that the uxbarn_custom_port_cpt_args() function is pluggable and can be overridden in a child theme.
To customize the function, just copy only the function block (NOT including the function_exists() wrapper) and put it in the functions.php file of the child theme you created. You can then customize the code from there as you want.
In this case, we want to change the word from “Portfolio” to “Works.” As a result, we customized it like this in the functions.php file of the child theme:
[php]
function uxbarn_custom_port_cpt_args( $args ) {
$args = array(
‘label’ => __( ‘Works’, ‘uxbarn’ ),
‘labels’ => array(
‘singular_name’ => __( ‘Work’, ‘uxbarn’ ),
‘add_new’ => __( ‘Add New Work Item’, ‘uxbarn’ ),
‘add_new_item’ => __( ‘Add New Work Item’, ‘uxbarn’ ),
‘new_item’ => __( ‘New Work Item’, ‘uxbarn’ ),
‘edit_item’ => __( ‘Edit Work Item’, ‘uxbarn’ ),
‘all_items’ => __( ‘All Work Items’, ‘uxbarn’ ),
‘view_item’ => __( ‘View Work’, ‘uxbarn’ ),
‘search_items’ => __( ‘Search Work’, ‘uxbarn’ ),
‘not_found’ => __( ‘Nothing found’, ‘uxbarn’ ),
‘not_found_in_trash’ => __( ‘Nothing found in Trash’, ‘uxbarn’ ),
),
‘menu_icon’ => UXB_THEME_ROOT_IMAGE_URL . ‘admin/uxbarn-admin-s.jpg’,
‘description’ => __( ‘Works of your business’, ‘uxbarn’ ),
‘public’ => true,
‘show_ui’ => true,
‘capability_type’ => ‘post’,
‘hierarchical’ => false,
‘has_archive’ => false,
‘supports’ => array( ‘title’, ‘editor’, ‘thumbnail’, ‘revisions’, ‘comments’ ),
‘rewrite’ => array( ‘slug’ => __( ‘works’, ‘uxbarn’ ), ‘with_front’ => false )
);
return $args;
}
[/php]
The word will finally be displayed as “Works” on both the back end and front end after the change.
Tip: To find and edit the code right in the WordPress admin area, we recommend WPide plugin for the job.
What If the Functions are not Pluggable?
In general, if the functions are not wrapped with the function_exists(), they are not overridable in a child theme using the above method. However, if the functions are called via action or filter hooks in a parent theme, it is possible to customize them in a child theme.
Note that in the Fineliner theme, we have made all of the theme functions pluggable, so you can easily override them in a child theme. In this section, we are going to tell you how to customize the functions that are called via action or filter hooks. You can also choose to use this method when customizing the Fineliner theme if you like.
We are not going to cover the details about action and filter hooks in this article as we want to give you the direct how-to instruction. For more information about actions and filters, you can read in the following official documentation provided by WordPress:
- https://developer.wordpress.org/reference/functions/add_action/
- https://developer.wordpress.org/reference/functions/add_filter/
- https://codex.wordpress.org/Plugin_API/Action_Reference
- https://codex.wordpress.org/Plugin_API/Filter_Reference
Customizing Functions that are Called via Action Hooks
Suppose a parent theme has the code like this:
[php]
function parent_function_does_something() {
// Content of the function
}
add_action( ‘init’, ‘parent_function_does_something’ );
[/php]
Note that in the real scenario, the function and action might be separately stored in different files. We are trying to make it simple in our example.
You will see that the function is not pluggable but it is called via the action init. In this case, you cannot use the same function name in a child theme as it will generate an error. The steps you need to do to customize it are as following:
1. Remove the action hook of the parent theme
In the functions.php file of a child theme, you firstly need to remove the action hook you want to customize by using the code like this:
[php]
function child_init_function() {
remove_action( ‘init’, ‘parent_function_does_something’ );
}
add_action( ‘after_setup_theme’, ‘child_init_function’, 99 );
[/php]
Note that when removing an action, you must specify all the parameters of the action to be exactly the same as the original action in the parent theme.
For example, if the original action is:
[php]
add_action( ‘init’, ‘parent_action_with_priority’, 20 );
[/php]
You have to use it like this in a child theme:
[php]
remove_action( ‘init’, ‘parent_action_with_priority’, 20 );
[/php]
2. Create a new function and action in a child theme
Then you need to create a new custom function to be called via a new action hook in the functions.php file of a child theme. The function here is the one you add custom code.
If you want to adjust some part of the original code, you can just copy the content from the parent theme’s function (it is the parent_function_does_something() in this case) and put them in the custom function you just created and edit it from there.
The final code in this step will look like this:
[php]
function child_function_does_new_things() {
// Your custom code
}
function child_init_function() {
remove_action( ‘init’, ‘parent_function_does_something’ );
add_action( ‘init’, ‘child_function_does_new_things’ );
}
add_action( ‘after_setup_theme’, ‘child_init_function’, 99 );
[/php]
Your child theme should now use the custom code you just added and dropped the use of the specified action and function of the parent theme.
Customizing Functions that are Called via Filter Hooks
This is a bit easier than customizing actions with functions mentioned above. Suppose a parent theme contains this filter hook:
[php]
function uxbarn_new_excerpt_more( $more ) {
return ‘…’;
}
add_filter( ‘excerpt_more’, ‘uxbarn_new_excerpt_more’ );
[/php]
You can override the returned value of the function by using the code below in a child theme:
[php]
function child_new_excerpt_more( $more ) {
return ‘<a href=’ . get_permalink() . ‘>Read more</a>’;
}
add_filter( ‘excerpt_more’, ‘child_new_excerpt_more’, 99 );
[/php]
In this example, the “Read more” link will be used instead of the “…” text at the end of the trimmed excerpt.
Conclusion
Customizing the functions of a parent theme is more complicated than customizing the template files and CSS code. But it allows you to make changes to the theme at a detailed level in most areas (if the theme fully supports that). It gives you the flexibility to adjust the functionality of the theme as you want.
In the next article of the series, we will talk about how to customize the CSS styling of the theme. See you soon!
- Create and Use a WordPress Child Theme with UXBARN Themes
- Customize Theme Template Files via a Child Theme
- Customize Theme Functions via a Child Theme
- Customize Theme CSS via a Child Theme