Snippets

Team Headjam Creative BC Liquid Snippets

You are viewing an old version of this snippet. View the current version.
Revised by James Nowland 296803a
{%comment -%} You can edit the list template from Layouts/CustomerOrders/list.html {%endcomment -%}
{% capture ordersOutput -%}{module_order filter="all" collection="orders"}{% endcapture-%}
{% if this.orders.items -%}
<table class="data-table order-list collapsing-table" cellpadding="0" cellspacing="0">
    <thead>
        <tr>
            <th>Order</th>
            <th>Date</th>
            <th>Status</th>
            <th>Ammount</th>
        </tr>
    </thead>
    <tbody>
       {{ordersOutput}}                                         
    </tbody>
</table>        
{% else -%}
<div style="text-align: center;font-size: 14px;">You don't have any orders so far. <a href="/shop.html" class="read-more">Go shopping <span>&rarr;</span></a></div>
{% endif %}
javascript:$('.custom-var label').each(function( index ) { console.log("{{ this.['" + $( this ).text() + "'] }}");});
<a href="mailto:{{ this.['Email'] | url_param_escape }}">{{ this.['Email'] | replace: '@', '&#64;' }}</a>
{% assign iOSAppStoreURL = 'https://geo.itunes.apple.com/au/app/hunter-hunter/id946814556?mt=8' -%}
{% assign googlePlayURL  = 'https://play.google.com/store/apps/details?id=au.com.headjam.hunterhunter&hl=en' -%}
{% assign userAgent = globals.visitor.userAgent -%}

{% if userAgent contains 'iPhone' or userAgent contains 'iPad' -%}
    <meta http-equiv="refresh" content="0;URL='{{ iOSAppStoreURL }}'">
{% elsif userAgent contains 'iPod' -%}
    <meta http-equiv="refresh" content="0;URL='{{ iOSAppStoreURL }}'">
{% elsif userAgent contains 'Android' -%}
    <meta http-equiv="refresh" content="0;URL='{{ googlePlayURL }}'">
{% endif -%}
<h3>Archive</h3>
{tag_blogpostarchive,60 template="" collection="blogpostarchive"}
{%comment -%} Suppress the output of the tag_blogpostarchive by using the template="" syntax and capture the data rendered by the tag using the collection="blogpostarchive" syntax {%endcomment -%}

<div class="BlogPostArchive">
    <ul>
        {%comment -%}  Use liquid to loop through the posts archive collected by the tag_blogpostarchive {%endcomment -%}
        {% for item in this.blogpostarchive.items -%}
        <li><a href="{{item.url}}" title="{{item.year}}-{{item.month}}">{{item.month}} {{item.year}} ({{item.count}})</a></li>
        {% endfor -%}
    </ul>
</div>
{%comment -%} suppress the output of the tag_blogrecentpost by using the template="" syntax and capture the data rendered by the tag using the collection="blogrecentposts" syntax  {%endcomment -%}
{tag_blogrecentpost,10 template="" collection="blogrecentposts"}

<div class="BlogRecentPost">
    <ul>
        {%comment -%}  Use liquid to loop through the posts collected by the tag_blogrecentpost  {%endcomment -%}
        {% for post in this.blogrecentposts.items -%}
        <li><a href="{{post.url}}" title="{{post.title}}">{{post.title}}</a></li>
        {% endfor -%}
    </ul>
