I'm building a jekyll site. I have a loop setup -
{% for article in site.posts limit:5 %}
{% if article.tag == "infographic" %}
<a class="infographic tag" href="/tags/infographics.html">{{ article.tag }}</a>
{% endif %}
{% endfor %}
This loop spits out the latest 5 posts in my infographic tag. I would like the loop to produce only the third latest post. Any ideas on making this happen?
The solution is really difficult for tags. If you use infographic as a category, it could be really simple:
for article in site.categories.infographic | offset: 2 | limit: 1
Related
I'm creating a site that lets you browse through gifts that people want based on information surveyed from people (I will just survey a small amount of people unless the site has some attention - I am not worried about creating a very large list on the site, but that is not what I am here to ask about).
I'm coding the site with Jekyll, so of course I need to use Liquid.
You see, I would like to sort through the first 3 items in the site.posts array.
I looked over the array filters documentation, but I can't seem to find anything that does what I need to get done.
I read this post, but I'm not entirely sure how to understand the answer on there, because I don't know what a "third loop" is, and the way I'm looping through posts wouldn't work well with accessing the array data by using site.posts[0], site.posts[1], and so on. It would make the code bulky, but I guess I can do that if I need to.
This is the code I have right now:
<h2>Recently added gifts</h2>
<div class="posts">
{% assign posts = site.posts %}
{% for post in posts %}
{% unless post.list %}
<div class="post">
<h3 class="post-title">
<a href="{{ post.url | relative_url }}">
{{ post.title }}
</a>
</h3>
<time datetime="{{ post.date | date_to_xmlschema }}" class="post-meta">{{ post.date | date_to_string }}</time>
<p class="post-excerpt">
{% if post.description %}
{{ post.description | strip_html }}
{% else %}
{{ post.excerpt | strip_html }}
{% endif %}
</p>
</div>
{% endunless %}
{% endfor %}
</div>
As explained in comment and as the answer might help somebody else, you may set a limit as a parameter when you loop through an array, like this:
{% for post in posts limit:3 %}
Do something
{% endfor %}
Objective is to add pagination using Twig 3 that displays and functions identically to the pagination used at the bottom of Stack Overflow question feeds:
Researching this in other questions and in outside forums has only yielded results using depreciated twig functions, so asking here in case anyone has any insight on how to do this properly.
I have a twig template that currently displays pagination, but numerically lists and hyperlinks every page in the list without trimming and adding an ellipses the way Stack Overflow does (also it has no dynamic Next/Previous links). For some background, some of the parameter decisions are framed around the API that I'm working with and follows its documentation for HTTP requests to the JSON data. This template is functional but it's not practical from a user oriented design standpoint:
{% set pgonpage = 5 %}
{% set pgofpages = (count/pgonpage) | round(0, 'ceil') %}
<p>{% for i in 1..pgofpages %}
{% if i==urlparam.pg %}
(<strong>{{urlparam.pg}}</strong>)
{% else %}
<a href=?pg={{i}}>{{i}}</a>
{% endif %}
{% endfor %}</p>
For brevity I removed part of the template above that loops the main content, but to clarify the {% set pgonpage = 5 %} tag sets the number of JSON data to be displayed on a given page, and is functional.
This is how the template URL looks:
{% set page = 1 %}
{% if urlparam.pg > 0 %}
{% set page = urlparam.pg %}
{% endif %}
https://api.example.com?per_page=5&page={{page}}
This is the result if on https://actual.example.com?pg=1:
I'm using Shopify Liquid.
If I don't include {% if my_array %} and have a code such as this:
{% for var in my_array %}
Do this heavy task
{% endif %}
does it skip the "heavy task" if my_array is empty or is it better to include the if statement (performance wise)?
Thank you.
Thank you for your answers, but I found this from Shopify developers documents.
According to Shopify, {% for var in my_array %} also acts like an if statement, which can be combined with {% else %} for when the array is empty. for example:
{% for var in my_array %}
Do this heavy task
{% else %}
<p>This array is empty</p>
{% endfor %}
Hope this helps others searching for it too.
Since you're writing it in liquid, you won't see any performance issues since the result will already be written when the page loads.
If you only need to check whether it is empty or not
{% if my_array !== blank %}
Do this heavy task
{% else %}
<p>This array is empty</p>
{% endif %}
Essentially I want to go ahead and while the for loop is going to get the images and information of all products to be displayed. insert a conditional if statement in order to see if the products tags contain the tag 'lewd' then it's blurred (right now it's set to just not display the image though)
I'm having issues finding the best place to implement it, I know it should be done on the product templates page (I think) because it seems to be pulling the images and information in the loop, but no matter where I insert the code to try to pull the info and apply the effect it doesn't work. I've gone through many many different ways to do it and this is only the latest example.
<div class="grid product-single{% if section.settings.enable_payment_button %} product-single--{{
section.settings.image_size }}-image{% endif %}">
<div class="grid__item product-single__photos {{ product_image_width }}{% if
section.settings.image_size == 'full' %} product-single__photos--full{% endif %}">
{%- assign featured_image = product.selected_or_first_available_variant.featured_image | default:
product.featured_image -%}
{% for image in product.images %}
{% capture img_id %}FeaturedImage-{{ section.id }}-{{ image.id }}{% endcapture %}
{% capture img_class %}product-featured-img{% endcapture %}
{% capture zoom_img_id %}FeaturedImageZoom-{{ section.id }}-{{ image.id }}{% endcapture %}
{% capture img_wrapper_id %}{{ zoom_img_id }}-wrapper{% endcapture %}
{%- assign img_url = image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%}
{% include 'image-style' with small_style: true, width: height, height: height, wrapper_id:
img_wrapper_id, img_id: img_id %}
<div id="{{ img_wrapper_id }}" class="product-single__photo-wrapper js">
Before the loop closes I want to go ahead and search for those tags so my code was
{% if product.tags contains "Lewd" or product.tags contains "lewd" %} blur {% endif %}
I'm not sure if Shopify already passes this info along though? in that case I suppose i would need to run another forloop? Such as
{% for tag in product.tags %}
{% if tag contains "lewd" %}
but not sure where i would even do that. I'm a novice at working with shopify. thanks for any help
The contains keyword behaves slightly differently depending on what you're using it on:
If the left-hand-side variable is a text string, contains will return true if the right-hand-side value is found as a substring of the left-hand-side value.
If the left-hand-side variable is an array, contains will return true if one of the array values exactly matches the value supplied on the right-hand-side. Type matters, too - a number won't match a string, a string won't match an object, etc.
product.tags gives you an array of strings, so as long as the product has a tag that is exactly lewd then your intuition is correct: {% if product.tags contains 'lewd' %} will be true. However, if your product is tagged with something like lewd-because-reason instead (and doesn't have a plain 'lewd' tag), lewd-because-reason is not an exact match to lewd, so the check above would be false.
Looking at the code you've supplied, a good place to put this check could be inside the {% capture img_class %} line, as then you should be able to add another class to the image being rendered.
Hope this helps!
I have a simple loop which requires me to concatenate my loop counter variable loop.index within my main value variable (hope that makes sense) but I can't get it working.
Is it even possible? See below...
{% for article in section.articles %}
{{ article.internationalText~{{loop.index}} |raw|nl2br }}
{% endfor %}
You can use twigs attribute function which was added in version 1.2. It is designed for accessing a "dynamic" attribute of a variable.
{% for article in section.articles %}
{{ attribute(article, 'internationalText' ~ loop.index) |raw|nl2br }}
{% endfor %}
Note, benatespina's answer did not work for me.
Have you tried this?
{% for article in section.articles %}
{{ article.internationalText~loop.index |raw|nl2br }}
{% endfor %}
This should work.