Child Theme CSS issues

I am having the same problem, on two different sites. After updating from Version: 2.0.4 to 3.03, my child theme styles are not loaded.

Here’s how the child theme was being enqueued in functions.php:

if ( !function_exists( 'child_theme_configurator_css' ) ):
    function child_theme_configurator_css() {
        wp_enqueue_style( 'chld_thm_cfg_child', trailingslashit( get_stylesheet_directory_uri() ) . 'style.css', array( 'font-awesome','simple-line-icons','magnific-popup','oceanwp-style','oceanwp-woocommerce','oceanwp-woo-star-font','oceanwp-woo-quick-view','oceanwp-wishlist' ) );
    }
endif;
add_action( 'wp_enqueue_scripts', 'child_theme_configurator_css', 20 );

I saw the recommendations to disable and enable all scripts and styles in the Theme panel settings, but that didn’t help. I also disabled all plug-ins and still no change.

The only way I could get my child theme to load was to roll back OceanWP from a backup.

What can I do?

Hello All,

We’ve already used the “wp_enqueue_scripts” on the child theme, which you can use:
https://github.com/oceanwp/oceanwp-child-theme/blob/master/functions.php and put your code into this function: https://i.postimg.cc/cC2XMrSK/image.png

@xrisa30 — Please share your snippet code.

@denis24 — On your code, there is a mention of some other stylesheets.

Please ensure all styling has included on your website pages: https://i.postimg.cc/HnbKvwkG/image.png.

Please follow the steps explained in this link: https://developer.www.ads-software.com/themes/basics/including-css-javascript/.

When I changed your code, as I expected, I got the error 404: https://i.postimg.cc/L4rgzzP9/image.png.

I hope it helps.

Please keep us posted,
Best Regards

Hi @skalanter,

This is my snippet:

function oceanwp_child_enqueue_parent_style() {
	// Dynamically get version number of the parent stylesheet (lets browsers re-cache your stylesheet when you update your theme)
	$theme   = wp_get_theme( 'OceanWP' );
	$version = $theme->get( 'Version' );
	// Load the stylesheet
	wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css?t='.time(), array( 'oceanwp-style' ), $version );

}
add_action( 'wp_enqueue_scripts', 'oceanwp_child_enqueue_parent_style' );

Can you help me to make it work again like before?

Thank you
Xrisa

Hello @xrisa30,

You do not need to use an array in “wp_enqueue_style”: https://i.postimg.cc/br3CHxwP/image.png.

Please use the code below:

function oceanwp_child_enqueue_parent_style() {
	// Dynamically get version number of the parent stylesheet (lets browsers re-cache your stylesheet when you update your theme)
	$theme   = wp_get_theme( 'OceanWP' );
	$version = $theme->get( 'Version' );
	// Load the stylesheet
	wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css?t='.time(), array(), $version );

}
add_action( 'wp_enqueue_scripts', 'oceanwp_child_enqueue_parent_style' );

Use array() instead of array( 'oceanwp-style' ).

Result

Best Regards

• This reply was modified 3 years, 7 months ago by Shahin.

Hi @skalanter,

I tried the code that you gave me but the issue remains. It’s still like I don’t have child theme at all.

I don’t know what else to try. Everything worked fine before the latest update.
Are you sure that there is no problem with something else in the theme?

What can I do to fix it again?

Thank you.
Xrisa

Hi @xrisa30,

Thank you for reaching out,

Code should be work; perhaps this is a cache issue. Make sure to clear all caches.
Also, you can create a new file and copy all style.css to the new stylesheets file(custom-style.css).

And replace the function below:

function oceanwp_child_enqueue_parent_style() {
	// Dynamically get version number of the parent stylesheet (lets browsers re-cache your stylesheet when you update your theme)
	$theme   = wp_get_theme( 'OceanWP' );
	$version = $theme->get( 'Version' );
	// Load the stylesheet
	wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css?t='.time(), array(), $version );
	wp_enqueue_style( 'custom-style', get_stylesheet_directory_uri() . '/custom-style.css', array(), $version );

}
add_action( 'wp_enqueue_scripts', 'oceanwp_child_enqueue_parent_style' );

___

