はじめに

ネットショップの販促の一つとして、商品の無料ラッピングや名入れなどのサービスが挙げられます。
Shopifyでストアを運営しているマーチャントさんの中にも、このような無料サービスの提供を検討されている方は多いのではないでしょうか。

Shopifyで無料オプションを追加する方法としては、外部アプリを利用する方法や専用の商品ページを作成してそこに遷移させる方法などがあります。
しかし、アプリの導入で月額費用が発生したり、別ページを作ることでエンドユーザーに分かりづらさを与えてしまったりと、デメリットも少なくありません。

そこで本記事では、Shopifyの標準機能である「Line Item Property」を活用して、アプリを使用せずに無料オプション項目を商品ページへ実装する方法をご紹介します。
手順に沿って進めることでストアの機能を簡単に拡張できますので、ぜひ最後までご覧ください！

実装方法

1. 「Line Item Property」で任意のオプション項目を作成する

Line Item Propertyで、商品ページに追加したいオプションの項目内容に合わせてオプションの形式（Type）と見出し（label）を入力し、必要に応じてオプション内容を設定していきます。
「Type」は、単文テキスト・長文テキスト・ラジオボタン・ドロップダウンリスト・チェックボックス(1つ)・チェックボックス(複数)の6種類から選ぶことができます。

本記事では以下の画像のように、無料ラッピングを希望する場合のチェックボックスと、ラッピングリボンの色を選択してもらうためのドロップダウンリストを作成しました。
※CSSでスタイルを調整しています。

各フィールドの内容を設定後、ページ下部で生成されたオプション用のコードをコピーしてください。

2. コピーしたコードを「buy-buttons.liquid」に追加する

上記でコピーしたコードを、「buy-buttons.liquid」のカート追加ボタンの記述上あたりに貼り付けます。
今回はオプション用のコードに加え、より分かりやすくなるようオプション案内のテキストも追加しました。（画像はクリックで拡大します）

無事実装ができると、オプションを選んでカートに追加した際にカート画面でも選択内容が表示されます。
※カートに表示するためには「Line Item Property」で「Show at checkout」を選択している必要があります。

「Show at checkout」にチェックを入れておくことで、カート画面に限らず、チェックアウトページや注文サマリーにもオプション情報を反映させることができます。
エンドユーザーが自身で選んだ内容を購入前に確認できるため、安心感と利便性に繋がります。
またマーチャントにとっても、受注内容の確認・管理という点で大きなメリットがありますので、ぜひマストで設定しましょう！

まとめ

いかがでしたか？
Line Item Propertyを使うことで、今回ご紹介したオプションの他にも、熨斗や刻印サービス、ギフト対応（領収書の同梱不要など）として活用することもできます。
費用をかけることなく柔軟にカスタマイズすることが可能なため、商品や顧客ニーズに合った項目を幅広く追加でき、購入率と顧客満足度の向上へと繋げられます。

選択されたオプション情報を注文確認メールに反映するなど、さらに応用したカスタマイズも可能です。
弊社では売上をアップさせるためのより良い運用方法や施策をご提案させていただいておりますので、運用でお悩みの方はぜひお気軽にお問い合わせください！