[Gelöst] Layout Not Inhereting Theme Styling

[Author]

Artikel

[aaronM-9]

I have a layout called "Layout-Product" assigned to the WooCommerce Products post type, and unfortunately it is now inhereting styles from the theme. For example, there is a solid white background when there should be slight transparency, and the size of the font for the post title in H1 is too small. I've attached a screenshot of a different post type that works properly for comparison, as well as the malfunctioning layout. Here are links to both:

Works: versteckter Link
Doesn't Work: versteckter Link

I have tried the following to try and fix:

1) Removed each individual section inside the layout - no effect.
2) Associated the post type with a completely different layout - styling still incorrect.

Could it be something related to the fact that it's a WooCommerce post type? Appreciate any help.

- Aaron

[Luo Yang]

Hello,

It is a CSS issue, Toolset Layouts plugin is based on Bootstrap framework, it will load Boostrap CSS styles, in your case, you can setup CSS codes to style it as what you want, for example:
Q1) there is a solid white background when there should be slight transparency
You can try below CSS codes:

.ast-woocommerce-container .product{
    background-color: transparent;
}

Q2) the size of the font for the post title in H1 is too small
You can try below CSS codes:

.single-product h1{
    font-weight: 600;
    font-family: FHA Condensed French;
    text-transform: inherit;
    margin: 0;
}

I have tested above CSS codes in the URL you mentioned above with my Chrome browser , it works fine, see screenshot, CSS.JPG

[aaronM-9]

Thanks - I was able to correct the issue using CSS.

- Aaron