How to group menu by Alphabet in shopify?
I want to group dropdown menu like this.
I am new to shopify, I tried to group menu by trying to get the first letter using this code
{% assign first_letter = {{ link_primary.title | slice: 0 }} %}
but it is giving me following error
Liquid syntax error: Unexpected character { in "{{{{ link_primary.title | slice: 0 }} }}"
You don't actually need the {{ }} around the link title.
You can assign the first letter like:
{% assign first_letter = link_primary.title | slice: 0 %}
Then just check whether it's within a certain range, for example A-D, E-H etc.
Related
I am trying to prevent orders with more than one collection from being checked out. If there's more than one collection, i just want to disable the checkout button. I know the syntax is bad, but i want to do something like this.
{% for item in cart.collections %}
{% if item.collection.length > 1 %}
<button disabled>Cant checkout</button>
{% else %}
<button disabled>Can checkout</button>
{% endif %}
This is the current code for the button
<div class="cart__checkout-wrapper">
<button disabled id="button" type="submit" name="checkout" data-terms-required="{{ settings.cart_terms_conditions_enable }}" class="btn cart__checkout">
{{ 'cart.general.checkout' | t }}
</button>
{% if additional_checkout_buttons and settings.cart_additional_buttons %}
<div class="additional-checkout-buttons additional-checkout-buttons--vertical">{{ content_for_additional_checkout_buttons }}</div>
{% endif %}
</div>
{% endfor %}
Method 1
This simple check might work for what you need:
{% liquid
assign all_collections_in_cart = cart.items | map: 'product' | map: 'collections' | map: 'title' | uniq
assign collection_count = all_collections_in_cart.size
if collection_count > 1
assign can_checkout = false
else
assign can_checkout = true
endif
%}
What it does
First, we use a sequence of map filters to 'drill down' through the object structure. Items in the cart do not themselves belong to any specific collection(s), but each item is associated with both a variant and a product. From the product, we can then get all of the collections that it belongs to, which will be an array of collection objects. We can't do much with the objects themselves, so we drill down one layer further to get something that can be compared, such as title handle or id. At this point we now have an array of text entries (or numbers, if you swap to IDs), so we can apply the uniq filter to remove any duplicates.
Now that we have an array with no duplicates, we can check the size of the array to see if it is greater than one and set a variable appropriately.
Note that this will always return false if a single product belongs to more than one collection!
Method 2:
If instead you need to test that all products share a collection because products can belong to more than one at a time, we won't be able to take as many shortcuts. Instead, our code might look something like this:
{% liquid
assign can_checkout = true
if cart.items.size > 1
assign shared_collections = cart.items.first.product.collections | map: 'title'
for item in cart.items
if forloop.first
continue
endif
assign item_collections = item.product.collections | map: title
assign placeholder_array = ''
for coll in shared_collections
if item_collections contains coll
if placeholder_array.size > 0
assign placeholder_array = placeholder_array | append: ','
endif
assign placeholder_array = placeholder_array | append: coll
endif
endfor
assign shared_collections = placeholder_array | split: ','
if shared_collections.size == 0
assign can_checkout = false
break
endif
endfor
endif
%}
What it does
This second version will trigger if there are 2 or more items in the cart. If there are, we get all of the collection titles from the first item in the cart, then loop through all of the remaining items in the cart. At each step, we go through our list of shared collections to see how many are shared with the current item in the cart to make a new array. (Liquid does not let us make an array directly, so we have to build out a delimited string and then use the split filter afterwards)
If at any time we have an array with 0 shared entries, we set our can_checkout variable to false and use the break command to stop searching.
Addendum
For both of the above methods, things might get a little bit trickier if you have certain collections that don't count towards your collection rules. For example, if you have 'featured' or 'summer sale' collections, you will want to make sure that you aren't counting those in the collection comparisons (for example, by having an array of exceptions and removing those items from the array of collections that the item belongs to).
Currently in my shopify code I can use a line item input like so:
line_item.variant.title
This will output the following:
Snapback / One Size Fits All / Camo
What I'm trying to do is to break up each one into it's own line. So I can get this back:
Snapback
One Size Fits All
Camo
The challenge is that there are several products with different variants. Some contain the string "7/9" so I wouldn't be able to use "/" as a delimiter. Any suggestions?
The variant title is generated based on the variant options.
So if you like to show the different options you just call the options instead of the title.
Example:
{{ variant.option1 }}<br/>
{{ variant.option2 }}<br/>
{{ variant.option3 }}
Refer to the docs here: https://help.shopify.com/en/themes/liquid/objects/variant#variant-option1
I found this one is a better solution to set this dynamically:
{% if line.variant.title != 'Default Title' %}
<span class="order-list__item-variant variant-title">
{% assign variantOptions = line.variant.title | split: ' / ' %}
{% assign count = 0 %}
{% for option in line.product.options_with_values %}
<span><b>{{ option.name }} :</b> {{variantOptions[count]}}</span>
<br />
{% assign count = count | plus: 1 %}
{% endfor %}
<br />
</span>
{% endif %}
As by default, we are getting / in the value of line.variant.title. So we need to split this first So that we can get individual option values. and because there is no feasible object to get option label so we need to use the
line.product.options_with_values in a loop and iterate and set label with value as in the above code.
So, just use this code in your order confirmation email and you will get the format in the email as follow. Here Embroidery as yes and no. and Border as Zigzag and Simple are the options for product variants.
I need to extract currency symbol in Shopify template. So far I've written:
{% assign symbol = product.price | money %} //creates a variable which holds price with currency symbol
{% assign symbol = symbol | slice: 0 %} //should return first char out of a string
{{ symbol }} //prints the variable
Unfortunately last line returns the < char.
Right now I'm out of ideas how to make this work. I know that Shopify can display currency by {{ shop.currency }} method, but it returns currency name instead of currency symbol.
Check the money format which is set in the Store Settings
Settings > General > Standards and formats > Currency > Change formatting
there are:
"HTML with currency"
"HTML without currency"
By default they are ${{amount}} USD and ${{amount}}, but they are wrapped them in span.money because you are using currency switcher.
<span class="money" >${{amount}} USD<span>
Easly you can use the filter strip_html to remove the span.money.
{% assign symbol = symbol | strip_html | slice: 0 %}
To assign class depending on page category I have following in my code:
{% assign category_class = 'category-' | append: {{ page.category }} %}
As expected I get <div class="category-sometext". But when building I also get warning about an unexpected character in this line.
What's wrong and how I can fix it?
You need to remove the {{ }} around page.category as you are already inside {% %}. So:
{% assign category_class = 'category-' | append: page.category %}
In my shopify store, I am using SuperFields in order to customize my site, though my question isn't about the app. On one of my pages, I need the value for the following:
variant.metafields.sf_{{ collection.title | downcase }}[meta_tag_key]
The value should be 0 or 1. If I evaluate the statement directly, such as:
{if variant.metafields.sf_{{ collection.title | downcase }}[meta_tag_key] =1%}
It throws an error when I render the page: Unexpected character '{'
I've also tried the following:
{% capture defaultImage %}variant.metafields.sf_{{ collection.title | downcase }}[meta_tag_key]{% endcapture %}
{% assign test = defaultImage %}
But 'test' is considered nil and doesn't return any value. I have tried to search for answers here and on the shopify forum, but, as my clumsy post title suggests, I'm having a hard time concisely searching for a solution to this problem. Any help is greatly appreciated.
You can try :
{% assign metafield-key = collection.title | downcase | prepend: "sf_" %}
{% assign key = variant.metafields[metafield-key][meta_tag_key] %}
{% if key == 1 %}
Do the twist !
{% endif %}
You are missing a % sign in your code. Hence the error message. Your if statement started with {% and not just {
If you working in liquid then you have to use {% %} for defining any variable & also for condition in shopify. You can't use { this.