Text Highlight*

Solved
Tourist
10 0 1

Hi everyone!

 Does anyone know how to highlight the text that way? Not underline, but highlight. It is a low highlight behind the text.

Thanks!

 

Untitled.jpg

0 Likes
Highlighted

Hello @anaiscopy,

Can you please share your site url

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
Tourist
10 0 1
0 Likes
Highlighted
Shopify Partner
1027 226 319

Hey, please see this.

 


txtshadow.png

 

Hope this helps!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes
Highlighted
Tourist
10 0 1

Thanks for the reply!

 It is not, however, the attached picture example. It is not a shadow, it is a highlight, but halfway. 

See below website. The website that is below is made with Squarespace.

https://thirtyeightvisuals.com/blog/low-highlight-heading-links-squarespace

0 Likes
Highlighted
Shopify Partner
1027 226 319

Thanks for explanation. I got that but is it not working for you ?

 

.highlight {
  background: linear-gradient(180deg,rgba(255,255,255,0) 50%, #FFD0AE 50%);
}
If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes
Highlighted
Tourist
10 0 1

I don't know because I don't know where to insert, and what to insert. Would that code from Squarespace work on Shopify?

0 Likes
Highlighted
Shopify Partner
1027 226 319

This is normal CSS class and it will work with shopify as well.

You can paste this css in Online Store->Theme->Edit code->Asset->theme.scss.liquid file.

 

I tried offline. You can check screenshot

 

nclsss.jpg

Where you want to put this highlight in your website in shopify ?

Let me know. I will try to give solution.

 

Thanks!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes
Highlighted
Tourist
10 0 1

I don't have that theme.scss.liquid nowhere. Well, on the homepage and on the product page. I would like to play with it to see where it looks better, so not in a specific place for the moment. What I got from the support team where I bought the theme is this, but it just underlines it, not highlight it. They didn't understand. Or they don't want to bother.

.title-module .rich__heading h4.size--28 {
    text-decoration: underline;
    text-underline-position: under;
    text-decoration-color: #ff0000;
}
.template-product .icons-row__title {
    border-bottom: 5px solid #ff0000;
}
0 Likes
Highlighted
Shopify Partner
1027 226 319

This is an accepted solution.

You have style.scss in your theme. You shown that css, where it is from ? means which file it is ?

try to put background

background: linear-gradient(180deg,rgba(255,255,255,0) 50%, #FFD0AE 50%);

in that css class where you would like that highlight.

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes