製品要素

GemPages の製品要素とは何ですか?

その 製品要素 は必須の要素であり、Shopifyから任意の製品を追加できるようにします GemPagesEditor v7 の導入により、以前のバージョンと比べて注目すべき変更点があります。

以下に、これらの重要な更新に関する詳細情報を示します。 

製品要素を使用するには:

• Video Cloud Studioで GemPagesダッシュボード 対象のページをクリックしてエディターで開きます。
• 左側のサイドバーで、 製品要素 下 要素 タブ検索バーを使用すると、この要素をすばやく見つけることができます。
• ご希望の製品レイアウトを選択し、 ドラッグドロップ 要素をページ内の目的の位置に移動します。

子要素

商品要素には、さまざまな商品属性を示すのに役立ついくつかの子要素が含まれています。これらは 要素内に配置する必要がある 正常に機能するには、次の子要素が必要です。

• 製品バッジ
• 商品画像
• 割引タグ
• 商品タイトル
• 製品説明
• 商品価格
• 製品数量
• 製品のバリエーションとサンプル
• 製品ベンダー
• 製品SKU
• 製品バンドル割引
• 商品をカートに追加
• 製品詳細を見る
• ダイナミックチェックアウト
• 製品ファイルのアップロード

注意： 商品の詳細はShopifyストアから直接取得されます。商品情報を編集するには、 Shopify管理者 > 製品、製品を選択して詳細を更新します。

設定タブを構成する

下 設定 タブには、最高のコンバージョン率を実現するためにコンテンツの外観を微調整するための効果的なパラメータが表示されます。

レイアウト

下 レイアウト セクションで、製品を表示するレイアウトを選択します。 水平な or 垂直.

また、拡張設定パネルでは、 組み替​​えます, 複製または 削除 下の列 列の順序.

 列幅コンテンツに合わせて幅を変えたり、比率を変えたりすることができます。

製品ソース

商品ページテンプレート

商品ページの場合は、2つのオプションから商品ソースを変更できます。: 割り当てられた製品別に表示 or 手動で選択.

• 割り当てられた製品別に表示

割り当てられた製品別に表示するオプションを選択すると、現在のテンプレートが割り当てられたすべての製品に動的に適用されます。製品はランダムに選択され、現在のエディター ページに表示されます。

現在の製品ソースにマウスを移動し、 edit アイコンを開く 製品を選択してください ダイアログが表示されます。そこから、割り当てられている他の利用可能な製品を選択できます。

注意： 次のことを行う必要があり テンプレートに製品を割り当てる ライブページに適用されていることを確認してください。

• 手動で選択

このオプションを使用すると、同じテンプレートと特定のバリアント オプションに複数の製品要素を表示できます。 

選択するには、 手動で選択すると、選択できる製品リストを表示するウィンドウが開きます。

別のページタイプ

ページが別のページタイプ（ランディングページ、ホームページなど）の場合は、現在の商品の上にマウスを移動して ペン 編集するアイコン。

次に、製品リストから対象の製品を選択します。

列間隔

スライダーを使用して列間の間隔を設定するか、正確な値を入力します。

デフォルト： 30px

サイズ

• 幅： 製品要素の幅を定義します。
• パディング： 内部間隔（上、右、下、左）を調整します。

経歴

製品要素の背景色を設定できます。カラーコードを入力するか、ページから選択するか、カラー見本から選択します。

形状

製品要素のスタイルをカスタマイズします。

• ボーダー: 実線、破線、点線の境界線を追加する
• コーナー半径: 角を丸める（ピクセル単位）
• Shadow: ソフトシャドウまたはハードシャドウを適用して視認性を高めます

表示オプション

このセクションでは、製品要素を使用して複数の製品を表示するときに、バリエーションと数量の動作を制御できます。

デフォルトのバリアント: ページの読み込み時に特定のバリアントを事前に選択したい場合は、これを YES に切り替えます。

注意： この機能を使用するには、商品ソースが 手動で選択 割り当てられた製品の代わりに。

調子： これはどのように定義されるか バリアント and 量 製品間でリンクされています:

• 同じ商品間のリンクバリアント、数量: バリアントは同じ数量を共有し、1 つの統合された製品ブロックとして動作します。
• 同じ商品間のバリアントと数量のリンクを解除します: 各バリアントは、同じ製品に属している場合でも、数量の点では個別に扱われます。

注意： 製品要素の製品ソースを次のように変更します。 手動で選択 デフォルトのバリアントをカスタマイズします。 さらに詳しく.

整列

下 整列 セクションで、商品要素の垂直方向の配置を設定します。以下から選択できます。

• 上に揃える
• センターの整列
• 下に揃える
• 垂直間隔を均等にする

詳細タブを設定する

追加のスタイルオプションについては、「詳細設定」タブに移動し、 この記事.