Hello,
I am using Impact theme for my store. I have different images for all colors and sizes variants. I want when user click on brown and 11*7 size it will show only that size and color images .I tried many thing but nothing works for me. I have 4 different images for each size and color.
Hello @vishwa312
Welcome to Shopify Community.
Firstly kindly please check your theme features, as some theme already have this feature.
If your theme doesn’t have this feature, than it can be set via image alts. Here’s an example: https://orendashop.ch/products/viking-necklace
But this needs to be hard coded in the theme using theme’s default code. Thus I would recommend you to seek help from a developer at reasonable cost to set this up in your store.
Let me know if I can be helpful in anyways.
Thanks
Thank you. In my theme alt text is working but the thing is it’s only work for color variant but I want same thing for both color and size variant it is impossible for both variants using alt text?
Hello
It is not impossible, but no theme give this facility to group image with two variant option, but here alt can be designed in such way that it uses both the selected variant options, this will need tweaks with Liquid and JS both.
Ohk. Thank you.
I have another issue if you can help. I want buttons in one line I have total six button but when I give CSS to second line buttons it goes up on first line I want 3 button in one line and another 3 in second line. I tried some css but it’s not working.
you can see here my store: https://storageshedshop.com/products/11-ft-x-7-ft-wood-plastic-composite-heavy-duty-storage-shed-pent-roof-and-double-doors-graphite-color-77-sq-ft
Which buttons are you talking about ? Please give a screenshot.
sure.
when I try to give css for size 3 button inline it goes up with color buttons.
My store link:https://storageshedshop.com/products/11-ft-x-7-ft-wood-plastic-composite-heavy-duty-storage-shed-pent-roof-and-double-doors-graphite-color-77-sq-ft
Yes I am working on preview theme.
check this: https://storageshedshop.com/?_ab=0&_fd=0&_sc=1
go to proform collection and then go to any product
Thanks
Can you please wrap the all the color buttons in one div and all the size elements inside one div
This will solve the issue.
Thank you. I tried this but when I give common div class but it’s take separately for all the buttons not able to give common div for all the buttons. Can you please tell me how do I give common class for all three buttons.
liquid code for color button:
{%- when ‘button’ -%}
{%- if block.settings.text != blank -%}
{%- render ‘button’, content: block.settings.text, href: block.settings.link, size: block.settings.size, style: block.settings.style, stretch: block.settings.stretch, background: block.settings.background, text_color: block.settings.text_color -%}
preview link: https://storageshedshop.com/?_ab=0&_fd=0&_sc=1&preview_theme_id=167070695713
is it possible to provide the code editor access ? I will directly make the change in the code.
I don’t know how to give you code editor access. Is it possible if I can share product page file?
But I will have to check the setup.
You can send the site URL and collaborator code to the inbox mentioned in the signature.
Here is a free guide to understand the concept, show only selected variant images
Hi @vishwa312 I hope you already solved this problem for your shop. I would like to share the solution for people coming from search.
We have built Rubik app to solve the problem of displaying only images of selected variants even if you use multiple options like color and size and need to attach images to each combination of these selections. I also recorded video and explained how it works. With this solution you don’t have to touch alt_text of images which should be used for SEO purposes only.
