Child Theme Still experiencing issues – Zerif Lite

I had the same problem and what I did to fix it is I grabbed all the CSS from the parent theme and included it in the css for my child theme. Then I still do changes in the child theme. I know this is not how it’s supposed to work, but it’s an acceptable shortcut for me right now.

As also noted here, there is a problem in current version which causes the child-style getting added too early in header.

Currently I use this workaround in functions.php of child-theme, no additional @import, no additional wp_enqueue_scripts, only this:

function ov3rfly_parent_enqueue_scripts() {
	// remove dependencies and parent
	wp_dequeue_style( 'zerif_style_mobile' );
	wp_dequeue_style( 'zerif_responsive_style' );
	wp_dequeue_style( 'zerif_style' );

	// enqueue parent with new id (and from parent folder)
	wp_enqueue_style( 'zerif_parent', get_template_directory_uri() . '/style.css', array('zerif_pixeden_style'), 'v1' );
	// enqueue parents dependencies with new ids
	wp_enqueue_style('zerif_parent_responsive_style', get_template_directory_uri() . '/css/responsive.css', array('zerif_parent'), 'v1');
	if ( wp_is_mobile() ){
		wp_enqueue_style( 'zerif_parent_style_mobile', get_template_directory_uri() . '/css/style-mobile.css', array('zerif_bootstrap_style', 'zerif_parent'), 'v1' );
	}
	// enqueue child
	wp_enqueue_style( 'zerif_child', get_stylesheet_directory_uri() . '/style.css', array( 'zerif_parent', 'zerif_parent_responsive_style' ), '1.0' );
}
add_action( 'wp_enqueue_scripts', 'ov3rfly_parent_enqueue_scripts', 11 );

The code might look a bit weird at first, it removes what the parent theme (version 1.8.2.1) did and then simulates it again in child theme, with the correct order and dependencies.

Let me know if it works for you, thanks.

Thanks to both for your replies.

@ceptroctor I was thinking about doing exactly the same thing as you do. After I have imported all .css from the parent, start a bit of makeup from there. I will if I have to, but as you’ve stated it’s supposed to work in a different way.

@ov3rfly, I will try what you suggest here. Just one thing (I am a kind of newbie) do you suggest doing this plus grabbing all .css from parent theme or doing it right before you grab anything but the style.css you need for building the child theme?

I’m going to start by doing the second part of the question, which I have the feeling is what you are actually suggesting. I let you guys know.

Cheers.

It worked!
@ov3rfly, you are a genius!
Thanks a lot. Now child looks as it is supposed to look.

Do I also have to implement what you are suggesting in the other post, related to <div id=”content” class=”site-content”>?

I thank you in advanced if you let me know because I don’t know anything about the good that the implementation does to the theme. I will go for it if you say so, but I wait for your comment (after that I will set this topic as resolved).

Child theme: With the above fix in functions.php of child theme it is not necessary to copy any styles from parent.

Missing div: Would suggest to copy the file footer.php to the child theme folder and apply the fix there until the parent is updated.

Wozld also suggest to add these fixes to child theme style.css until parent is updated: responsive fix for long logo, height fix for headline.

All set.
Much appreciated. Thanks again.

Thanks a lot for your contributions Ov3rfly!

Next time feel free to suggest a pull request as well ??

https://github.com/Codeinwp/zerif-lite

@codeinwp: Off topic, pull requests by third parties are often never used and/or discussed to death, no time for that…

Have submitted bug reports earlier to themeisle support about zerif lite, actually also about exactly the issue in this thread, with unrelated answers, no time for that either…

That’s why I only post here, at least helps other people with similar problems to find answers…

Hey,

Pull Requests : Not in our case usually, we receive few enough to take them into consideration seriously :), but I also get your point.

By posting directly where the problem is and informing us I think you are doing a great job already! Sorry for the reactions, we have a problem on bridging our support team with the development one, so from time to time we miss such great suggestions and contributions.

Keep up the good work.

@ov3rfly, thanks a lot for sharing the code for functions.php. I’ve been using it to develop a Zerif-Lite child theme locally (WAMP) for the past few weeks and it is working great!

I’m trying to put the website online now in AWS and I’m having some issues. When the child theme is activated the page does not load. Only the Preloader displays and the html loads only up to </header> (although the navigation doesn’t get displayed). The functions.php file is exactly the same from Ov3rfly’s snippet above.

The parent theme works normally when activated.

Any ideas for a solution?

Some ideas:

1. Newer version of theme on AWS? The code above was written for 1.8.2.1 but is untested with current 1.8.2.8 release (works well with 1.8.2.3 but stopped updating after this due to no usable changelog).

2. Your AWS site might have WP_DEBUG set to true and some warning or similar breaks the output.

@ov3rfly: thanks for your answer!

1. I updated the theme to the 1.8.2.8 version and functions.php still works on my local server as is

2. wp-config in AWS has WP_DEGUB set to false, so that’s not the issue either.

I also installed the site in LAMP (Ubuntu) to check if it was an issue of compatibility with Windows, and the site works fine as long as it is in the local server.

I found a workaround to this issue. I was using an Amazon Linux instance so I tried and created a new AWS instance with Ubuntu and it’s working now. Thanks for the suggestions though!