Displaying product vendor in accordion

Solved
dwiemas
Tourist
8 1 1

Hello! I want to display the product vendor name within the accordion tab ("expandable boxes" as they say in the default template) on the product template page. I have chosen to create a new page called vendor and collecting vendor information using the following piece of code with the text value:

<span class="vendor">{{ product.vendor }}</span>

But it seems to not work and the data is not been collected.

Storefront:

dwiemas_0-1635304584136.png

 

I would like to get some technical help here from the forum.

Accepted Solution (1)

Accepted Solutions
dwiemas
Tourist
8 1 1

This is an accepted solution.

It might be an ineffective method to solve this issue but I tried to add {{ product.vendor }} within tab3_content since the content of the Vendor Tab in the product page was coming from tabs.liquid.

So I located tab3_content within tabs.liquid nd replaced {{ tab3_content }} with {{ product.vendor }}:

{%- if tab3_title != blank and tab3_content != blank -%}
    <div class="cc-tabs__tab" role="tablist">
      {%- if display_type == "accordion" -%}
        <a href="#" class="cc-tabs__accordion__header" role="tab" aria-selected="{% if allow_multi_open %}true{% else %}false{% endif %}"
           aria-controls="product-tab-panel3_{{ tabId }}" data-cc-toggle-panel="3_{{ tabId }}">
          {{ tab3_title }}
        </a>
      {%- endif -%}
      <div class="cc-tabs__tab__panel rte" {% if allow_multi_open == blank %}hidden=""{% endif %} role="tab" id="product-tab-panel3_{{ tabId }}"
           aria-labelledby="product-tab-panel3_{{ tabId }}">
        {{ product.vendor }}
      </div>
    </div>
  {%- endif -%}

It is doing the job for now, but might encounter problems later on.

See how the product vendor renders within the tabs on product page below:

dwiemas_0-1635932667789.png

 

 

Thanks for the help everybody!!

View solution in original post

Replies 14 (14)
Ajay_kumar_dev
Shopify Partner
166 14 12

Hi @dwiemas , you can share the required details, will help you out.

Expert Shopify Developer & Theme customizer
- If the problem is solved remember to click ✅ to Accept Solution
- Press Like ?? if the answer was helpful
- Still, Facing issue, Reach out to me Email :- kmajay8888@gmail.com | Skype :- kmajay888
Evgeniy-M
Excursionist
35 6 7

Hi @dwiemas . Could you clarify what do you mean by "collecting vendor information" and where did you put the mentioned code.

The code that you provided is intended to display the vendor from a product:

EvgeniyM_0-1635319777415.png

Is the field that what you want to display?

Liquid Ajax Cart — a Javascript library to build Shopify Ajax Carts using plain Liquid templates.
dwiemas
Tourist
8 1 1

I have added the code in the page editor for the Vendor page.

dwiemas_0-1635321932393.png

I want the vendor name to be shown in one of the accordion tabs instead of the usual place which is above the product title. And of course, I want it to be dynamic in all the product pages.

Evgeniy-M
Excursionist
35 6 7

Unfortunately it is not possible to do without changing the source code of your theme.

If you want to do this I would ask you to share your store URL address so I can understand where the tabs are and then I'll ask you to share the screenshot of a file from your store source code so I could tell you what you need to change.

Liquid Ajax Cart — a Javascript library to build Shopify Ajax Carts using plain Liquid templates.
Ajay_kumar_dev
Shopify Partner
166 14 12

@dwiemas  yes, kindly share the url, so that we can look into the issu

Expert Shopify Developer & Theme customizer
- If the problem is solved remember to click ✅ to Accept Solution
- Press Like ?? if the answer was helpful
- Still, Facing issue, Reach out to me Email :- kmajay8888@gmail.com | Skype :- kmajay888
dwiemas
Tourist
8 1 1

Which source code file would you specifically need to have a look at? @Evgeniy-M 

Evgeniy-M
Excursionist
35 6 7

@dwiemas First, I would like to see the website, so I can understand approximately what source file I need to see  

Liquid Ajax Cart — a Javascript library to build Shopify Ajax Carts using plain Liquid templates.
dwiemas
Tourist
8 1 1

Let me get back you with the link, since it's password protected now.

dwiemas
Tourist
8 1 1

@Evgeniy-M Here's the link to the product page: https://dwi-emas-bazaar.myshopify.com/products/bottles

Enter with password: dwiemas