Business Catalyst: Display Product Dimensions in Online Shop Layouts - e-commerce

When setting up a product in Business Catalyst, there is a Product Dimensions section in which one can enter the following information:
Product Weight in Grams
Product Width in MM:
Product Height in MM:
Product Depth in MM:
The BC docs on Online Shop Layouts don't include any reference to {tag_dimensions} or similar and I have been unable to find any information online.
Is it possible to output the Product Dimensions in BC's Online Shop?

Yes! This is possible using {module_data}!
The following, inserted into either the Small Product Layout or Large Product Layout will use the ID of the product in question and output the product dimensions of that product as JSON data.
{module_data resource="products" version="v3" fields="productVolume,productHeight,productDepth" skip="0" limit="10" where="\{'catalogs.productId':'{{id}}'\}" order="id" collection="myData"}
From there the JSON data can be used to display the product dimenions, for example:
{% for item in myData.items -%}
<table>
<tbody>
<tr>
<th>Width</th>
<th>Height</th>
<th>Depth</th>
</tr>
<tr>
<td>{{item.productVolume}}</td>
<td>{{item.productHeight}}</td>
<td>{{item.productDepth}}</td>
</tbody>
</table>
{% endfor -%}

Related

Shopify get lowest price product if available in product having same title

I have duplicate products which offer same size or different size products with same title but vendors is different. I want to display products which ever cheaper in my website. So my website will always display products from one vendor only ( Which ever cheaper ). In product details page i want to check this logic to find the same title products from different vendors. I tried the below code . When i given the handle statically then it is showing other vendor products finely. I want to make it dynamic. Can anybody help me on this.
Now i want to display the lowest price product if available.
Product is having different sku,handle, price but title is same.
Please help me to show lowest price product.
{% assign some_handle = product.handle %}
{% assign custom_product = all_products[some_handle] %}
{{ product.title }} is {{ product.price | money }}, but {{ custom_product.title }} is {{ custom_product.price | money }}
i tried this code in product_template.liquid file but it is not working as expected.

Pulling metafields for variants in Shopify

I am trying to pull metafields for variants and/or single products.
Effectively i have a catalog of products, some are simple products some have variants. For instance, some products are beds with variants of different sizes. therefore the metafield dimensions are different for these products.
I am unaware if there is a liquid command to pull full array of metafields of a product.
What i am looking to implement is.
Define if product has variants.
if yes -> Pull array/list of variant metafields for selected variant.
if no -> pull list of array/list of product metafields.
i am capable of showing product metafield values or variant values such as below, however this does not feel efficient and i am unable to determine if the product is a variant or single product.
{%- if product.metafields.global.length_cm.value != blank -%}
<tr>
<td>Seat Width (cm)</td>
<td>{{ product.metafields.global.seat_width_cm.value }}</td>
</tr>
{%- endif -%}
{%- if product.metafields.global.width_cm.value != blank -%}
<tr>
<td>Seat Depth (cm)</td>
<td>{{ product.metafields.global.seat_depth_cm.value }}</td>
</tr>
{%- endif -%}
is there a way also to inject code into a liquid command.
such as something along the lines of this?
{% assign main_dimensions = "width_cm, height_cm, depth_cm, length_cm" | split: ','%}
{% assign main_dimensions_title = "Width (cm), Height (cm), Depth (cm), Length(cm)" | split: ','%}
{{ main_dimensions_title[1]}} - {{ product.metafields.global.main_dimensions[1].value }}

Shopify check how many orders a product has

Is possible to check how many orders/purchases a product has?
For example if a product has 3 orders/purchases, I want to hide it.
{% for product in collection.products %}
// if ( product sells != 3 )
<h2 class="title">{{ 'product.title' | t }}</h2>
{% endfor %}
In the product details, you can add a Metafield resource to it that is a number.
Edit that metafield so that it contains a 3 for example
in your theme, when you are examing the product details to decide whether to render the product or not, check the value of the metafield resource assigned to the product.
profit.

Compare two arrays in liquid (Shopify)