</div>
{% for i in (1..3) -%}
  <div class="col-4@s">
    <div class="ServiceCard">
      {% comment %}We have to prepopulate these vars before using them{% endcomment %}
      {% assign ItemTitle   = "Services " |  append: forloop.index | append: ' - Title' -%}
      {% assign ItemTeaser  = "Services " |  append: forloop.index | append: ' - Description' -%}
      {% assign ItemLink    = "Services " |  append: forloop.index | append: ' - Link' -%}

      <a href="{{ homepage[ItemLink] }}"
         class="ServiceCard-title"
      >{{ homepage[ItemTitle] }}</a>

      <p class="ServiceCard-content">
        {{ homepage[ItemTeaser] }}
      </p>

      {% if homepage[ItemLink] != "" %}
        <a href="{{ homepage[ItemLink] }}"
           class="Button Button--link Button--arrow ServiceCard-link"
        >Read More</a>
      {% endif %}

    </div>
  </div>
{% endfor -%}
{% if globals.cookie.UN contains '@headjam.com.au' && this.['moduleName'] == "webappitem" -%}
  <script>
    /*<![CDATA[*/
    var editLink = $('<a>').attr({
                            'href'  : '/Admin/CustomContent_Details.aspx?ValueID={{ this.['itemId'] }}',
                            'target': '_blank'
                           })
                           .text('Edit: {{ this.['url'] | split: "/" | first | capitalize }}')
                           .css({'position': 'fixed', 'bottom': 0, 'right': 0, 'padding': '10px', 'backgroundColor': '#ff9800' })

    $('body').append( editLink );
    /*]]>*/
  </script>
{% endif -%}
<p>Dear {tag_recipientname},</p>
<p>Thank you for contacting us! We will be in touch as soon as we can.</p>

{module_webformresults render="item" collection="formResults" template=""}

{% if formresults.eid contains 'requires you to verify your subscription' %}
<h2>Please confirm your request to join our newsletter.</h2>
<p>If you received this email by mistake, simply delete it.</p>
<p>Your request won't go through if you don't click the confirmation link above.</p>



<table width="100%" border="0" cellspacing="0" cellpadding="0" class="mobile-button-container">
<tbody>
<tr>
<td align="center" style="padding: 5px 0px 20px;" class="padding-copy">
  <table border="0" cellspacing="0" cellpadding="0" class="button-wrapper">
    <tbody>
      <tr>
        <td align="center" class="hj-button-can">{tag_verificationurl}</td>
      </tr>
    </tbody>
  </table>
</td>
</tr>
</tbody>
</table>

{% endif %}

<p>--------------</p>

<h2><strong>Message:</strong></h2>
<pre style="font-size: 13px; font-family: sans-serif;">{{ formresults.results.Message }}</pre>
{% comment %}Break the content apart for the body{% endcomment %}
{% assign content = postItem.['body'] %}

{% assign pargraphArray = content | split: '</p>' %}
{% comment %}Get the first paragraph and replaced the part we split on{% endcomment %}
{% assign featurePargraph = pargraphArray[0] | append: '</p>' %}

{% comment %}Safeguarding against bad markup{% endcomment %}
<div style="font-size:30px; font-weight:bold;">
    {% comment %}We strip the html just as a safeguard{% endcomment %}
    {{ featurePargraph | strip_html | prepend: '<p>' | append: '</p>' }}
</div>
<hr>
{% comment %}Post the body with the first paragraph removed{% endcomment %}
{{ content | replace_first: featurePargraph, '' }}
<hr>
<textarea style="width:100%;" cols="30" rows="50"><pre>{{ form | replace: '<td>', '<div class="Control">' | replace: '</td>', '</div>' | replace: '<label', '<label class="Control-label"' | replace: 'cat_textbox', 'ControlInput ControlInput--text' | remove: '<br />' | remove: '<tr>' | remove: '</tr>' | replace: '<select', '<div class="SelectWrap"><select' | replace: '</select>', '</select></div>' }}</pre></textarea>
<div id="test">{{ form }}</div>
<textarea id="replace-form" cols="30" rows="10" style="width: 100%;"></textarea>
<script>
var form = document.getElementById("test");
var replaced = form.innerHTML
                          .replace(/<td><input class="cat_button" type="submit" value="Submit" id="catwebformbutton"><\/td>/g, '<div class="Form-action"><button type="submit" class="Button">Submit<\/button><\/div>')
                          .replace(/<td>/g, '<div class="Control">')
                          .replace(/<label/g, '<label class="Control-label"')
                          .replace(/<\/td>/g, '<\/div>')
                          .replace(/cat_textbox/g, 'ControlInput ControlInput--text')
                          .replace(/<br \/>/g, '')
                          .replace(/<br>/g, '')
                          .replace(/<tr>/g, '')
                          .replace(/<\/tr>/g, '')
                          .replace(/<select/g, '<div class="SelectWrap"><select')
                          .replace(/<\/select>/g, '<\/select><\/div>')
                          .replace(/<table/g, '<fieldset class="Form-inner"')
                          .replace(/<\/table>/g, '<\/fieldset>')
                          .replace(/<span class="req">*<\/span>  Required/, '')
                          .replace(/<tbody>/g, '')
                          .replace(/<\/tbody>/g, '')
