Add info sidebar product page

Store Design
1

Hi everyone!

I’m working on a custom product page and trying to understand how to implement a sidebar / drawer with variant-specific information, similar to what’s done on this product page:

Each variant opens a side panel with additional details and imagery related to the selected option, without reloading the page.

I’m using a custom Unsen-based theme and I’m comfortable working with Liquid, JS, and metafields, but I’d love to hear how others would approach building something like this in Shopify, or if there are any recommended patterns or tools.

Thanks in advance for any insights!

2

@vale Hi, this is usually built with variant metafields + JavaScript, not a native Shopify feature.

Common approach:

Store variant-specific content in variant metafields

Listen for variant change events in JS

Update and toggle a drawer/side panel dynamically without page reload

This works well with custom themes and gives full control over the UI.

4

Thanks so much for the insight! That’s really helpful. I can see now that it’s a bit more complex than I initially thought, but I’ll explore what I can achieve with this approach. Appreciate you taking the time to share it.

5

@vale Glad it helped. If this answer solved your question, please consider liking it and marking it as the solution so it can help others as well.