SHOP Builderを使用して高度なページを追加または編集する際には、「テキスト付き商品」ウィジェットを使用して、商品に魅力的なプロモーションコピーを追加し、トラフィックと顧客の閲覧を引き付けることができます。
⚠️ 始める前に：
- SHOP Builderは現在、Ultra Chic、Kingsman、Varm、およびPhiliaテーマテンプレートのみをサポートしています。
- SHOP Builderを使用してページを作成した後、他のテーマテンプレートに切り替えてもページは表示されますが、編集できず、レイアウトが崩れる可能性があります。ページを公開する前にこれに注意してください。
1. テキスト付き商品ウィジェットを追加する
ステップ 1
SHOPLINE管理者に進み、> [オンラインストアデザイン] > [ページ]をクリックし、高度なページ/編集をクリックして「高度なページ」設定ページを開きます。
ステップ 2
ウィジェットボタンをクリックします。
ステップ 3
「商品」の下にあるテキスト付き商品ウィジェットをクリックします。
ステップ 4
商品とテキストウィジェットをクリックして、関連するテキストを追加および編集できます。
左側のアイコンをクリックして、画像やテキストの順序を再配置します。
ステップ 5
商品をクリックし、 + 商品ボタンをクリックします。ウィンドウがポップアップして商品が表示されます。
検索バーで名前やタグで追加したい商品を見つけるか、直接スクロールして見つけます。商品を選択したら、確認ボタンをクリックします。
*注意：
- 商品を非表示の商品として追加する場合は、「非表示商品」トグルを有効にすることを確認してください。そうしないと、システムは非表示商品の画像や価格を表示できません。
- 追加した商品が未公開の場合、システムは商品画像と価格を表示できません（上の画像に示されている通り）。商品を公開し、SHOP Builderでの編集を再開するには、管理者の[商品 & カテゴリ] > [商品]に移動してください。
ステップ 6
テキストをクリックし、商品テキストを入力して関連する設定を調整します。以下のフィールドを調整できます：
-
タイトル：商品タイトルを挿入します。以下のスタイル設定もカスタマイズできます。スタイル設定の表示順は：ウィジェットのスタイル設定 > ストア設定。
- 見出しタグ：H1からH6までの6つのオプションがあります。システムのデフォルトはH3です。
- テキストカラー：パレットを開いてテキストカラーを選択するか、カラーコードを入力します。
- フォントサイズ：16/20/24/28/32から選択できます。実際のフォントサイズは、ストア設定で設定したフォントサイズに基づいて比例的にスケールします。
-
サブタイトル：商品サブタイトルを挿入します。以下のスタイル設定もカスタマイズできます。スタイル設定の表示順は：ウィジェットのスタイル設定 > ストア設定。
- 見出しタグ：H1からH6までの6つのオプションがあります。システムのデフォルトはH4です。
- テキストカラー：パレットを開いてテキストカラーを選択するか、カラーコードを入力します。
- フォントサイズ：14/16/18/20/22から選択できます。実際のフォントサイズは、ストア設定で設定したフォントサイズに基づいて比例的にスケールします。
-
コンテンツ：商品の説明を挿入します。以下のスタイル設定もカスタマイズできます。
- フォントサイズ：12/14/16/18/20から選択できます。実際のフォントサイズは、ストア設定で設定したフォントサイズに基づいて比例的にスケールします。
- テキストカラー：パレットを開いてテキストカラーを選択するか、カラーコードを入力します。
- リスト：箇条書きリストまたは番号付きリストを追加できます。
- 全画面編集：全画面編集モードに入って、コンテンツをより簡単に作成できます。
- ボタンテキスト：ボタンテキストを挿入します。
-
リンク先：テキストにURLを挿入します。URLを開く方法は2つあります：
- 現在のウィンドウ：現在のウィンドウからページを直接開く
- 新しいウィンドウ：新しいウィンドウでページを開く。
*注意：
- スタイル設定の表示順は：ウィジェットのスタイル設定 > ストア設定。
- カスタムリキッドを使用してページレイアウトを調整した場合、ウィジェットのスタイル設定を調整した後にカスタムリキッドのルールを編集する必要があります。
- 現在、Shopper Appはウィジェットのテキストカラーとフォントサイズのカスタマイズをサポートしていません。
ステップ 7
他の関連設定を引き続き調整します。
- パディング：ページと画像およびテキストの間のパディングを調整できます。
- 画像比率：現在、ウェブ版の画像比率の調整のみをサポートしています。
- テキストの配置：テキストの配置を調整します。（左/中央/右）。
ステップ 8
設定中に、下部の保存ボタンをクリックすると、追加した動画ウィジェットのプレビュー画面が右側に表示されます。
ステップ 9
上記が完了したら、公開ボタンをクリックすると、顧客はストアフロントでこのページの追加コンテンツを見ることができます。
続きを読む
この記事はAIを使用して翻訳されており、不正確な部分が含まれている可能性があります。最も正確な情報については、元の英語版を参照してください。
コメント