I was wondering if anyone has figured out a way to use the Liquid template language in Middleman, but still use Localization.
I've tried replacing:
<%= I18n.t(:hello) %>
With:
{{ 'hello' | t }}
or
{{ 'hello' | I18n.t }}
But can't seem to get it working. Anyone got advice for me?
Thanks!
Related
I am wondering if there is a way to get the full URL using only liquid (Shopify templating language). I know there are the below provided but none of them (even combined) seem to achieve it. It can be done with javascript using window.location.href, but I am wondering if there is a liquid-only method. For my use having to combine javascript in with my liquid makes it become a lot more complicated, hence my question.
{{ page.url }}
{{ shop.url }}
{{ shop.domain }}
{{ collection.url }}
{{ product.url }}
{{ blog.url }}
{{ article.url }}
{{ article.comment_post_url }}
{{ canonical_url }}
For instance, if my URL was www.website.com/blogs/myblog/tagged/?123 and I wanted the entire URL, including the ?123. The answer may be no, but this would seem pretty daft given they have all of the below options but not simply one for the entire URL. In my case I am going directly to the URL in the form of a href, so it is not a problem that liquid is only being applied on page load.
Here is the one of odd method to get the values from the query string of URL, but it comes with some coding working, you can it using this link
I'm using nunjucks which compile mustache syntax like this : {{ value }}, and I'm using in the same time vue.js, which also use the same syntax for interpolation.
When I use interpolation to bind some value, nunjucks compile it first, which I want to be compiled by vue.js later and not nunjucks, so I was looking for something that I can do to skip interpolation for nunjucks, but with no luck.
A solution I can do here, is to use something else to print the value in vue.js without the use of interpolation, but it seems like it's the only why to print variables in the vue.
Any suggestions on how to solve this ?
There's two ways to do this. I prefer the first way.
1. Tell Nunjucks to ignore {{ }} for a specific portion of code
From the docs: If you want to output any of the special Nunjucks tags like {{, you can use a {% raw %} block and anything inside of it will be output as plain text.
{% raw %}
...put all your Vue template code in here...
{% endraw %}
2. Tell Vue to use different delimeters
new Vue({
el: '#app',
data: data,
delimiters: ["<%","%>"]
});
Then in your Vue templates, use <% someValue %> instead of {{ someValue }}.
Vue 3 has a slightly different syntax, but the concept is the same.
I am trying to get the comment form with all comments on a custom template article page of drupal. I can get the whole content with {{ page.content }} or get the comments by using {{ node.field_comments }} and make a loop on it (assuming my field comment machine name is field_comments).
But does anyone know I to render the whole comments block with :
links to add a comment
comments
comment form
Thank you very much for your help !
Try to use the new and refined comment module. It's in the core so all you have to do is enable it. After that just make a comment type, add it to your article and display. That's pretty much it.
In template files for a content type (eg node--article.html.twig), you have the 'content' variable available. I use this bit of Twig to render the whole comments block:-
{{ content.comment }}
I struggled with this too, but just for the next visitor, I got 2 out of 3 (I didn't want the form on my page)
- links to add a comment -> {{ content.links }}
- comments -> {{ content.comment_node_TYPE }}
To get the correct name for content.comment_node_TYPE, visit your Mange fields page for that content type and see what the comment field is called
e.g. my "Audio" content type names the field {{ content.comment_node_audio }}
Hope this helps someone in future
'Currently I want to display View All "Collection Title". I do this successfully using the prepend. However, when creating a shopify theme one of the requirements is language support / translation.
<div class="collection-cta">{{ product_collection.title | prepend: 'View All ' | link_to: product_collection.url }}</div>
I am having trouble figuring how how to prepend the shopify translation markup.
{{ 'collections.general.view_all' | t }}
This outputs the View All text translation correctly, but getting to work inside of prepend:'' has proven to be problematic. I haven't been able to find strong documentation on this so any perspective would be great.
How about this?
{{product_collection.title}} {{ 'collections.general.view_all' | t }}
No need to use link_to... I'm not entirely clear on the inner workings of liquid, but it does expect a certain number of arguments... adding prepend and the translation tag may have thrown it.
So split it all out - and it should work.
There seems to be some magic happening here for {{ settings[a_prop] }} on a product page. It seems that {{ settings[a_prop] }} is equivalent to the property a_prop_productname in my settings.html (instead of a_prop, which makes more sense to me). This is all happening in my theme's product.liquid.
Can anyone explain where productname is getting pulled from? Also, normally liquid uses dot notation for settings... why do brackets work here? I can't find any examples anywhere on the internet.
https://docs.shopify.com/themes/liquid-documentation/basics/handle#handles-created
Shopify will automatically create handle based on the product/page/whatever title you provide.
https://docs.shopify.com/themes/liquid-documentation/basics/handle#attributes-handle
You can do both {{ obj[attr] }} or {{ obj.attr }} to access an object attribute.
{{ obj[attr] }} means "access the property on obj with the value of the variable attr" and {{ obj.attr }} means "access the property attr on obj".