Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].
Hello,
I’ve been looking for a way to outline in black my white and blue headlines in the hero widget, see here: https://bibleostervald.org
I tried to simply add shadows which would to the trick, but the built-in shadow option in the hero widget doesn’t appear on every side of the text (which is normal for a shadow).
So I tried to add a CSS code I found online within the hero widget to add shadows on each sides of the text:
but it doesn’t work, I guess because I’m really a beginner in CSS and I’m not able to fix it.
Could someone help with that please ?
the code:
h1
{
color: white;
text-shadow:
-1px -1px 0 #000,
1px -1px 0 #000,
-1px 1px 0 #000,
1px 1px 0 #000;
}
Hi Johanna,
Please open the hero widget you wish to apply the outline to and head over to the widget styles sidebar. Open the Attribute settings group and set the widget class to hero-header_outline. Open your hero frame and ensure you haven’t applied a custom color to the header (you have – switch to the text mode and remove the CSS or create a new header 3), then save.
Please navigate to WP AdminAppearanceCustom CSS and add the following CSS:
.hero-header_outline .sow-slider-base h3 { color: #fff; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000 !important; }You might also need to install the SiteOrigin CSS Editor.