Ad

Add A Class To A Shopify Liquid Link?

- 1 answer

I am trying to generate a log out link for my customers but want to apply a class to the link.

{{ 'layout.customer.log_out' | t | customer_logout_link }}

The above liquid code generates

<a target="_blank" rel="nofollow noreferrer" href="/account/logout" id="customer_logout_link">Log out</a>

I would like to add a class attribute. For example,

<a target="_blank" rel="nofollow noreferrer" href="/account/logout" class="CLASS-NAME" id="customer_logout_link">Log out</a>
Ad

Answer

You can't add class directly to the link filter, but you can add your own link.

So the following code {{ 'layout.customer.log_out' | t | customer_logout_link }} will be converted to.

<a target="_blank" rel="nofollow noreferrer" href="/account/logout" id="customer_logout_link">{{ 'layout.customer.log_out' | t }}</a>

And you can add what ever class you like.

The filter customer_logout_link is just a shorthand to write the standard link. If you plan to use anything outside the standard HTML structure of the button just write it down as a standard html link.

Ad
source: stackoverflow.com
Ad