blocksy 2でWooCommerceの商品にバリエーションスウォッチを追加する

競争の激しいeコマース環境において、商品ディスプレイの直感性や美しさを向上させることは、ユーザーの購買決定に直結する。blocksy 2 テーマ発表 バリエーション・スウォッチ 機能WooCommerceこのショップは、商品のバリエーションを表示する新しい方法をもたらします。カラーブロック、ボタン、画像などの豊富なビジュアルオプションにより、ユーザーは好みの商品の組み合わせを素早く選択でき、ショッピング体験が大幅に向上します。

画像 [1] - blocksy 2のバリアントスウォッチ機能を使ってWooCommerceのショップディスプレイを最適化する方法

バリエーション・スウォッチとは?

バリエーション・スウォッチとは、従来のドロップダウンメニューの代わりに、商品のバリエーション(色、サイズ、素材など)を小さなビジュアルアイコンやカラーブロックとしてページ上に表示する方法です。このアプローチにより、買い物客はより直感的かつ迅速に商品を選択することができます。

サポートされているスウォッチ・タイプは以下の通り:

  • ボタン
  • シングルまたはデュアルカラー(カラーまたはデュアルカラー)
  • 写真(イメージ)
  • ミックスカラー・パレット(カラー+イメージ)

blocksy バリアントカラーパレットシステムの2 WooCommerce Attributesのネイティブ機能は完全に互換性があり、設定も簡単で、追加のプラグインサポートは必要ありません。

注意: Variation Swatches モジュールは、次のモジュールに含まれます。 ブロックジー・プロショップ・エクストラ エクステンション、プロフェッショナル、エージェンシーの契約が必要。

バリアントカラーパレット機能を有効にするには?

有効化プロセスは非常にシンプルだ:

  • 入り込む ワードプレス バックエンドで、左メニューのblocksy→をクリックします。 エクステンション.
画像 [2] - blocksy 2のバリアントスウォッチ機能を使ってWooCommerceのショップディスプレイを最適化する方法
  • 見つける ショップ・エクストラ 拡張モジュールで バリエーション・スウォッチ.
画像 [3] - blocksy 2のバリアントスウォッチ機能を使ってWooCommerceのショップディスプレイを最適化する方法

製品属性を設定する(Attributes)

モジュールを有効にした後、商品属性のスウォッチタイプを設定する必要があります:

  • バックステージ・セレクション お飾り因果性.
  • 新規または既存のプロパティを編集します。
画像 [4] - blocksy 2のバリアントスウォッチ機能を使ってWooCommerceのショップディスプレイを最適化する方法
  • 対応するスウォッチタイプ(例:ピクチャー、カラー、ボタン)を選択します。
画像 [5] - blocksy 2のバリアントスウォッチ機能を使ってWooCommerceのショップディスプレイを最適化する方法
  • 設定を保存した後、Propertiesの項目(Terms)にある:
    • 画像スウォッチ:バリアントを表す画像をアップロードします。
    • カラーブロック見本:1色か2色の組み合わせを選ぶ。
    • ツールチップを設定して、アクセシビリティ補助の指示を追加できます。
画像 [6] - blocksy 2のバリアントスウォッチ機能を使ってWooCommerceのショップディスプレイを最適化する方法
画像 [7] - blocksy 2のバリアントスウォッチ機能を使ってWooCommerceのショップディスプレイを最適化する方法
画像 [8] - blocksy 2のバリアントスウォッチ機能を使ってWooCommerceのショップディスプレイを最適化する方法

このようにして、従来のテキスト・オプションを、鮮やかなビジュアル・セレクターに簡単にアップグレードすることができる。

個別製品の個別構成

特定の製品に特別な表示が必要な場合。blocksy 2 以下でも使用可能個別可変製品編集インターフェースのスウォッチページでスウォッチのスタイルを個別に調整することができます。商品編集ページで新しいスウォッチ設定オプションを見つけるだけで、各バリアントの表示方法をカスタマイズできます。

カスタマイザーでのスタイル最適化

フロントエンドを美しく見せるために、ブロックシー2には豊富なカスタマイズオプションが用意されている:

  • 入り込む 外装状態カスタマイズ.
  • 場所WooCommerce 一般バリエーション・スウォッチ.
画像 [9] - blocksy 2のバリアントスウォッチ機能を使ってWooCommerceのショップディスプレイを最適化する方法
  • カスタマイズ可能:
    • カラープレートの形状(円形または正方形)
    • スウォッチサイズ
    • カラープレートの間隔
    • 商品一覧ページにカラーパレットと数量制限を表示するかどうか

個々の商品ページは、デフォルトでバリアントカラーパレットを表示します。

フロントエンド・エフェクト・ショー

有効化すると、ユーザーは商品一覧ページや個々の商品詳細ページで、明確で直感的なカラーパレットセレクターを見ることができます。カラーパレットは視覚的な美しさを高めるだけでなく、購買意欲を高める効果もあります。

画像[10] - ブロックシー2のバリアントスウォッチ機能を使ってWooCommerceショップの表示を最適化する方法

特に、ミックスカラーパレット(カラー+イメージ)をサポートすることで、商品表示がよりリッチで詳細になり、ユーザーのショッピング体験が大幅に向上する。

画像 [11] - blocksy 2のバリアントスウォッチ機能を使ってWooCommerceのショップディスプレイを最適化する方法

概要

レバレッジ blocksy バリアントカラーパレット機能の2。WooCommerce ショップは、よりプロフェッショナルで視覚に訴える商品表示方法を簡単に実現できます。色、画像、カスタムボタンなど、blocksy 2はユーザーエクスペリエンスとコンバージョン率を向上させるための強力なサポートを提供します。

最新記事


お問い合わせ
チュートリアルが読めない?無料でお答えします!個人サイト、中小企業サイトのための無料ヘルプ!
カスタマーサービス WeChat
カスタマーサービス WeChat
電話:020-2206-9892
QQ咨询:1025174874
Eメール:info@361sale.com
勤務時間: 月~金、9:30~18:30、祝日休み
© 複製に関する声明
この記事を書いた人:泥棒はネズミの勇気になる
終わり
好きなら応援してください。
クドス1034 分かち合う
おすすめ
解説 ソファ購入

コメントを投稿するにはログインしてください

    コメントなし