Solved

Add lines to each side of a title Testament theme

vanessa102
Shopify Partner
7 0 1

I'm in the process of upgrading to a new version of my websites theme and on the old version i had lines on each side of each title. Can someone help me to add the lines into the new version before i publish it.

Image of the lines I want. 

I did see this question asked before but the code did not work for me.

Thank you

Screen Shot 2024-02-16 at 12.54.24 pm.png

Accepted Solution (1)
Dan-From-Ryviu
Shopify Partner
7532 1454 1450

This is an accepted solution.

 

Please update the code

<style>
.rich__text-section:after,
.section-title:after {
    content: "";
    width: 100%;
    display: inline-block;
    border-bottom: 1px solid #000000;
    position: absolute;
    left: 0;
    top: 50%;
    z-index: 0;
}
.rich__text-section h3,
.section-title h1, 
.section-title h2 {
    display: inline-block;
    padding: 8px 23px;
    margin: 0;
    background-color: #fff;
    position: relative;
    z-index: 1;
}
</style>

 

- Helpful? Like or Accept solution! - Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

View solution in original post

Replies 8 (8)

Dan-From-Ryviu
Shopify Partner
7532 1454 1450

Hi @vanessa102 

Could you share your store URL to check?

- Helpful? Like or Accept solution! - Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

vanessa102
Shopify Partner
7 0 1

Yes, url is www.magickearthcrystals.com.au

Thank you

 

Dan-From-Ryviu
Shopify Partner
7532 1454 1450

Please give me preview URL of your unpublish theme

- Helpful? Like or Accept solution! - Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

Dan-From-Ryviu
Shopify Partner
7532 1454 1450

Or you can try to add this code to your theme.liquid file after <head> in Online Store > Themes > Edit theme (your unpublish theme)

<style>
.section-title.lines:after {
    content: "";
    width: 100%;
    display: inline-block;
    border-bottom: 1px solid #000000;
    position: absolute;
    left: 0;
    top: 50%;
    z-index: 0;
}
</style>

- Helpful? Like or Accept solution! - Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

vanessa102
Shopify Partner
7 0 1

that code hasn't worked 😞 

vanessa102
Shopify Partner
7 0 1
Dan-From-Ryviu
Shopify Partner
7532 1454 1450

This is an accepted solution.

 

Please update the code

<style>
.rich__text-section:after,
.section-title:after {
    content: "";
    width: 100%;
    display: inline-block;
    border-bottom: 1px solid #000000;
    position: absolute;
    left: 0;
    top: 50%;
    z-index: 0;
}
.rich__text-section h3,
.section-title h1, 
.section-title h2 {
    display: inline-block;
    padding: 8px 23px;
    margin: 0;
    background-color: #fff;
    position: relative;
    z-index: 1;
}
</style>

 

- Helpful? Like or Accept solution! - Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

vanessa102
Shopify Partner
7 0 1

Thank you that worked.