shortcode section how can I make it transparent or force background image

matthewlock

I'm using a shortcode on my front page for a music player which uses a shortcode. I'm inserting the shortcde using a "code" section but it has no other properties to select. I've tried adding a background image via custom css but I'm not getting any luck.

Please see screenshot. The white border around the radio player I need transparent or to specify a bg image.

Many thanks

matthewlock

the site is behind a coming soon plugin but this should work:

http://bigtimeradio.wales/?184392787

Pablo

Hello,

You should change the section background color to transparent, see the screenshot:

https://prnt.sc/rh1yo4

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

matthewlock

Thanks, it already is set like that. 
To further troubleshoot, I cloned the section and rather than have a short code for my radio player I replaced it with a video and that displays fine (see attached). I've left this in place for the moment if you want to take a look.

This leads me to think the theme is automatically adding padding to the shortcode area. Is there some css I can add to make sure there is no padding or that it is transparent?

Pablo

The "Column" item has the "margin-bottom" applied by the default, to disable it, please edit that item and set the 0px value in dropdown menu.

See screenshot:

https://prnt.sc/ri9j6k

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

matthewlock

This doesn't change the appearance at all. Would it be easier for you to take a look in my admin area?

matthewlock

I've been using the inspector in chrome and I can see where the problem is, specifically with the way pre codes are displayed and by unticking the boxes I can make it appear as desired but I don't know how to tell this to BeTheme

matthewlock

Specifically the line I've highlighted in the inspector. If I untick this line, the white border is gone and the item displayed is semi-transparent as wanted.

matthewlock

Ive almost done by editing the base.css file for the pre style.

But I've no idea if this will mess up how anything else is displayed?

Pablo

Please restore the original base.css file, do not change anything in that file!

It could break the CSS code of your website and it could make it work badly.

After restoring it, please disable the under-construction mode for a moment and send me a link to your website - it's hard to say where the problem is without looking at it.

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next