Hello, I need help adding black outline to the image banner heading text in Ride theme
1 Like
Hi @BNMs , could you share the page link please so that I can write the CSS code for you?
Password: Test321
I will put the heading text a bit higher, so it’s hardly visible in the white background
Please add the below code to your theme’s CSS file.
.banner--desktop-transparent .banner__box {
background: rgb(0 0 0 / 68%) !important;
}
Notice I used 68% here. You can use 0 to 100 as the value of it per your need.
1 Like
Hi @BNMs
Do you mean you like to have line below the text?
Like this?
If it is check this one.
From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
Find the theme that you want to edit and click on “Actions” and then “Edit code”.
In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
h2.banner__heading.inline-richtext.h2 {
border-bottom: 2px solid black;
padding-bottom: 10px;
}
And Save.
Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!
1 Like
It worked, but I need a outline around the letters, this one made a black box 
It called text “stroke” I guess
Yes, for those letters, it worked, made a line between texts, but I need to make an outline around letters, like a shadow or “Stroke” I guess the right name for the effect
1 Like
Cause I’ll move the heading text a bit higher and it’ll be hardly visible in the white background
I already think that one, but im not sure if it is your trying to achieving.
Do you mean like this?
If it is, same instruction.
h2.banner__heading.inline-richtext.h2 {
-webkit-text-stroke: .5px black;
text-stroke: 1px black;
}
And save.
Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!
1 Like
Yesss! Thank You
1 Like