not a dev, just trying to hack something together. In our Shopify site, have some logic that tags new blogs articles in a specific blog with a an order.id. So this blog has posts with one order.id per post.
On customer record (account), I made a grid where I want to show all articles where article.tags matches customer.orders.
I made an array for all the customer's order ids, and trying to compare this array with the article.tags array and show only the articles where there are matches in the two arrays.
Please help!
This is on customers/account.liquid:
<div class="table-wrap">
<table class="full table--responsive">
<thead>
<tr>
<th>POST NAME</th>
</tr>
</thead>
<tbody>
{% assign myorders = '' %}
{% for order in customer.orders %}
{% capture myorders %}
{{ myorders }} {{ order.id }}
{% endcapture %}
{% endfor %}
{% for article in blogs.my-posts.articles %}
{% if article.tags contains myorders %}
<!--SHOW THE MATCHING ARTICLES HERE-->
<tr>
<td class="underline"><strong>{{ article.title | capitalize }}</strong></td>
<tr>
{% else %}
You have no posts.
{% endif %}
{% endfor %}
</tbody>
</table>
</div>
One thing. Using capture will continuously overwrite your last capture, so putting that in a for loop is problematic. You'll only ever have the last order in customer orders as your result.
So for a start, you might want to work on building up a string that will continuously grow to contain the order ids. Once you have that string, you can perhaps use it. You would then go through articles. Note that tags are best dealt with in an array. So you'd split that string of tags on comma, and for each resulting tag in the array you'd loop over, you'd want to see if the tag was in the string of order ids you previously built.
None of this is too hard, but it is not obvious how to build up to success. My suggestion is to establish each need in a small step of code, and then dump the code out in the source of the page Shopify renders. Use the view source to find your results, and check that they are correct. If you just whip up a whole recipe like your current one, and it fails at any point to produce, like it does, you have no clue where the error is. Often it is easy enough to just use comments in the course and then ctrl+f to find the clue, like maybe the word "testeefizzle":
<!-- testeefizzle {{ dump crap here to see it }} -->
Once you achieve glory on one small piece, built on that, with more code.

Shopify - Get list of product from a specific collection

In shopify, I am creating 4 dropdowns.
Dropdown 1 - City
Dropdown 2 - Category of shops (such as Apparel, stationary etc)
Dropdown 3 - Shops available in the particular city and particular shop
Dropdown 4 - Items available in the particular shop
My requirement is, when a particular shop is selected (Dropdown 3) below the dropdown all the products in that shop should be listed (I will make the product part of collection and collection name will be same as shop name).
I realize that I need to use Ajax. I checked the APIs offered by shopify but somehow I am not able to connect dots. I am not able to use it. Can you please provide a pointer where it is explained how to achieve it.
Please note, i am new to web development and shopify.
EDITED*
I have created another template called "collection.alternate".
Tagged the collection to the new template.
In theme.liquid I have used the following code, to avoid header and footer from getting displayed in iframe
{% if template != 'collection.alternate' %}
{% include 'header-bar' %}
.....
{% endif %}
Used iframe to load the collection.alternate.
However in iframe the Header is still getting displayed. When I analyze the "Elements" in Chrome developer tools for the iframe, I see the header logic is generated for collection.template. How do I stop header from appearing in iframe.
You don't need AJAX for this functionality.
Each values in the four dropdowns should be added as tags in the products. Then you can use simple JavaScript command to change the url as required and display required products.
For ex., let's say you have New York as a City, and CK as a Shop. Now to display the products that are in CK store in New York, all the said products must contain New York and CK as tags. The final URL to display the said products will be - storename.myshopify.com/collections/all/new-york+ck
To call products from shopify collects you can simply use this loop:
{% for product in collections.shop_name.products limit: 4 %} /*********** shop_name is collections name limit is used to show no. of products ******/
<li><img src="{{ product.featured_image | product_img_url: 'medium' }}" alt=""></li>
{% endfor %}
Below is the link to shopify article that describes how to filter products based on tags.
https://docs.shopify.com/support/your-store/collections/filtering-a-collection-with-multiple-tag-drop-down
Thanks #Hymnz for guiding me to the article.
Just mention your collection name in collection array index
{% for product in collections['collection-name'].products %}
{{product.name}}
{% endfor %}