Add lines to each side of a title Testament theme

vanessa102 · ‎02-15-2024

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

Dan-From-Ryviu · ‎02-16-2024

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 & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.

View solution in original post

Dan-From-Ryviu · ‎02-15-2024

Hi @vanessa102

Could you share your store URL to check?

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.

vanessa102 · ‎02-15-2024

Yes, url is www.magickearthcrystals.com.au

Thank you

Dan-From-Ryviu · ‎02-15-2024

Please give me preview URL of your unpublish theme

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.

Dan-From-Ryviu · ‎02-15-2024

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 & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.

vanessa102 · ‎02-15-2024

that code hasn't worked 😞

vanessa102 · ‎02-15-2024

https://dzvze7yyuz7gwxi0-49796645021.shopifypreview.com

is this the correct one?

Dan-From-Ryviu · ‎02-16-2024

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 & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.

vanessa102 · ‎02-21-2024

Thank you that worked.

Add lines to each side of a title Testament theme

Add lines to each side of a title Testament theme

Community Blog Articles