Problem with styles not loading correctly

Hello @pascalbajorat ,

Could you please explain what exact style is not loading? For which block you have set the custom border styles.

If you could share the screencast or video or page URL it would be easy to understand your query.

Looking forward to hearing from you.

Regards,
Sweta

@swetakumari hey, thanks for your reply.

I mean for example this styles:
https://www.dropbox.com/s/s1d3173nsid8bls/Bildschirmfoto%202021-04-26%20um%2010.13.22.png?dl=0

The border settings are visible in the preview but not in the content at the website. We’re loading the content with the following code:

setup_postdata( $design_element );
the_content();
wp_reset_postdata();

For example:
This is the block in the preview:
https://www.dropbox.com/s/uin4lk662a0qh3h/Bildschirmfoto%202021-04-26%20um%2010.19.48.png?dl=0

And this is how it looks like at the website after loading with the code above:
https://www.dropbox.com/s/g89h1qxucr2btp3/Bildschirmfoto%202021-04-26%20um%2010.20.35.png?dl=0

Hello @pascalbajorat ,

It seems to be a CSS conflict. Can you please share the page URL so that we can debug the exact cause?

Looking forward to hearing from you.

Hey @swetakumari,

thanks and sure:
https://www.paartherapeut-in.de/blog/eifersucht-bekaempfen-eifersucht-ueberwinden/

But I can’t see a conflict within the CSS attributes of the website.
There are no conflicting attributes for border or box-shadow.

Maybe you see more than I.

best regards
Pascal

Hello @pascalbajorat ,

I’d suggest you to please add additional advanced CSS classes to your section block and then add your own custom CSS.

Here is an article that may help you out.

Let me know how it goes. Looking forward to hearing from you.

Regards,
Sweta

Hello @pascalbajorat ,

We haven’t heard back from you in a while, so I’m going to mark this as resolved – if you have any further questions, you can start a new thread.

Thank you!

Hey,

sure, I can add a custom class and custom css within the customizer.
But this is not really a solution for the client without knowledge of css.

Where do you store the CSS information of your plugin, I think it’s only a simple custom field we need to add in the output.

Hello @pascalbajorat ,

The CSS is created when we add any style like colors, border, etc to the block.

As you are using the following code:

setup_postdata( $design_element );
the_content();
wp_reset_postdata();

Due to which uagb-style-frontend is not loading. Like this.

You can use the following Custom CSS for adding borders like this.

.uagb-section__wrap {
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-right: 20px;
    margin-right: auto;
    margin-left: auto;
    border-style: solid;
    border-width: 2px;
    border-color: #000000;
    max-width: 900px;
}

I hope that helps.

Regards,
Sweta

Hey,

sure I think so too, how can we load uagb-style-frontend manually?
I think we need to add some php functions of your plugin to our integration.

kind regards
Pascal

Hello @pascalbajorat ,

The uagb-style-frontend is created when the block is present on-page.

And it seems that you are rendering the page through the the_content() hooks. Due to which style for section block is not applying on-page.

You need to create your custom CSS and need to add it to the customizer in order to work.

I hope that clarifies.

Regards,
Sweta