;

document.getElementById("replace-form").innerHTML = replaced;

</script>
<script>
{% for myProduct in myProductData.items -%}
  ga('ec:addProduct', {
    'id': {{ myProduct.product.productCode }}',
    'name': {{ myProduct.product.name | remove "'" }}',
    'category' : '',
    'brand' : '',
    'variant' : '{{ myProduct.description | remove "'" }}',
    'price' : '{{ myProduct.unitPrice }}',
    'quantity' : '{{ myProduct.units }}',
  });
  ga('ec:setAction', 'purchase', {
    'id': '{{ myProduct.invoiceNumber }}',
    'affiliation': '',
    'revenue': '{{ myProduct.totalPrice }}',
    'tax': '',
    'shipping': '{{ myProduct.shippingPrice }}',
    'coupon': '{{ myProduct.discountCodeId }}',
  });
{% endfor -%}
</script>
<script type="text/javascript" src="/CatalystScripts/Java_DynMenusSelectedCSS.js"></script>
{module_menu menuId="1336130" template="" collection="menu_1336130"}

<div id="cat_1336130_divs">
    <ul id="nav_1336130">
        {% for item in this.menu_1336130.items -%}
        <li><a href="{{item.url}}">{{item.label}}</a></li>
        {% endfor -%}
        {%comment -%} use globals.user variable to verify if user is logged in  {%endcomment -%}
        {% if globals.user.isLoggedIn == 'true' %}
            <li>{module_logout}</li>
        {% endif -%}
    </ul>
</div>
<script type="text/javascript">catSetSelectedCSSItem('nav_1336130');</script>
{% assign metaTitle = -%}
{% assign metaDescription = -%}
{% assign metaTags = -%}
{% assign metaCategory = -%}
{% assign metaTwitterHandle = -%}
{% assign metaURL = -%}
{% assign metaImage = "" -%}
{% assign metaSiteName = "" -%}
{% assign metaCanonicalURL = "" -%}
{% assign metaFacebookAdminID = "" -%}
{% assign metaTwitterCardType = "" -%}

{% case metaTwitterCardType -%}
  {% when 'summary' -%}
    {% assign metaTwitterSize = 'Width=120&amp;Height=120' -%}
  {% when 'summary_large_image' -%}
    {% assign metaTwitterSize = 'Width=500&amp;Height=270' -%}
  {% when 'photo' -%}
    {% assign metaTwitterSize = 'Width=640&amp;Height=478' -%}
  {% when 'product' -%}
    {% assign metaTwitterSize = 'Width=160&amp;Height=160' -%}
{% endcase -%}



{% comment -%} Place this data between the <head> tags of your website {% endcomment -%}
<title>{{ metaTitle }}</title>

<meta name="keywords" content="{{ metaTags }}" >
<meta name="description" content="{{ metaDescription }}" />

{% comment -%} Twitter Card data - Cards can be - summary, summary_large_image, photo  {% endcomment -%}
<meta name="twitter:card" content="photo">
<meta name="twitter:site" content="{{ metaTwitterHandle }}">
<meta name="twitter:title" content="{{ metaTitle }}">
<meta name="twitter:description" content="{{ metaDescription }}">
<meta name="twitter:creator" content="{{ metaTwitterHandle }}">