Another solution is using a third-party plugin, like this one:
https://www.ads-software.com/plugins/custom-css-js/

Best Regards

Hi @skalanter

Sorry but the issue remains the same.

I tried both of your solutions and nothing changed.

The only way to fix it is to rollback or use a plugin. That solutions is temporary of course because:

1. I’m pretty sure there is an issue in the theme, as I have this child theme from 2019 and I never had issues. Almost two years worked without problem. That means that you must check the theme and fix it.

2. I don’t want to use an extra plugin without a serious reason. The functions.php must be able to load the style.css like all these years.

As I wrote above, I don’t have any cache issues and is not possible to have, as I’m doing all these tests in my localhost.

So, I’m waiting a solution from you.

Thank you
Xrisa

Hello @xrisa30,

Thank you for reaching out to us,

We didn’t change anything related to the stylesheet in the theme, so we definitely cannot influence how child themes are created with third-party plugins “call” scripts.

Note: I’ve check this issue on my end on a fully customized website with an old version, and after the update, everything was fine. I believe there is an error in your code. According to my description, in older replicas, your code works in a fresh installed WordPress

As the Custom CSS area has priority over any style.css, you can copy/paste the entire CSS there. If the Customizer doesn’t want to save those changes, that means there’s an issue with the markup that came with the third-party editor, and codes need to be cleaned up. For checking that issue, you can use the import/export option for Customizer via WP Dashboard > Theme Panel > Import / Export.

Another solution is, install and activate the original child theme and then import those Customizer changes and always add Custom CSS via Customize > Custom CSS (Additional CSS):
https://docs.oceanwp.org/article/90-sample-child-theme

Also, one must really be a CSS expert to use child theme style.css as all classes must match the original theme classes. So, the best solution for CSS always is to use the field in the Customizer.

The solution for other child themes “locking” scripts based on the theme version they were created on is to use the original child theme, which calls all scripts regard.

Best Regards

I don’t think that this is the answer. I had a child theme that was working perfectly, I updated Ocean WP and it stopped working. Your only answer is to “use the customizer”?

@nomadcoder thank you for your support to my ticket. As you can see @denis24 and I have the same issue for months now and it seems that the support team doesn’t want to resolve it.

I think that the only way to find a solution to our problem is to contact direct Nicolas.

The issue remains for me after the ocean update and of course the use of customizer or the extra plugin without reason is wrong.

If this will remain like that, I will contact Nicolas to find a right solution.

• This reply was modified 3 years, 1 month ago by pl.xrisa.
• This reply was modified 3 years, 1 month ago by pl.xrisa.

@nomadcoder I just tried again to resolve this on my own and I finally found something.

In your functions.php that you have the function for the child theme add the priority 999 to the action of the function. It should be like that:

add_action( 'wp_enqueue_scripts', 'oceanwp_child_enqueue_parent_style', 999 );

and NOT like that:

add_action( 'wp_enqueue_scripts', 'oceanwp_child_enqueue_parent_style');

I already tried this in my localhost and the css works again as it should. Can you confirm that it works for you too?

Xrisa

@xrisa30 Hello, I think that you have me confused with the Ocean WP developers. I also have this issue and was not happy with the answer. Thanks for providing the solution to the Ocean WP team.

• This reply was modified 3 years, 1 month ago by A. Jones.

Ocean WP. It worked perfectly fine and now it doesn’t work any more. Your answer is not to fix it and make it work the way that it is supposed to work but to tell us to “Use the customizer”, which is not how themes are supposed to work. I don’t know how this got past the WordPress vetting process.

Please apply this fix. This used to be my goto theme. Many of my clients pay for add-ons. I’ve switched to Nieve.

• This reply was modified 3 years, 1 month ago by A. Jones.

@nomadcoder No, I know that you are not a developer and you have the same issue and you are not happy with their answers. I just wrote you “thank you” because you supported my ticket to prove that we still have this issue.

After that, I found a solution on my own, I tested it and I wrote again to you, to let you know about the solution so you can test it in your end and confirm that it works for you too, so I know is the right solution.

So, did you tested it? It works for you too?

@xrisa30

Ok! I was a little confused.

I have not tested it yet! I believe you that you found the fix. I will let you know.