在Shopify液体链接中添加一个类？

Question

我正在尝试为我的客户生成一个注销链接，但希望将一个类应用于该链接。

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

以上液体代码生成

<a href="/account/logout" id="customer_logout_link">Log out</a>

我想添加一个class属性。例如，

<a href="/account/logout" class="CLASS-NAME" id="customer_logout_link">Log out</a>

Answer 1

您可以使用replace过滤器添加要链接的课程，您的代码将如下所示

{{ 'layout.customer.log_out' | t | customer_logout_link | replace: '<a', '<a class="my_class"' }}

Answer 2

您无法直接将类添加到链接过滤器，但您可以添加自己的链接。

因此，以下代码{{ 'layout.customer.log_out' | t | customer_logout_link }}将转换为。

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

你可以添加你喜欢的课程。

过滤器customer_logout_link只是编写标准链接的简写。如果您打算使用按钮的标准HTML结构之外的任何内容，只需将其作为标准html链接写下来。

Answer 3

出于两全其美的考虑，您仍然可以利用动态网址，并通过在液体中添加route作为href来将其分解为您自己的html。 See Shopify documentation on routes

<a href="{{ routes.account_logout_url }}" class="my_class" >
  {{ 'layout.customer.log_out' | t }}
</a>