{% comment -%} Twitter Summary card images must be at least 120x120px {% endcomment -%}
<meta name="twitter:image" content="{{ metaImage }}?Action=thumbnail&amp;algorithm=fill_proportional&amp;{{ metaTwitterSize }}">

{% comment -%} Open Graph data {% endcomment -%}
<meta property="og:title" content="{{ metaTitle }}" />
<meta property="og:type" content="article" />
<meta property="og:url" content="{{ metaURL }}" />
<meta property="og:image" content="{{ metaImage }}}?Action=thumbnail&amp;algorithm=fill_proportional&amp;Width=1200&amp;Height=630" />
<meta property="og:description" content="{{ metaDescription}}" /> 
<meta property="og:site_name" content="{{ metaSiteName }}" />
<meta property="fb:admins" content="{{ metaFacebookAdminID }}" />

{% comment -%} Open Graph Article (Facebook and Pinterest) {% endcomment -%}
<meta property="article:author" content="{{ metaTwitterHandle }}">
<meta property="article:section" content="{{ metaCategory }}">
<meta property="article:tag" content="{{ metaTags }}">

{% Publish Times %}
<meta property="article:published_time" content="{{ this.['releaseDate'] }}">
<meta property="article:modified_time" content="{{ this.['lastupdatedate'] }}">
<meta property="article:expiration_time" content="{{ this.['expiryDate'] }}">



1
2
3
4
5
6
7
<title>{% if this.['Page Title'] != "" -%}{{ this.['Page Title'] }}{% else -%}{{ name }}{% endif -%}</title>

<meta name="description" content="{% if this.['Meta Description'] != "" -%}{{ this.['Meta Description'] }}{% else -%}{{ description | strip_html | replace: "\n", " " | truncate:155 | lstrip | rstrip }}{% endif -%}">

{% if this.['Image Alt Tag'] != "" -%}{% assign imgAlt = this.['Image Alt Tag'] -%}{% else -%}{% assign imgAlt = name -%}{% endif -%}

{{ imgAlt }}
{module_webapps render="collection" id="Venues" filter="all" resultsPerPage="999" collection="venueList" template=""}

{% for venue in venueList.items -%}
  {% if this.['itemid'] == venue.['itemid'] -%}
    {% assign currentIndex = forloop.index0 %}
    {% assign lastIndex = forloop.length | minus: 1 %}
  {% endif -%}
{% endfor -%}

{% if currentIndex == 0 -%}
  {% assign prevItem = lastIndex %}
{% else -%}
  {% assign prevItem = currentIndex | minus: 1 %}
{% endif -%}

{% if currentIndex == lastIndex -%}
  {% assign nextItem = 0 %}
{% else -%}
  {% assign nextItem = currentIndex | plus: 1 %}
{% endif -%}

{module_webapps render="item" id="Venues" filter="item" itemId="{{ venueList.items[prevItem].['itemid'] }}" resultsPerPage="1" template="/Layouts/WebApps/Venues/card.nextItem.tpl"}
{module_webapps render="item" id="Venues" filter="item" itemId="{{ venueList.items[nextItem].['itemid'] }}" resultsPerPage="1" template="/Layouts/WebApps/Venues/card.prevItem.tpl"}
1
2
3
<a href="{{ this.url | split: '/' | first | prepend: '/' }}"
   title="Back to {{ this.url | split: '/' | first }}"
