Problem with styling when Yoast SEO plugin is activated

Hello guys! I hope you are doing well.

I have another problem and I will need some help.

The problem is that at the bottom of the regular posts I want to show some products which are related to the posts.

I am using this woocommerce shortcode – [products limit="8" columns="4"] – under each posts

When Yoast SEO plugin is activated the styling of these products are broken when the post is visited for first time – check the picture “Yoast SEO activated”, but the strange thing is that when I refresh the page the styling is OK, until I update the the post. Then again the syling is broken again – this means the page is visited for the first time, until I refresh the page – then styling is OK

When Yoast SEO is deactivated – there are no problems at all – check the picture “Yoast SEO deactivated”

Right now only these plugins are active on my website :

WooCommerce
Woodmart Core
WPBakery Page Builder
Yoast SEO

Regards

Attachments:

You must be logged in to view attached files.

Forgot to mention that no caching is enabled right now, and the cache of the browser is already cleared.

This problem can be seen on any browser.

I am giving you a link to a post at the private area – which I did not visit – so you can check this on your side if you want

I think I figured it out

When Yoast SEO plugin is Activated and when you open a single post for a first time all these styles are not loaded and I do not know what causes the blocking

wp-content/themes/woodmart/css/parts/woo-product-loop.min.css
wp-content/themes/woodmart/css/parts/woo-prod-loop-fw-button.min.css
wp-content/themes/woodmart/css/parts/woo-mod-add-btn-replace.min.css
wp-content/themes/woodmart/css/parts/woo-mod-quantity.min.css
wp-content/themes/woodmart/css/parts/woo-mod-quantity-overlap.min.css
wp-content/themes/woodmart/css/parts/mod-more-description.min.css
wp-content/themes/woodmart/css/parts/woo-categories-loop-default-old.min.css
wp-content/themes/woodmart/css/parts/woo-categories-loop-old.min.css
wp-content/themes/woodmart/css/parts/woo-opt-stretch-cont.min.css
wp-content/themes/woodmart/css/parts/woo-opt-products-bg.min.css
wp-content/themes/woodmart/css/parts/mod-sticky-loader.min.css
wp-content/themes/woodmart/css/parts/woo-opt-grid-gallery.min.css
wp-content/themes/woodmart/css/parts/lib-magnific-popup.min.css
wp-content/themes/woodmart/css/parts/woo-mod-stock-status.min.css

When Yoast SEO plugin is Deactivated and when you open a single post for a first time all these styles are loaded correctly

I had to create a code formyself in a functions.php so all the styles to be loaded correctly in a single post

/////////////////////////////////

function load_custom_styles_for_posts() {
if (is_single() && ‘post’ == get_post_type()) {
wp_enqueue_style(‘woo-opt-products-bg’, get_template_directory_uri() . ‘/css/parts/woo-opt-products-bg.min.css’);
wp_enqueue_style(‘woo-mod-quantity-overlap’, get_template_directory_uri() . ‘/css/parts/woo-mod-quantity-overlap.min.css’);
wp_enqueue_style(‘woo-mod-add-btn-replace’, get_template_directory_uri() . ‘/css/parts/woo-mod-add-btn-replace.min.css’);
wp_enqueue_style(‘woo-product-loop’, get_template_directory_uri() . ‘/css/parts/woo-product-loop.min.css’);
wp_enqueue_style(‘woo-prod-loop-fw-button’, get_template_directory_uri() . ‘/css/parts/woo-prod-loop-fw-button.min.css’);
wp_enqueue_style(‘woo-mod-quantity’, get_template_directory_uri() . ‘/css/parts/woo-mod-quantity.min.css’);
wp_enqueue_style(‘mod-more-description’, get_template_directory_uri() . ‘/css/parts/mod-more-description.min.css’);
wp_enqueue_style(‘woo-categories-loop-default-old’, get_template_directory_uri() . ‘/css/parts/woo-categories-loop-default-old.min.css’);
wp_enqueue_style(‘woo-categories-loop-old’, get_template_directory_uri() . ‘/css/parts/woo-categories-loop-old.min.css’);
wp_enqueue_style(‘woo-opt-stretch-cont’, get_template_directory_uri() . ‘/css/parts/woo-opt-stretch-cont.min.css’);
wp_enqueue_style(‘mod-sticky-loader’, get_template_directory_uri() . ‘/css/parts/mod-sticky-loader.min.css’);
wp_enqueue_style(‘woo-opt-grid-gallery’, get_template_directory_uri() . ‘/css/parts/woo-opt-grid-gallery.min.css’);
wp_enqueue_style(‘lib-magnific-popup’, get_template_directory_uri() . ‘/css/parts/lib-magnific-popup.min.css’);
wp_enqueue_style(‘woo-mod-stock-status’, get_template_directory_uri() . ‘/css/parts/woo-mod-stock-status.min.css’);
}
}
add_action(‘wp_enqueue_scripts’, ‘load_custom_styles_for_posts’);

///////////////////////////////////

The styles are loaded when you visit the post for the filrst time

The problem with this code is that when you refresh the page the styles are loaded twice – here is an example

wp-content/themes/woodmart/css/parts/woo-mod-quantity-overlap.min.css?ver=7.5.1
wp-content/themes/woodmart/css/parts/woo-mod-quantity-overlap.min.css?ver=6.5.4

I do not why two different versions are loaded, but for now I will stick with this code until you figured it out

Hello,

Please, confirm the permission for plugins deactivation, and switching to the parent/default theme. As soon as we complete the testing we will enable it all back. Also, send me access to the admin panel.

Thank you in advance.

Kind Regards.

[Author]

Posts