Shopifyの明細書発行アプリ「Order Printer」にメタフィールドの値を出力したい。
しかし、一般的な出力構文である{{ resource.metafields.namespace.key }}では出力できなくて困っている。
こんなことを考えている方へ。
この記事のポイントは以下です。
■■Shopifyを学ぼう■■
人気記事 1.5万文字でデイトラShopifyコース!を徹底解説!口コミはこちら📺
人気記事 2万文字で忍者CODEShopifyコース!を徹底解説!口コミはこちら📺
人気記事 Shopifyのおすすめ学習方法まとめ!👩💻
人気記事 筆者の経験談!独学ロードマップ決定版!🖥
人気記事 Shopifyを学べるおすすめの書籍まとめ!📚
人気記事 日本語のみを厳選!おすすめのUdemy動画教材🎦
人気記事 コピペでOK!カスタマイズパーツ販売中📝
【Shopify】メタフィールドをOrder Printerに出力する方法
Shopify公式の明細書発行アプリ「Order Printer」でメタフィールドを出力する方法を解説します。
一般的なメタフィールドの出力構文ではOrder Printerへの出力ができないので注意が必要です。
これについてShopify公式サポートに問い合わせてみたところ、サポート対象外との回答でした。そこで、Shopifyコミュニティで質問をしてみたら解決しました。
メタフィールドを作成する
まずは「Order Printer」に出力するためのメタフィールドを作成します。
管理画面の「設定」を押します。
メニューの中の「メタフィールド」を選びます。
今回は例として「商品」のメタフィールドを作成します。「新しいフィールドを追加するストアの構成部分を選択します」で「商品」を選びます。
画面が切り替わったら、右上にある「定義を追加する」を押します。
「商品メタフィールドの定義を追加する」の画面で、
を入力します。
メタフィールドの種類はプルダウンの中から選ぶことができます。
メタフィールドは、
など、種類がいろいろあります。
単一行のテキストや複数行のテキストの場合、「検証」というエリアで入力ルールを決めることができます。
今回は例として「単一行のテキスト」を設定することにします。
設定が終わったら「保存」を押します。
すると、メタフィールドが追加されました。
メタフィールドに値を入力する
続いて、今作成したメタフィールドに値を入力してみます。管理画面の「商品管理」を開きます。
Shopifyに登録されている商品一覧が表示されるので、メタフィールドを入力したい商品を選択します。
商品の編集ページの最下部に「メタフィールド」のエリアがあります。ここに設定した「名前」のメタフィールドがあるはずです。
Order Printerのテンプレート編集を開く
では、値を入力した商品メタフィールドをOrder Printerに出力します。まずはアプリから「Order Printer」を選択します。
テンプレートが表示されます。テンプレート名をクリックすると、以下のようなLiquidのコードの編集画面が開きます。
このコードを編集することで、メタフィールドの値をOrder Printerに出力することができます。
{% for line_item in line_items %}{% endfor %}の中にメタフィールドの出力構文を書く
コードの中で、
{% for line_item in line_items %} ・・・中略・・・ {% endfor %}
の記述を見つけます。
この記述は、購入した商品を出力させるループ処理の記述です。だいたい50行目〜60行目付近にあります。
このループ処理の中に、
{{ line_item.resource.metafields.key.value }}
のルールで記述すればOKです。
今回は「商品」のメタフィールドなので、「resource」の部分が「product」になります。つまり、以下の記述を入れれば良いです。
{{ line_item.product.metafields.key.value }}
一般的なメタフィールドの出力構文で必要な「namespace」は不要です。「key」にはメタフィールド作成時に設定した値を入れます。
実際にコードに反映させると、以下のようになります。
繰り返しになりますが、「key」の部分には自分が設定したkeyを入れてください。
これでSaveを押します。
プレビューで表示を確認する
最後にプレビューで、メタフィールドが正しく出力されているかを確認します。これで無事、Order Printerにメタフィールドを出力することができました。
【体験談】Order Printerにメタフィールドを出力したかった理由
Order Printerにメタフィールドを出力したかった理由は、
です。
詳しく解説します。
越境ECで英語の商品名をOrder Printerに出力したかった
最近、越境ECのサイトをShopifyで制作しました。
ストアフロントの翻訳は、「T Lab ‑ AI Language Translate」を使って行っていました。無料で使える優秀な翻訳アプリです。
ストアフロントの翻訳は何も問題がなく完了しました。
次に考えないといけないのは、明細書の翻訳です。購入時に商品に同梱する明細書は「Order Printer」を使って出力することにしました。
今回のサイトの場合、
という仕組みにする必要があります。
日・英両方の明細書の設定を進めていたのですが、どうやっても「商品名」だけが翻訳できませんでした。
もちろん、「T Lab ‑ AI Language Translate」で商品名の翻訳はできます。しかし、このアプリで翻訳されるのはあくまでストアフロントです。「Order Printer」で出力する商品名まで翻訳することができないのです。
「Order Printer」では、商品名を出力する変数 {{ product.title }} を使うことができるのですが、もともと登録している日本語の商品名しか出力できませんでした。
どうしても英語の商品名が出力できない・・・
というわけで、
「英語の明細書用の商品名」のメタフィールドを作成して、英語版の明細書の商品名にはそのメタフィールドの値を出力させよう
と考えました。
「英語用商品名」というメタフィールドを作成した
「設定>メタフィールド>商品」と進み、「英語の明細書用の商品名」という「単一行のテキスト」のメタフィールドを作成しました。
商品の編集画面に行くと、「英語の明細書用の商品名」のフィールドができています。ここに、英語版の商品名を入力しました。
一般的なメタフィールドの出力構文ではOrder Printerへの出力ができない
あとはOrder Printerのコードを編集してメタフィールドの値を出力するだけ
と思っていたのですが、ここでも壁にぶつかります。
なんと、一般的な出力構文を書いても、Order Printerではメタフィールドの値を出力できなかったのです。ちなみに、一般的なメタフィールドの出力構文は以下です。
{{ resource.metafields.namespace.key }}
Order Printerではこのコードを書いても、メタフィールドを出力することができなかったんですよね。
Shopify公式サポートに問い合わせてみたがサポート対象外との回答
どうして出力できないのか分からなかったので、Shopifyサポートに問い合わせをしました。
しかし、サポートの対象外との返事がきました。その代わりに「Shopifyコミュニティで質問してみては?」との提案をしてもらいました。
メタフィールドの値を明細書に表示させたいとのことで、コードやご参照になられたコミュニティのリンクをご明記していただいてありがとうございます。
コード等に関してご報告いただいたのですが、コード編集、メタフィールドやAPIを使用したアプリ開発やストア開発作業については、当窓口のサポート対象外となります。
ご質問していただいている内容については、弊社開発者向けコミュニティでご質問を行っていただけると、コードやAPI関連の必要な知識と経験を持ったShopifyパートナーやご利用者様より回答が可能ですので、こちらのご活用をご検討お願い申し上げます。
Shopifyコミュニティで質問したら解決した
そんなわけで、Shopifyコミュニティにスレッドを立てて質問しました。
すると、他のユーザーから回答があり無事解決しました。
結論、Order Printerでメタフィールドを出力するには、以下の一般的なコードでは駄目で、
{{ resource.metafields.namespace.key }}
以下のコードじゃないと出力ができないようです。
{{ resource.metafields.key.value }}
「namespace」が不要で、「value」が新たに必要です。
参考:Shopifyを学ぶ方法まとめ|オンラインスクール・本・動画
Shopifyを本格的に学ぶためにはネットの情報だけは足りません。
そこで、仕事でShopifyを扱っている筆者が、おすすめの学習方法をまとめました。
オンラインスクール、本(参考書)、動画教材(Udemy)を活用して、効果的に学習しましょう。思い切って有料の教材を買って体系的に学ぶことで、操作に悩む時間が減りますし、より高度なカスタマイズや提案ができるようになり、仕事の幅が広がります。
■■Shopifyを学ぼう■■
人気記事 1.5万文字でデイトラShopifyコース!を徹底解説!口コミはこちら📺
人気記事 2万文字で忍者CODEShopifyコース!を徹底解説!口コミはこちら📺
人気記事 Shopifyのおすすめ学習方法まとめ!👩💻
人気記事 筆者の経験談!独学ロードマップ決定版!🖥
人気記事 Shopifyを学べるおすすめの書籍まとめ!📚
人気記事 日本語のみを厳選!おすすめのUdemy動画教材🎦
人気記事 コピペでOK!カスタマイズパーツ販売中📝
■■Udemyは初回購入がお得■■
Point 通常1万〜2万円の商品が80%OFF〜90%OFF程度の値段で購入できる!
Point ランチ1回分の値段でShopifyを学べます!
まとめ
この記事のポイントをまとめます。
今回の記事はここまでです。