I'm trying to use the first_time_accessed liquid variable in my checkout.liquid Shopify template to decide whether or not to push certain data to an array, like so:
config.elements.push({
id: prodId,
price: prodPrice,
quantity: prodQty,
{% if first_time_accessed %}
{% assign last_purchase_date = "January 1, 1970" %}
{% for order in customer.orders %}
{% if (order.order_number != checkout.order.order_number) and (order.created_at > last_purchase_date) %}
{% assign last_purchase_date = order.created_at %}
{% endif %}
{% endfor %}
{% assign raw_new_customer_boundary = 'now' | date: "%s" | minus : 46656000 /* 540 days */ %}
{% assign raw_last_purchase_date = last_purchase_date | date: "%s" | minus: 0 %}
new_customer: {% if raw_new_customer_boundary > raw_last_purchase_date %}true{% else %}false{% endif %},
{% endif %}
});
However, every time I test this code I can see that first_time_accessed is always false. I've also tested this by putting similar code on other pages and it always equates to false. I've tested it in incognito mode with a VPN and same thing.
I'm wondering if anyone has any idea why first_time_accessed is always false? I'm sure it has to do with some misunderstanding on my end about how this variable works, but there's very little info on Shopify's docs about it.
Related
To simplify things, I'm writing code using Nunjucks where I am passing a collection of strings to a function, where that function will then display those strings. Something like this:
{% macro Function(strings) %}
{% for item in strings %}
<div>{{ item.string }}</div>
{% endfor %}
{% endmacro %}
{% set example = [
{string: 'Hello,'},
{string: 'it is nice'},
{string: 'to meet you!'}
]%}
{{ Function(strings=example)}}
I want to be able to add a break tag or new line character in some of these strings, but every time I do the new line isn't displayed. It'll end up like this:
input: {string: 'it is\nnice'}
output: it is nice
or this:
input: {string: 'it is<br>nice'}
output: it is<br>nice
What am I doing wrong?
You're close, but with a little more structure and tooling with your macros, and the built in 'safe' filter, you can pull it off...
Using a loop to display your full predefined set:
{# STEP 1 - define your strings the way you want with set...#}
{% set mStrings = [
{stringval: 'Hello,'},
{stringval: 'it is<br> nice'},
{stringval: 'to meet you!'}
]%}
{# STEP 2 - create a macro function to help display/decor the data back into our template #}
{# notice the use of 'safe' to allow your string to not be esacped #}
{% macro collection(gStrings) %}
<ul>
{% for gString in gStrings %}
<li>{{ gString.stringval|safe }}</li>
{% endfor %}
</ul>
{% endmacro %}
{# STEP 3 - finally, from within your template, call your macro function, with the correct parameter, like so!...
{{collection(gStrings=mStrings)}}
#}
Adding custom parameter string data on the fly :
{# With a lighter approach, start our with your macro function...#}
{% macro entry(entryItem) %}
{{ entryItem|safe }}
{% endmacro %}
{# from within your template, call your macro function, with the correct parameter, like so!... #}
{{entry("lets say<br>something")}}
{{entry("lets eat<br>something")}}
...etc...
I would like to add an additional fill-up form on our checkout page if the count in the cart is more than 1 and if item.product.tag condition met in Shopify.
please see the below sample code:
{%- if item.product.tags contains "SpecialItem" -%}
{% assign viberCount = viberCount | plus: 1 %}
{% assign hasSpecialItem = true %}
{% render 'questions-lp-class', index: forloop.index, product: item.product.title, viberCount: viberCount %}
{%- endif -%}
Hoping that you could help me on this.
Thank you in advance.
I have the following in my nunjucks file,
{% set inProgressJobs = [] %}
{% for job in jobs %}
{% set inProgressJobs = (setProgressJobs.push([
{
text: "<b>{{ job.jobTitle}}</b>"
}
]), inProgressJobs) %}
When I use this in by view I would expect to see Web Designer but I am actually seeing {{ job.jobTitle }} how I interprolate my var into the text attribute?
You try to coding inside a template. It's a possible (see below) but out of template ideology. Try to put necessary logic to filters and global functions.
const nunjucks = require('nunjucks');
const env = nunjucks.configure();
env.addFilter('print', console.log); // for debug
const html = env.renderString(`
{% set arr = [] %}
{% for i in range(1, 10) %}
{{ '' if arr.push(i) }} {# arr.push always returns non-zero so result will be '' #}
{% endfor %}
{{ arr | print }} {# print arr to console #}
`);
// console.log(html); // html is a pack of spaces and tabs
I have a for loop in Liquid which loops through customer addresses. What I would like to do is make the address which has been set as the default (customer.default_address) as the first address to appear in the loop. I currently add a default tag to the default address but struggling to make it the first to appear.
I tried using 'sort' but with no luck.
My current code is below.
Any help would be much appreciated.
{% assign sortedAddresses = customer.addresses | sort: 'customer.default_address' %}
{% for address in sortedAddresses %}
<div class="address">
{{ address | format_address }}
{% if address == customer.default_address %}
<div class="default">DEFAULT</div>
{% endif %}
</div>
{% endfor %}
You have default_address as a property of customer and Im guessing customer.addresses is an array of strings. If you were to make customer.addresses an array of objects instead... with string property for address and true/false property for default, then you could do something like:
{% assign default_address = customer.addresses | where: "default", true %}
{% assign address_array = default_address | concat: customer.addresses %}
{% assign customer.addresses = address_array | uniq %}
I am new to coding, but have been reading about DRY - Don't Repeat Yourself.
I have a JavaScript if/else statement that does not fit the DRY approach, but I am unable to workout how to write the JavaScript if/else statement so that the contents are not repeated.
I am hoping some one smarter than me can show me.
Here is my code:
{% if user.get_profile.subscription_category == '00' %}
$('#id_name_details_prefix_title').addClass('kmw-disabled');
$('#id_name_details_first_name').addClass('kmw-disabled');
$('#id_name_details_middle_name').addClass('kmw-disabled');
$('#id_name_details_last_name').addClass('kmw-disabled');
$('#id_name_details_suffix_title').addClass('kmw-disabled');
{% else %}
{% if user.get_profile.display_virtual_keyboard %}
$('#id_name_details_prefix_title').removeClass('kmw-disabled');
$('#id_name_details_first_name').removeClass('kmw-disabled');
$('#id_name_details_middle_name').removeClass('kmw-disabled');
$('#id_name_details_last_name').removeClass('kmw-disabled');
$('#id_name_details_suffix_title').removeClass('kmw-disabled');
{% else %}
$('#id_name_details_prefix_title').addClass('kmw-disabled');
$('#id_name_details_first_name').addClass('kmw-disabled');
$('#id_name_details_middle_name').addClass('kmw-disabled');
$('#id_name_details_last_name').addClass('kmw-disabled');
$('#id_name_details_suffix_title').addClass('kmw-disabled');
{% endif %}
{% endif %}
The contents of the 1st if are repeated in the else of the 2nd if statement - I am hoping that I only have to write the repeated contents once.
You can put your selectors in an array
var selectors = [#id_name_details_prefix_title', '#id_name_details_first_name' ...];
and then add/remove class
$(selectors.join(',')).addClass('kmw-disabled')
Break it up into functions that isolate what's going on.
{% if something %}
functionThathAddsClass();
{% else %}
{% if something_else %}
functionThatRemovesClass();
{% else %}
functionThathAddsClass();
{% endif %}
{% endif %}
You will run into the problem of creating two global functions in this case, but that's a different issue.
I like to make, what I personally call, CSS Guards.
A CSS Guard is basically just an object that has functions that pokes and prods at the DOM.
var NameDetailsGuard = {
functionThathAddsClass = function () {
$('#id_name_details_prefix_title').addClass('kmw-disabled');
$('#id_name_details_first_name').addClass('kmw-disabled');
},
functionThatRemovesClass = function () {
$('#id_name_details_prefix_title').removeClass('kmw-disabled');
$('#id_name_details_first_name').removeClass('kmw-disabled');
}
};
and you use it like this
NameDetailsGuard.functionThatAddsClass();
An added benefit to this is that if you expand on this concept you can start doing simpler DOM node caching within this object so that instead of querying for the selector everytime you'll retain a reference to it and manipulate that.
You can add some class to needed elements (in HTML markup) and select by that class.
For example, add category-zero and virtual-keyboard classes and use following:
{% if user.get_profile.subscription_category == '00' %}
$('.category-zero').addClass('kmw-disabled');
{% else %}
{% if user.get_profile.display_virtual_keyboard %}
$('.virtual-keyboard').removeClass('kmw-disabled');
{% else %}
$('.virtual-keyboard').addClass('kmw-disabled');
{% endif %}
{% endif %}