Hi,
I am using the Siteorigin Hero Image to build a slider for my homepage. For one frame, in order for my text to stand out against a background image, I’d like to put a semi-transparent box around my text. Is that possible?
thanks,
Johannes
Hero Image – Text Box (Semi-transparent background)
This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.
Hi Johannes,
I can definitely help you with this. It’s slightly out of the scope of the default widget so I’ll have to write some custom CSS to do this. Do you have a public URL where we can take a look at your hero widget? If you need to keep this URL private from other users, just select “Private Reply” on the bottom right of the comment box.
This is a private message.
This is a private message.
Hi Alex
I’m experiencing exactly the same issue as Johannes. I cannot provide you with an url by now, as i’m working offline, but my point is: would it be posible for you to post a, say, “general css code” solution that, preserving Johannes privacy, could allow the rest of SO users to get an idea on how to solve this issue? As a suggestion, this could be also a good general practice for all the cases involving private messages, as long as everybody could benefit from the proposed solution.
Thanx in advance :-)
Hi Picaporte,
Typically it’s not possible to provide generic CSS as it’s too specific to the user. As such, we use a PM as CSS that doesn’t work as desired just adds to the frustration that the person is already having. :( Awkwardly, this isn’t the case with this reply and I have no idea why I marked it as private. Here’s the full post:
Thank you for the kind words. :) I didn’t realise you were using a hero widget when I asked for your link. This is actually quite possible within the confines of the widget itself. Open up your hero widget, select the frame, switch to the text tab, and then wrap the contents of the content field with:
Then save your widget. Navigate to AppearanceCustom CSS and you’ll get our custom CSS editor. Just add the following code.
.homepage-cta_box { background: rgba(0,0,0,.2); display: inline-block; padding: 5px;}Obviously, this CSS will have to be adjusted to your liking. However, the above CSS is just a start. If you need help with adjusting it please feel free to ask. You might also need to install the SiteOrigin CSS Editor.
Alex,
Yep! You rule! It worked like a charm ;-)
You the SO team are doing a great great job. Thanx a lot!