📘 公式リファレンス🔧 リファレンス/フィルター初級

link_to フィルター（テキストをリンクに変換）

テキスト文字列を HTML のアンカータグ(`<a>`)に変換するフィルター。URL を指定してリンク化し、必要に応じて class や target などの HTML 属性を追加できる。

用途

ストア名やテキスト文字列を外部サイトやストア内ページへのリンクに変換したいとき。ヘッダー、フッター、通知メッセージなど様々な場面で使用できる。

設置場所

Liquid ファイル内で `{{ 'テキスト' | link_to: 'https://example.com' }}` の形で使用する。class や id などの属性を追加する場合は `{{ 'テキスト' | link_to: 'https://example.com', class: 'my-class' }}` のように記述する。

注意点

URL は必須パラメータであり、省略するとエラーになる。HTML 属性（class、id、target、rel など）は複数指定でき、属性名はそのまま Liquid パラメータ名として渡す。target: '_blank' を指定する場合は `rel: 'noopener noreferrer'` を併せて設定してセキュリティ向上を図るとよい。

タグ:linkhtmlanchorattribute

仕様

50 行 / json

{
  "category": "html",
  "deprecated": false,
  "deprecation_reason": "",
  "description": "",
  "parameters": [
    {
      "description": "The URL to link to.",
      "name": "url",
      "positional": true,
      "required": true,
      "types": [
        "string"
      ]
    }
  ],
  "return_type": [
    {
      "type": "string",
      "name": "",
      "description": "",
      "array_value": ""
    }
  ],
  "examples": [
    {
      "name": "",
      "description": "",
      "syntax": "",
      "path": "/",
      "raw_liquid": "{{ 'Shopify' | link_to: 'https://www.shopify.com' }}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "HTML attributes",
      "description": "You can specify [HTML attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attributes) by including a parameter that matches the attribute name, and the desired value.\n",
      "syntax": "string | link_to_type: attribute: string",
      "path": "/",
      "raw_liquid": "{{ 'Shopify' | link_to: 'https://www.shopify.com', class: 'link-class' }}",
      "parameter": true,
      "display_type": "text",
      "show_data_tab": true
    }
  ],
  "summary": "Generates an HTML `&lt;a&gt;` tag.",
  "syntax": "string | link_to: string",
  "name": "link_to"
}

出典・ライセンス

Source:: Shopify/theme-liquid-docs/data/filters.json
Repository:: https://github.com/Shopify/theme-liquid-docs
License:: MIT

このコードは Shopify 著作の MIT ライセンスソースです。原本の著作権は Shopify が保有します。日本語訳は ALSEL によるものです。

link_to フィルター（テキストをリンクに変換）

仕様

出典・ライセンス

関連項目

avatar フィルター（顧客アバター画像HTML生成）

default_errors フィルター（フォーム送信エラーを日本語化）

date フィルター（日付を指定形式でフォーマット）

payment_terms フィルター（Shop Pay分割払いバナーを生成）

abs フィルター（数値の絶対値を取得）

append フィルター（文字列の末尾に追加）