Child theme - copied some files from parent to child website still uses parent files

Question

I'm having some trouble with my child team and was wondering if anyone would know what can I do regarding my issue.

I have created a child theme from this theme: https://en-gb.wordpress.org/themes/colormag/

I was trying to inject a new area for a widget I created using hooks, on the same div where the header image is displayed. After some testing, I was not being able to do what I wanted so I decided to copy the relevant files from the parent theme into my child theme, make the change and be done with it.

The problem I'm having is in this part. I copied 2 files: header.php and header-functions.php, leaving the header file in the root of my theme and creating a similar path for the header-functions file. If you see the image at the end of the post, you will see that the website is using the header file on my child (replacing the parent header file) but it's still using the header-functions file from the parent theme. I have tries different things in order to make the website use my header-functions file instead of the parent file but or it didn't work or it broke my page (blank page).

Does anyone know how can I fix this and make it work correctly (I'm relatively new to the WP website structure).

(Note: In case anyone want to check, the function I'm interested in modifying is the function colormag_header_image_markup( $html, $header, $attr ) on the header-functions.php)

Many thanks in advance, - Miguel

Answer 1

Try to override the parent theme functions instead of creating your child theme header-functions.php file. Here is a reference on how it can be done : https://www.mhthemes.com/support/overriding-parent-theme-functions-child-theme-tutorial/

Check if the parent theme header-functions.php file is implementing pluggable functions. Then you can override them in your functions.php file.

Answer 2

You need to reference the child theme file so, you should put something like this in your functions.php:

// A constant to define the paths to our folders.
define('CHILD_THEME_FILE', __FILE__);
define('CHILD_THEME', trailingslashit(get_template_directory(CHILD_THEME_FILE)));
define('CHILD_THEME_INC_PATH', CHILD_THEME_PATH . 'inc/');
//load the file
require_once( CHILD_THEME_INC_PATH . 'header-functions.php' );

header.php its a file that you dont need to reference since its a known file for WordPress, the custom files like header-functions.php need to be loaded explicitly, since the function.php file of your child-theme will load first you can upload your version and the parent one will not load since its using require_once.

Answer 3

It's very easy to override the function via your child theme. See the following code:

add_filter( 'get_header_image_tag', 'colormag_header_image_markup', 10, 3 );

The theme you are using is actually overriding the theme's core filter which means you can override their code by using a higher priority (they use 10). Example:

function your_prefix_custom_header_image_markup() {

    // YOUR CUSTOMIZATIONS HERE

}
add_filter( 'get_header_image_tag', 'your_prefix_custom_header_image_markup', 40, 3 );

I used priority of 40 in the example so it overrides the theme, but you can use anything higher then 10 and it should work.

If this doesn't work you can always remove their action and add your own. Example:

// Your custom output
function your_prefix_custom_header_image_markup() {

    // YOUR CUSTOMIZATIONS HERE

}
add_filter( 'get_header_image_tag', 'your_prefix_custom_header_image_markup', 40, 3 );

// Remove the theme action
remove_action( 'colormag_header_image_markup_render','colormag_header_image_markup_filter' );

// Add your own action
function your_prefix_custom_image_header_tag_markup() {
    add_filter( 'get_header_image_tag', 'colormag_header_image_markup', 10, 3 );
}
add_action( 'colormag_header_image_markup_render', 'your_prefix_custom_image_header_tag_markup' );

Answer 4

Perhaps one of the answers above has worked for you... If not:

You don't want to copy the parent file to the child theme. Instead, create a new empty file with the same name in your child theme, then populate it with the snippets you need.

Hope that helps.

Oh, and you must mirror the path in your child theme folder also, so inc/header-functions.php.