[Ruben van Putten]

Hi,

I created a shortcode for WP Bakery content. However, it seems that colors and styling are not applied or incorrectly. For example background colors of a row or borders/shadows etc.

Example image for missing background color: https://imgur.com/a/WUBZz1Q

Any suggestions?

Thanks!

[Aakash]

Hi Ruben,

Thanks for using Shortcoder. It could be that the theme is overriding the background color on the page wherever the shortcode is inserted.

Since shortcoder does not manipulate the content, there is no way shortcoder can strip off the styles. If background color is the only style which is not working then it is definitely a theme styling/overiding issue. You can confirm this by adding other styles like font color, size etc.

If theme is overriding the style, then you need to inspect the style or check with the theme/plugin author and see how to reduce the specificity of the CSS style.

Hope this helps.

Thanks,
Aakash

[Ruben van Putten]

Hi,

Thanks. It wasnt just the color though. Borders, shadows, all were messed up. I now added extra styling for the shortcode blocks which fixed most.
However, one thing I cant find a solution for. In my original content I have a full width block with a green background. It looks perfectly fine when not using a shortcode (its even set to default in the original page), but when added as a shortcode it stays within the grid. Already stretched row + content without effect. No clue what might be going on there.
Do you have any suggestions what might be the issue?

Thanks!

[Aakash]

Hi Ruben,

Can you please share the page URl where that is seen?

Since shortcoder replaces the shortcode with the HTML content, the issue will happen even when you use HTML content directly instead of the shortcode.

I’ll try to look at your site’s layout and point out the reason.

Thanks,
Aakash

[Ruben van Putten]

Hi,

Absolutely. Here it is: https://verhuizen.icons.nl/lp/verhuisbedrijf-haarlem/

It is the green block a bit lower on the page.

[Aakash]

Hi Ruben,

Sorry for the late reply.

I see there is a container wrapped around the block. Is that expected? Can you please place the shortcode outside the container?

Please see the image below.

Thanks,
Aakash

[Ruben van Putten]

Hi,

Thanks for your reply. I now placed the shortcode on a testpage, same effect. https://verhuizen.icons.nl/test-3/

Backend: https://imgur.com/dzZPatu

[Ruben van Putten]

Hi,

Did you have any luck on this?

Thanks

[Aakash]

Hi Ruben,

The “template” used on the post has a “wrapper” which is of width 1250px.

So anything placed inside it will be contained within that wrapper.

In the image below, the region in “orange” is the boundary of the wrapper.

This has nothing to do with Shortcoder itself.
The solution will be to use a template from theme, which is “fluid” or has not container/wrapper for the post content.

Thanks,
Aakash

[Author]

Posts