scrolling image

Retired Boards Appdev Store Design

Topic summary

Goal: Make the product page’s right-side collage information remain fixed while the collage images scroll.

What was tried:

  • A contributor suggested adding Custom CSS in the Shopify theme settings to make the collage info sticky on desktop:
    • CSS: a media query (min-width: 990px) targeting “#shopify-section-template–23551513526546__collage .title-wrapper” with position: sticky; top: 120px;.
  • Technical note: CSS position: sticky keeps an element fixed within the viewport after a scroll threshold; “top: 120px” sets the offset from the top.

Follow-up request:

  • The store owner asked to adjust behavior so the collage info sits at the top once about half of the section is scrolled (i.e., appear at the top earlier/at a different trigger).

Latest updates:

  • The original preview link expired; a new Shopify preview link was provided for further review.

Status:

  • Partially addressed. A baseline sticky solution is provided for desktop.
  • Pending: Guidance on refining the trigger/position so the info locks to the top (potentially changing top: 0 or using a different threshold). Awaiting review of the new preview link and specific selector/context.
Summarized with AI on December 18. AI used: gpt-5.
1

i am adding a link below of the product page of my website and when you scroll down you will see a collage section on it i want to add an effect that when i scroll down, the collage information on the right stays fix and the images move up eg. can i do this? if i can then can anyone guide me how?

page link

thank you so much for your valuable time

2

Hi @ibrahim2

You can try to add this code to Custom CSS in Online Store > Theme > Customize > Theme setting and check

@media (min-width: 990px) {
#shopify-section-template--23551513526546__collage .title-wrapper { 
    position: sticky; 
    top: 120px; 
}
}
3

@Dan-From-Ryviu thank you so much for the solution. but i want to ask one more thing that can i place the collage information on top like it is visible once half of the section is scrolled. can i change that to be on top?

4

Could you share the preview link again? The previous link has expired.

5

https://c54a22adnhq5wycx-90126713106.shopifypreview.com here it is