how to make product title stick while scrolling?

Solved
christian_russo
Explorer
116 1 31

hi!

 

when I scroll my product images the description sticks in place but de title dissapears how can I make the title stick?

www.gallerychristian.com

password: Christianshop123

 

Schermafbeelding 2022-03-20 om 20.38.08.pngSchermafbeelding 2022-03-20 om 20.38.38.png

 

thank you

Christian Russo 

Accepted Solution (1)

Accepted Solutions
AvadaCommerce
Shopify Partner
3077 702 571

This is an accepted solution.

Hi @christian_russo ,

 

You can follow the instruction below:

1. Go to Online Store->Theme->Edit code
2. Asset->/ section-main-product.css->paste below code at the bottom of the file:

@media (min-width: 750px) {
    .product--stacked .product__info-container--sticky {
        top: 7rem !important;
    }
}

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

AVADA - Top Rated App for Email, SMS, Popups


Check our website for full features and start a FREE TRIAL.
Install another app to boost sales, 100% FREE

View solution in original post

Replies 3 (3)
AvadaCommerce
Shopify Partner
3077 702 571

This is an accepted solution.

Hi @christian_russo ,

 

You can follow the instruction below:

1. Go to Online Store->Theme->Edit code
2. Asset->/ section-main-product.css->paste below code at the bottom of the file:

@media (min-width: 750px) {
    .product--stacked .product__info-container--sticky {
        top: 7rem !important;
    }
}

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

AVADA - Top Rated App for Email, SMS, Popups


Check our website for full features and start a FREE TRIAL.
Install another app to boost sales, 100% FREE

KetanKumar
Shopify Partner
31423 3137 10516

@christian_russo 

oh sorry for that issue 

can you try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/section-main-product.css->paste below code at the bottom of the file.

@media (min-width: 750px) {
    .product--stacked .product__info-container--sticky {
        top: 10rem !important;
    }
}

 sorry but i have notice too much bigger tick mark show on page load do you know this?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
christian_russo
Explorer
116 1 31