>{% include "/Templates/_includes/icons/chevron-left.svg" -%}</a>
1
2
3
4
<head>
{module_webapps render="collection" id="Customer Care" filter="all" targetFrame="" resultsPerPage="1" sortType="weightreverse" collection="customerCare" template=""}
<meta http-equiv="refresh" content="0; url={{ customerCare.items[0].url }}" />
</head>
{% assign nameLastLetter = globals.user.firstname | slice: -1, 1 %}
{{ globals.user.firstname }}&rsquo;{% unless nameLastLetter == 's' -%}s{% endunless %} Item.
{% comment %}
To get a random number we use the computer clock.
We split the last to get the most random time we can get.
Maths - (randomNumber / 1000) * arrayLength
Because we are using the for loop offset the arraylength is actuall minue the desired results
{% endcomment %}

{% comment %}The below is for loops to ensure that the array if offset left the desired results{% endcomment %}
{% assign desiredResults = 2 -%}
{% assign arraySize = randomPrograms.items | size | minus: desiredResults -%}

{% comment %}Random Generator{% endcomment %}
{% assign randomRange = arraySize -%}
{% assign randomGenerator = globals.site.dateNow | date: "fffffff" | convert: "number" | divided_by: 10000000.0000000 | times: randomRange | round -%}

{% for event in randomPrograms.items limit: desiredResults offset: randomGenerator -%}
  {%include "/Layouts/WebApps/Program/liquid.list.tpl" -%}
{% endfor -%}
{% assign randomRange = 100 -%}
{% assign randomGenerator = globals.site.dateNow | date: "fffffff" | convert: "number" | divided_by: 10000000.0000000 | times: randomRange | round -%}
1
2
3
4
5
{% if globals.visitor.deviceClass == 'phone' -%}
  {% assign imageResizer = '?Action=thumbnail&Width=800&algorithm=fill_proportional' -%}
{% endif -%}

<img src="{{ item.['Feature Image'] | append: imageResizer }}">
<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "Restaurant",
  "address": {
    "@type": "PostalAddress",
    "addressLocality": "{{ gv_site.locations[0]['suburb'] }}",
    "addressRegion": "{{ gv_site.locations[0]['state'] }}",
    "postalCode": "{{ gv_site.locations[0]['postcode'] }}",
    "streetAddress": "{{ gv_site.locations[0]['address1'] }}"
  },
  "url": "{{ gv_site.domain }}",
  "name": "{{ gv_site.name }}",
  "image": "http://www.blacksheepdarby.com/theme/dist/img/branding/black-logo.png",
  "description": "We are a café and bar in the heart of Newcastle’s bustling Darby St. Our approach is simple, fresh, edgy, and redefines your traditional café menu.",
  "telephone": "{{ gv_site.locations[0]['phone'] | replace: ' ','' | replace: '(', '' | replace: ')', '' }}",
  "priceRange": "$$",
  "servesCuisine": [
    "Breakfast",
    "Lunch",
    "Dinner",
    "Coffee"
  ],
  "menu": "http://www.blacksheepdarby.com/#our-menu",
  "sameAs" : [
  {% for menuSocial in gv_site.social -%}
    "{{ menuSocial[1] }}"{% unless forloop.last -%},{% endunless %}
  {% endfor -%}
  ]
}
</script>
<script type="application/ld+json">
  {
    "@context" : "http://schema.org",
    "@type" : "Organization",
    "name" : "{{ gv_site.name }}",
    "url" : "{{ gv_site.domain }}",
    "sameAs" : [
    {% for menuSocial in gv_site.social -%}
      "{{ menuSocial[1] }}"{% unless forloop.last -%},{% endunless %}
    {% endfor -%}
    ]
  }
</script>
{module_productfeaturelist render="collection" tag="Looks we love" sortType="date" collection="looksWeLove" template=""}
{% assign shareTitle = this.['name'] -%}
{% assign shareURL = this.['url'] | prepend : gv_site.domain -%}
{% assign shareImage = "/theme/dist/img/branding/logo--print.png" | prepend : gv_site.domain -%}
{% assign shareDescription = "Checkout this: " -%}

<ul class="EnquiryCard-share-list List List--justify"><!--
--><li>
    <a href="https://www.facebook.com/sharer/sharer.php?u={{ shareURL | url_param_escape }}"
       title="Facebook"
       rel="external"
       class="EnquiryCard-shareicon"
    >
      Facebook
    </a>
  </li><!--
