📘 公式リファレンス🔧 リファレンス/フィルター初級
global_asset_url フィルター(Shopify CDN上の共有アセットのURL取得)
Shopify サーバー上で管理されているグローバルアセット(JavaScriptライブラリ・CSS・画像ファイルなど)の CDN URL を取得するフィルター。外部 CDN より高速に読み込める。
用途
Prototype.js、Lightbox、script.aculo.us などの古いライブラリや、Shopify 提供の共有 CSS を Liquid テンプレートから参照したいとき。
設置場所
任意のテンプレート内で `{{ 'lightbox.js' | global_asset_url | script_tag }}` のように使用。JavaScript の場合は `script_tag` フィルター、CSS の場合は `stylesheet_tag` フィルターと組み合わせて出力する。
注意点
このフィルターは古いライブラリ(Prototype 1.5〜1.6、script.aculo.us 1.8.2 など)を対象としており、現代的な JavaScript フレームワークは対象外。asset ファイルなど theme.liquid 上の自作アセットを読み込む場合は `global_asset_url` ではなく `asset_url` フィルターを使う。利用可能なアセット一覧は仕様に記載のとおり限定されているため、その他のライブラリは CDN リンク URL を直接記述する必要がある。
仕様
30 行 / json{
"category": "hosted_file",
"deprecated": false,
"deprecation_reason": "",
"description": "Global assets are kept in a directory on Shopify's server. Using global assets can be faster than loading the resource\ndirectly.\n\nDepending on the resource type, you might need to use an additional filter to load the resource. The following table\noutlines which filter to use for specific resource types.\n\n| Resource type | Additional filter |\n| --- | --- |\n| JavaScript (`.js`) | [`script_tag`](/docs/api/liquid/filters/script_tag) |\n| CSS (`.css`) | [`stylesheet_tag`](/docs/api/liquid/filters/stylesheet_tag) |\n\nThe following table outlines the available global assets:\n\n| Category | Assets |\n| --- | --- |\n| Firebug | - `firebug/firebug.css`<br>- `firebug/firebug.html`<br>- `firebug/firebug.js`<br>- `firebug/firebugx.js`<br>- `firebug/errorIcon.png`<br>- `firebug/infoIcon.png`<br>- `firebug/warningIcon.png` |\n| JavaScript libraries | - `controls.js`<br>- `dragdrop.js`<br>- `effects.js`<br>- `ga.js`<br>- `mootools.js` |\n| Lightbox | - `lightbox.css`<br>- `lightbox.js`<br><br>- `lightbox/v1/lightbox.css`<br>- `lightbox/v1/lightbox.js`<br><br>- `lightbox/v2/lightbox.css`<br>- `lightbox/v2/lightbox.js`<br>- `lightbox/v2/close.gif`<br>- `lightbox/v2/loading.gif`<br>- `lightbox/v2/overlay.png`<br>- `lightbox/v2/zoom-lg.gif`<br><br>- `lightbox/v204/lightbox.css`<br>- `lightbox/v204/lightbox.js`<br>- `lightbox/v204/bullet.gif`<br>- `lightbox/v204/close.gif`<br>- `lightbox/v204/closelabel.gif`<br>- `lightbox/v204/donatebutton.gif`<br>- `lightbox/v204/downloadicon.gif`<br>- `lightbox/v204/loading.gif`<br>- `lightbox/v204/nextlabel.png`<br>- `lightbox/v204/prevlabel.gif` |\n| Prototype | - `prototype.js`<br>- `prototype/1.5/prototype.js`<br>- `prototype/1.6/prototype.js` |\n| script.aculo.us | - `scriptaculous/1.8.2/scriptaculous.js`<br>- `scriptaculous/1.8.2/builder.js`<br>- `scriptaculous/1.8.2/controls.js`<br>- `scriptaculous/1.8.2/dragdrop.js`<br>- `scriptaculous/1.8.2/effects.js`<br>- `scriptaculous/1.8.2/slider.js`<br>- `scriptaculous/1.8.2/sound.js`<br>- `scriptaculous/1.8.2/unittest.js` |\n| Shopify | - `list-collection.css`<br>- `textile.css` |",
"parameters": [],
"return_type": [
{
"type": "string",
"name": "",
"description": "",
"array_value": ""
}
],
"examples": [
{
"name": "",
"description": "",
"syntax": "",
"path": "/",
"raw_liquid": "{{ 'lightbox.js' | global_asset_url | script_tag }}\n\n{{ 'lightbox.css' | global_asset_url | stylesheet_tag }}",
"parameter": false,
"display_type": "text",
"show_data_tab": true
}
],
"summary": "Returns the [CDN URL](/themes/best-practices/performance/platform#shopify-cdn) for a global asset.",
"syntax": "string | global_asset_url",
"name": "global_asset_url"
}出典・ライセンス
- Repository:
- https://github.com/Shopify/theme-liquid-docs
- License:
- MIT
このコードは Shopify 著作の MIT ライセンスソースです。 原本の著作権は Shopify が保有します。日本語訳は ALSEL によるものです。
関連項目
📘 公式リファレンス🔧 リファレンス/フィルター初級
avatar フィルター(顧客アバター画像HTML生成)
顧客アバターが存在する場合、それを表示する HTML タグを生成するフィルター。customer オブジェクトに対して使用する。
📁 theme-liquid-docs·MIT·19 行
📘 公式リファレンス🔧 リファレンス/フィルター初級
default_errors フィルター(フォーム送信エラーを日本語化)
form.errors の各エラーコードに対応する既定のエラーメッセージを自動生成するフィルター。フォーム送信時の入力値不正や必須項目空白などのエラーを言語別に出力する。
📁 theme-liquid-docs·MIT·19 行
📘 公式リファレンス🔧 リファレンス/フィルター初級
date フィルター(日付を指定形式でフォーマット)
日付値を指定されたフォーマット文字列に従って整形する。フォーマット文字列が空の場合は元の値がそのまま返される。入力が日付に変換できない場合も元の値が返される。
📁 theme-liquid-docs·MIT·19 行
📘 公式リファレンス🔧 リファレンス/フィルター初級
payment_terms フィルター(Shop Pay分割払いバナーを生成)
product フォームまたは cart フォームに対して使用し、Shop Pay の分割払いオプションを表示するための HTML を生成するフィルター。顧客が購入時に分割払いプランを選択できるようにする。
📁 theme-liquid-docs·MIT·19 行
📘 公式リファレンス🔧 リファレンス/フィルター初級
abs フィルター(数値の絶対値を取得)
負の数を正の数に変換する。数値の絶対値(ゼロからの距離)を返すフィルター。
📁 theme-liquid-docs·MIT·30 行
📘 公式リファレンス🔧 リファレンス/フィルター初級
append フィルター(文字列の末尾に追加)
文字列の末尾に別の文字列を連結するフィルター。URL パスの結合やテキストの接尾辞追加に使う。
📁 theme-liquid-docs·MIT·30 行