how to make product title stick while scrolling?

Solved
christian_russo
Pathfinder
159 1 39

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)
AvadaCommerce
Shopify Partner
3879 837 847

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
3879 837 847

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

christian_russo
Pathfinder
159 1 39

thanks!!

KetanKumar
Shopify Partner
36588 3628 11811

@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