--><li>
    <a href="https://twitter.com/home?status={{ shareDescription | append : shareURL | url_param_escape }}"
       title="Twitter"
       rel="external"
       class="EnquiryCard-shareicon"
    >
      Twitter
    </a>
  </li><!--
--><li>
    <a href="https://pinterest.com/pin/create/button/?url={{ shareURL | url_param_escape }}&amp;media={{ customShareImage | default: shareImage | url_param_escape }}&amp;description={{ shareDescription | url_param_escape }}"
       title="Pinterest"
       rel="external"
       class="EnquiryCard-shareicon"
    >
      Pinterest
    </a>
  </li><!--
--><li>
    <a href="https://plus.google.com/share?url={{ shareURL | url_param_escape }}"
       title="Google+"
       rel="external"
       class="EnquiryCard-shareicon"
    >
      Google+
    </a>
  </li><!--
--><li>
    <a href="mailto:?&amp;subject={{ shareTitle | append : " - " | append : gv_site.name }}&amp;body={{ shareDescription | append : shareURL }}"
       title="Email"
       rel="external"
       class="EnquiryCard-shareicon"
    >
      Email
    </a>
  </li>
</ul>
1
2
3
4
5
{module_data resource="categories" version="v3" fields="categoryTypeId,category" skip="0" limit="50" where="\{'parentId':'161142','publicAccess':'true'\}" order="id" collection="categories"}

{% for category in categories.items %}
    <a href="{{ category.['categoryTypeId'] }}">{{ category.['category'] }}</a>
{% endfor %}    
{% capture homeAboutText -%}{module_contentholder name="Home - About Summary"}{% endcapture -%}
<p class="Breakout">{{ homeAboutText | strip_html }}</p>
{{this.salePrice | split:'.' | first}}<sup>{{this.salePrice | split:'.' | last}}</sup>
{%comment -%}
    Suppress the output of the module using template="" syntax. Also, capture the data in a collection using collection="shoppingCart" syntax. 
    This way you can customize without JS the layout of the cart summary
{%endcomment -%}

{module_shoppingcartsummary template="" collection="shoppingCart"}
{%comment -%} Use Liquid conditionals for your layout logic {%endcomment -%}

{% if this.shoppingCart.itemCount > 0 -%}
<a href="/OrderRetrievev2.aspx">Shopping Cart ({{this.shoppingCart.itemCount}} items)</a>
{% else -%}
<a href="/OrderRetrievev2.aspx">Shopping Cart (0)</a>
{% endif -%}
1
2
3
4
5
6
7
<select name="CardExpiryYear">
  {% for i in (0..10) -%}
    <option value="{{ globals.site.dateNow | date: "yyyy" | plus: forloop.index0  }}">
      {{ globals.site.dateNow | date: "yyyy" | plus: forloop.index0  }}
    </option>
  {% endfor -%}
</select>
1
2
3
{% capture footerCardSignUpCapture -%}{module_captchav2 backgroundColor="#23135e" foregroundColor="#00e2ff" width="200" height="41" }{% endcapture -%}

{{ footerCardSignUpCapture | replace: 'cat_textbox' , 'ControlInput ControlInput--text' |  remove: 'style="width:200px"' }}
1
2
3
4
5
6
7
<!-- note this requires testing. Author: Adam Cook. -->
{% assign imgSplits = description | split: '<img ' %}
{% for imgSplit in imgSplits %}
	{% comment -%}Each item in the array starts with the middle portion of an img element. We can tell where an img element ends because it will have a closing > character.{% endcomment -%}
	{% assign img = '<img ' | append: imgSplit | split: '>' | first | append: '>' -%}
	{% assign description = description | remove: img -%}
{% endfor %}
HTTPS SSH

You can clone a snippet to your computer for local editing. Learn more.