Liquid tips and tricks Print

Dynamically display the current year using Liquid for copyright notice

Instead of having to change the year in your website's copyright notice, simply use Liquid Global Variable to display the current year.

Type in {{globals.site.dateNow | date: "yyyy"}} in your HTML code where you want to display the year.

What's happening is the Liquid Global pulls the current date, then using a Liquid Filter "Date" we filter out just the year.

Call device-specific CSS or JS resources

Use Liquid to have specific CSS or JS resources utilized depending on the user's device.

1. For each device (phone,tablet,desktop) create your css or js files using one of the device types. IE: phone.css or desktop.js.
2. Next upload your file(s) into your website's "Manage Documents" folder.
3. Depending on what file(s) you added, you will need to connect the site to the files using code like this in your header or footer of your website. Make sure this code appears on the Web Pages you want. 

CSS Example

<link href="/Documents/path-to-your-file/{{globals.cookie.visitorDeviceClass}}.css" />

JS Example

<script src="/Documents/path-to-your-file/{{globals.cookie.visitorDeviceClass}}.js"></script>

Display device-specific markup

{% if {{globals.cookie.visitorDeviceClass}} == "phone" -%}
<p>Phone Specific content.</p>
{% else -%}
<p>Desktop Specific content.</p>
{% endif -%}

Using bb_pagename Module value in a Liquid IF statement

This tip explains how to display specific content on Web Pages based on BB Module values. For example using the {bb_pagename} value to display a form.

Let's say on your Page Template applied to every page. And on the Page Template there is a Content Holder called "Call To Action" at the bottom that contains the contact form. Only problem is now the same form is on the Contact page twice. Not good design.

So to prevent the "Call To Action" Content Holder from displaying on the Contact page you can use code like this to determine if the content between the IF statement should display or not based on the Page Name.

{% if 'bb_pagename' != "Contact" -%}
  {bb_contentholder source="Call To Action"}
{% endif -%}