How to hide variant if there is online one available

How to hide variant if there is online one available

Jeanne8
New Member
11 0 0

Hi so I am trying to remove the variant like the USB one, since there is only one and i don't want to delete the variant but more just to hide it. My website is Pixeoprint.com

Capture d’écran 2024-03-17 021145.pngCapture d’écran 2024-03-17 021043.png

Replies 6 (6)

deepaksharma
Shopify Partner
448 63 97

Hey @Jeanne8 

 

Head to Online Stores> Themes> Edit Code

 

open file called theme.liquid and just before the end of body tag paste this code

 

  {% if product.variants.size <= 1 %}
      <style>
        .product-form__input, .product-form__input--pill{
          display: none;
        }
      </style>
    {% endif %}

 

If you are unable to implement the same then I'm happy to do this for you, let me know. I can implement the code changes so that this will work well for you.

 

Hopefully, it will help you. If yes then Please don't forget to hit Like and Mark it as the solution!

Deepak Sharma || Shopify Developer || Helping eCommerce Stores
- Was my reply helpful? Accept it as solution
- Was your question answered? Mark it as an Accepted Solution.
-CHAT ON WHATSAPP | BUY ME A COFFEE | MAIL ME: ds2305187@gmail.com
Jeanne8
New Member
11 0 0

Hi,

Thank you for answering! What is ''before the end of body tag''? I tried copy pasting at then end but it's style there.

deepaksharma
Shopify Partner
448 63 97

Prefer this screenshot

deepaksharma_0-1710735413549.png

 

Deepak Sharma || Shopify Developer || Helping eCommerce Stores
- Was my reply helpful? Accept it as solution
- Was your question answered? Mark it as an Accepted Solution.
-CHAT ON WHATSAPP | BUY ME A COFFEE | MAIL ME: ds2305187@gmail.com
Jeanne8
New Member
11 0 0

Thank you for reply. I just did it but it didn't changed

Jeanne8
New Member
11 0 0

Hi, are you still there?

PageFly-Oliver
Shopify Partner
878 190 175

Hi @Jeanne8 ,

 

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file theme.liquid

Step 3: Paste the below code at the bottom of the file -> Save

 

<style>
.swatch--gl:has([data-name="Electrical Outlet"]){
display:none !important
}
</style>

 

 

Hope my solution works perfectly for you!

Best regards,

Oliver | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.