I have some Icon bars that Apply to one type of product that I sell, but I don’t want it to show under the apparel that I sell. How can I hide the icon bar from just the apparel but not the consumable? or even better have a different icon list.
Hey SabaSurf.
Couple of ways to do this, depending on your knowledge:
-
Adding Tags to Products, then creating an if statement on them theme in liquid to display only if tag is present
-
Adding a metafield, say product.metafields.theme.icon_control (either as true/false) or single line text (I would probably go the latter), then see if the metafield is present with truthy or an if statement to display. I would do the later so I could add more controls later.
-
If the products are specifically in a category, you could if statement this via category.
@SabaSurf - can you please share the apparel page link? if it has unique css id then can be done via css, else it will need coding
Hello @SabaSurf ,
You can try to follow these steps:
-
Go to Online Store → Themes → Actions → Edit code
-
Go to Section → product.liquid file → modify the code that generates the icon bar like this:
{% if product.tags contains 'consumable' %}
{% endif %}
-
Repeat steps for any other relevant product-related files, such as the product grid or collection templates, if necessary.
-
Save changes
Hope this can help.
Ali Reviews team.
Hello @SabaSurf ,
You can try to follow these steps:
Go to Online Store → Themes → Actions → Edit code
Go to Sections → product-template.liquid
Modify the code that renders the icon bar within a conditional statement
{% if product.tags contains 'apparel' %}
{% comment %}
This product is apparel, so the icon bar will be hidden
{% endcomment %}
{% else %}
{% endif %}
Save changes
Hope this can help. Let us know if you need any further support.
Ali Reviews team.
Hello @SabaSurf
You can utilize conditional logic in your Shopify theme. Here’s a step-by-step guide to achieving this:
- Identify product category:
This could be done using product tags, product types, or collections.
For example product tags to category products.
-
Online store > Themes> Actions >Edit Code
-
Sections or Templated Directory
It might be in: ‘product.liquid’ or ‘product-template.liquid’
-
Within the product template file, locate the section of code that generates the icon bar.
-
Add the code responsible for rendering the icon bar within a conditional statement based on the product category (tag). example using Liquid syntax:
{% if product.tags contains 'apparel' %}
{% else %}
{% endif %}
Above example, if a product has the tag “apparel”, the code within the first {% if %} block will be executed, which can be left blank or modified to hide the icon bar. For products without the “apparel” tag, the code within the {% else %} block will be executed, displaying the icon bar.
6. Save the changes.
I am using the theme shapes. But I’m not sure how exactly to do this. I
don’t code so while this makes sense i don’t know what the code would be to
hide the bar and also don’t know where I would even put the code
There is a couple of ways to handle this:
- Alter the Feed into the snippet with a condition.
- Create a product template for Apparel and then design that product template separately for apparel.
If I was you, I would personally go #2 so you can make that page exactly what you want on the apparel page (and others if you feel like it).
