I have this table data:
Name | Score | Remarks
john | 80 | pass
jane | 85 | pass
How to make it look like this:
Name | Score | Remarks
john | 80 | pass
jane | 85 |
Remarks table head should create a rowspan of 2 but I'm having a prob on how to implement using twig template. Below is my code:
{% for name in names %}
<tr>
<td class="text-center">{{name.name}}</td>
<td class="text-center">{{name.score}}</td>
<td class="text-center" rowspan="2">{{name.remarks}}</td>
</tr>
{% endfor %}
The output of this code is:
Name | Score | Remarks |
john | 80 | pass |
jane | 85 | | pass
You can do like this:
{% for name in names %}
<tr>
<td class="text-center">{{name.name}}</td>
<td class="text-center">{{name.score}}</td>
{% set rowspan = new_rowspan(names, loop.index0, 'remarks') %}
{% if rowspan %}
<td class="text-center" rowspan="{{ rowspan }}">{{name.remarks}}</td>
{% endif %}
</tr>
{% endfor %}
And add a Twig extension:
class YourTwigExtension extends Twig_Extension
{
public function getFunctions()
{
return array(
new Twig_Function('new_rowspan', [$this, 'calculateRowspan']),
);
}
public function calculateRowspan($names, $from, $column)
{
// check if previous column has the same value
if ($from > 0 && $names[$from - 1][$column] === $names[$from][$column]) {
return;
}
for ($to = $from + 1; isset($names[$to]) && $names[$to][$column] === $names[$from][$column]; $to++);
return $to - $from;
}
}
Try something like this:
{% if loop.index0 % 2 == 0 %}
<td class="text-center" rowspan="2">{{name.remarks}}</td>
{% endif %}
% 2 corresponds to rowspan="2"
Related
I'm new to liquid coding while starting my own Shopify store (although I had some experience with coding). I'm currently stuck trying to get this code to function. I've added 3 text options in the liquid file for each variable. The idea is that when the criteria are met, it would display the appropriate text option. Please see the code string here for ref.
{% if section.settings.free_shipping_announcement_bar %}
{% assign promote_text = section.settings.promote_free_shipping_text | escape %}
{% assign unlocked_text = section.settings.unlocked_free_shipping_text | escape %}
{% assign unlocked_del_text = section.settings.unlocked_free_delivery_text | escape %}
{% assign threshold = section.settings.free_shipping_threshold | times: 100 %}
{% assign value_left = threshold | minus:cart.total_price %}
{% assign value_left_money = value_left | money %}
<div class="announcement-bar">
{% if value_left <= 0 %}
<p class="announcement-bar__message">{{unlocked_text}}</p>
{% elsif value_left >= 1 and value_left < 50 %}
<p class="announcement-bar__message">{{unlocked_del_text}}</p>
{% else %}
<p class="announcement-bar__message">{{promote_text | replace:'(value)' , value_left_money}}</p>
{% endif %}
basically, the idea is if the cart total is between $0-$99 I will show the "promote_text", if it's between $100-$149 it will show the "Unlocked_free_del_text"(free delivery), then at $150+ in the cart it shows "unlocked_text".
It currently shows the "promote_text" from $0-$149 then changes directly to the "unlocked_text" and skips the middle section for "unlocked_del_text"
my best assumption is that I'm using the elsif function wrong but I've trailed as many adjustments as I can think of without breaking the code, so any advice would be greatly appreciated!
Update:
After checking and testing the code over dev store I find you need to use divided_by to value_left value to compare with the value into normalized format.
so your code needs an update to this line
{% assign value_left = threshold | minus:cart.total_price | divided_by: 100%}
becase case is multile of 100 to process to cart value and need to normalized before test into if else condition.
The code looks great, I am not sure why this not works properly, you can check and try in this way also and I hope it will work. overwise you need to post the whole code along with schema and anyone replicate it dev store and find the solution.
{% if section.settings.free_shipping_announcement_bar %}
{% assign promote_text = section.settings.promote_free_shipping_text | escape %}
{% assign unlocked_text = section.settings.unlocked_free_shipping_text | escape %}
{% assign unlocked_del_text = section.settings.unlocked_free_delivery_text | escape %}
{% assign threshold = section.settings.free_shipping_threshold | times: 100 %}
{% assign value_left = threshold | minus:cart.total_price | divided_by: 100%}
{% assign value_left_money = value_left | money %}
<div class="announcement-bar">
{% if value_left <= 0 %}
<p class="announcement-bar__message">{{unlocked_text}}</p>
{% elsif value_left >= 1 and value_left < 50 %}
<p class="announcement-bar__message">{{unlocked_del_text}}</p>
{% else %}
<p class="announcement-bar__message">{{promote_text | replace:'(value)' , value_left_money}}</p>
{% endif %}
</div>
{% endif %}
Thanks for the quick response! I trialed the snippet you added but unfortunately ran into the same issue. here is the schema that I added to impact the section of code I input. If you are able to spot a simple issue in here please let me know, otherwise, I will continue to troubleshoot personally and hopefully find a solution or alternate method, to avoid troubling someone with having to replicate the entire code to recreate the issue.
{
"type":"checkbox",
"label":"enable free shipping bar",
"id":"free_shipping_announcement_bar",
"default":false
},
{
"type":"text",
"id":"promote_free_shipping_text",
"label":"message to promote free shipping"
},
{
"type":"text",
"id":"unlocked_free_shipping_text",
"label":"message for unlocked free shipping"
},
{
"type":"text",
"id":"unlocked_free_delivery_text",
"label":"message for unlocked free delivery"
},
{
"type":"range",
"id":"free_shipping_threshold",
"label":"threshold for free shipping",
"min":0,
"max":200,
"step":5,
"unit":"$",
"default":150
}
I am creating an array in Shopify (Liquid) and I get an error,
{% assign numbers = [
"One",
"TWo",
"three",
"bla"
]
%}
Line 126 — Liquid syntax error: Expected close_square but found comma
in "{{[ "One","TWo", "three","bla" ] }}"
There is no way to create an array like this in liquid.
Instead, you can use the split filter to create an array from a string.
{% assign numbers = "one,two,three,four" | split: "," %}
<pre>{{ numbers | inspect }}</pre>
You can also create an empty array and feed it with the push filter
{% comment %} +++ Creates an empty array +++ {% endcomment %}
{% assign numbers = "" | split: "" %}
<pre>{{ numbers | inspect }}</pre>
{% comment %} +++ Feed the beast +++ {% endcomment %}
{% assign numbers = numbers | push: "one" %}
<pre>{{ numbers | inspect }}</pre>
{% assign numbers = numbers | push: "two" %}
<pre>{{ numbers | inspect }}</pre>
I've added some code in the product.price.liquid to make a simple math formula:
<span id="extrainfo">
<span id="perkg">{{ variant.price | times: 100.0 | divided_by: variant.weight | money }}</span>/100g
</span>
Whole Code of the liquid here
Result: On the Product detail page, the result of the math formula is shown right=> Detail Page, but on the collections page or homepage, there comes "Inf"=> Collection Page
Any Ideas?
The last | money parameter might be confusing. Try like this
{% assign variant_price = variant.price | times: 100.0 %}
{% assign variant_price = variant_price | divided_by: variant.weight %}
{% assign variant_price | money %}
{{ variant_price }}
Why is this returning 0?
{% if discounts %}
Discount
{{ discounts_amount | divided_by: subtotal_price | times: 100 }}%
{% endif %}
I have also tried accommodating integer maths, but no luck.
Wrong syntax. Try this
{% if discounts %}
Discount {{ discounts.amount | divided_by: subtotal_price | times: 100 }}%
{% endif %}
It may have been a long time but I'm still replying because of the many views.
We have to convert integer to float
{% assign my_integer = 7 %}
{% assign my_float = my_integer | times: 1.0 %}
{{ 20 | divided_by: my_float }}
https://shopify.github.io/liquid/filters/divided_by/
How do I find the total value of all the rows in a column with Twig? For example I have a column "QTY" that will list number of quantities of each row, I want the sum of the total ROWS of QTY (not the sum of qty). What is the tag/logic in Twig?
I have something like this:
<table class="tablesorter">
<thead>
<th>DA</th>
<th>Part</th>
<th>Batch</th>
<th>Qty</th>
</thead>
{% for getbatches in getbatch %}
<tr>
<td>{{getbatch.dano}}</td>
<td>{{getbatch.partno}}</td>
<td class="highlight">{{getbatch.batchno}}</td>
<td>{{getbatch.inqty}}</td>
</tr>
{% endfor %}
</table>
For the rows that populate, I would like the count of the column of QTY, or any column.
Base on your code and according to that you want to get Count of rows in Qty column you can try
<table class="tablesorter">
<thead>
<th>DA</th>
<th>Part</th>
<th>Batch</th>
<th>Qty</th>
</thead>
{% set row_count = 0 %}
{% for getbatches in getbatch %}
<tr>
<td>{{getbatch.dano}}</td>
<td>{{getbatch.partno}}</td>
<td class="highlight">{{getbatch.batchno}}</td>
<td>{{getbatch.inqty}}</td>
</tr>
{% set row_count = row_count + 1 %}
{% endfor %}
</table>
if you want to show that amount somewhere (like a span) you can use <span>{{ row_count }}</span> after
UPDATED
A better solution to show the rows count anywhere if your twig template might be just showing the count of getbatches:
<span>Row count: </span><span>{{ getbatches is defined ? getbatches|length : 0 }}</span>
If you print rows of a table in twig and wany to get the "count of rows in QTY column", you should pass this data to twig from doing a simple count() on the array of rows. If you want to do it "the hard way", you could do:
{% set numRows = 0 %}
{% for .... %}
{% set numRows = numRows + 1 %}
{% endfor %}
but as #TheLittlePig said, twig's purpose is to display data, not do calculations