Liquid、JavaScriptなどに関する質問
OS2.0からメタフィールドが実装できると思います。メタフィールド設定画面で「ファイル」があるのですが、実際にそのファイル(商品説明の画像やPDF)を商品詳細ページに挿入する方法をご存知の方はいらっしゃいますか?
こちらでやってみたのですが、テキスト(動的)しか追加挿入できないようで困っています。
解決済! ベストソリューションを見る。
成功
⇨Liquidを触る必要はありますか?
基本的にメタフィールドを登録しただけでは出力されません。
テーマによってはテーマのコード編集が必要ですが、Dawnの場合はカスタマイザーで設定可能です。
{% assign field = product.metafields.my_fields.pdf %}
{% assign file = field | file_url %}
{% if field != blank %}
{{ 'ダウンロード' | link_to: file, target: '_blank' }}
{% endif %}
以前のコードに分岐を付けて、メタフィールドにPDFの登録がない場合は出力されないようにしています。
後は好きな位置にドラッグして保存すれば以下のHTMLで出力されます。
<a href="//cdn.shopify.com/s/files/...../xxxx.pdf?v=123" target="_blank" rel="nofollow">ダウンロード</a>
単純に<a>タグのみの出力なのでご自由にhtmlタグを追記してください。
こういうことでしょうか?
{% assign file = product.metafields.my_fields._key | file_url %}
{{ 'DOWNLOAD' | link_to: file, target: '_blank' }}
↓「abcd.pdf」をメタフィールドにアップロードした際の出力結果
<a href="//cdn.shopify.com/s/files/...../abcd.pdf?v=123" target="_blank" rel="nofollow">DOWNLOAD</a>
メタフィールドが「ファイル」の場合、file_urlを付けることでアップロードしたファイルのURLが出力できます。
https://shopify.dev/api/liquid/filters/url-filters#file_url
これを商品詳細ページに挿入すれば良いかと思います。
ちなみにShopifyはファイルURLがCDNになるのでブラウザによってdownload属性が効きません。
その代わりとして「target="_blank"」を入れてあります。
ありがとうございます。Liquidなど少々難しいので、もし可能でしたら再度教えていただけないでしょうか
何がわからなくて、最終的にどうしたいのか、具体的に教えていただけますか?
スキルによって実装は難しいので、外部パートナーに依頼することをお勧めします。
メタフィールドで商品詳細ページにPDFを表示させたいです。(おそらくメタフィールドのファイルを洗濯するかと)
Dawnでやってみましたが、PDFが商品詳細ページに表示されなかったので、手順などがわかればご教示いただきたいです。
⇨Liquidを触る必要はありますか?
成功
⇨Liquidを触る必要はありますか?
基本的にメタフィールドを登録しただけでは出力されません。
テーマによってはテーマのコード編集が必要ですが、Dawnの場合はカスタマイザーで設定可能です。
{% assign field = product.metafields.my_fields.pdf %}
{% assign file = field | file_url %}
{% if field != blank %}
{{ 'ダウンロード' | link_to: file, target: '_blank' }}
{% endif %}
以前のコードに分岐を付けて、メタフィールドにPDFの登録がない場合は出力されないようにしています。
後は好きな位置にドラッグして保存すれば以下のHTMLで出力されます。
<a href="//cdn.shopify.com/s/files/...../xxxx.pdf?v=123" target="_blank" rel="nofollow">ダウンロード</a>
単純に<a>タグのみの出力なのでご自由にhtmlタグを追記してください。
理解できました!
ご丁寧なご回答まことにありがとうございました!
もう1点、以下について知見をお持ちでしょうか?
ユーザー | ランク |
---|---|
46 | |
30 | |
22 | |
4 | |
4 |
山田繊維株式会社(むす美)は京都の地で風呂敷製造卸売業:山田貫七商店として昭和12年に創業。メイン商材は1000年以上前から使われているという記録がある風呂敷で、その他ハンカチや袱...
By Nanami Jan 12, 2023過去に失われた売り上げを回復するには?Shopifyの新しい自動化機能を活用し、失われた売り上げを簡単に回復する方法を学びましょう!
By Mirai Jan 10, 2023オンラインストアの構築が完了しましたら、一般公開をする前にいくつかのテスト注文を行い、チェックアウトプロセスを確認することが大事です。Shopifyペイメントをご利用いただいている...
By rinaflora Dec 4, 2022