Astra ProでWooCommerceの単一商品ページをスタイリングする

WooCommerce を組み合わせた強力なeコマース・プラットフォームです。 アストラ・プロ このプラグインは、ウェブサイトの機能性と視覚的な魅力を高めるために、マーチャントが単一商品ページをパーソナライズすることを可能にします。この記事では、WooCommerceの単一商品ページのデザインを最適化するためにAstra Proを使用する方法を説明します。

画像 [1] - Astra ProプラグインでWooCommerceの単一商品ページを最適化する方法

Astra Pro プラグインのインストールと有効化

まず、以下のプラグインがインストールされ、有効になっていることを確認してください:

  • アストラのテーマ
  • アストラ・プロ・プラグイン
  • WooCommerceプラグイン

コミッション WooCommerce モジュール終了後 ダッシュボード > エクステリア > アストラオプションそして 外観 > カスタマイズ > WooCommerce > 単一商品 ページのカスタマイズを開始する。

商品タイトルエリア設定

アストラ・プロ 商品ページのタイトルエリアをカスタマイズする豊富なオプションを提供します。商品ページの 外観 > カスタマイズ WooCommerce > 単品 で、以下を調整する:

画像[2] - Astra ProプラグインでWooCommerceの単一商品ページを最適化する方法
  • ヘッドラインディスプレイ商品タイトルを表示するかどうかを選択します。
  • バナーレイアウト商品バナーのスタイルをカスタマイズできます。
  • パンくずナビゲーション: パンくずナビゲーションを有効にして、ユーザーが簡単にページをナビゲートできるようにします。
  • 抄録短い商品説明を表示します。
  • メタデータ商品のカテゴリーやラベルなどの情報を表示します。
画像[3] - Astra ProプラグインでWooCommerceの単一商品ページを最適化する方法

コンテナレイアウトオプション

アストラ・プロ 商品ページのレイアウトを調整するのに役立つ3つのコンテナレイアウトメソッドを提供します:

  • デフォルトレイアウト
  • 通常のレイアウト
  • 全幅レイアウト
画像[4] - Astra ProプラグインでWooCommerceの単一商品ページを最適化する方法

ニーズに合ったレイアウトを選択し、視覚的にきれいで美しいページにしましょう。

サイドバーレイアウト

アストラ・プロ このプラグインは商品ページに複数のサイドバーレイアウトオプションを提供します:

  • デフォルトレイアウト
  • サイドバーなし
  • 左サイドバー
  • 右サイドバー
画像[5] - Astra ProプラグインでWooCommerceの単一商品ページを最適化する方法

適切なサイドバーレイアウトを選択するか、不要な場合はサイドバーを選択する。 サイドバーなし.

画像ズーム効果によるギャラリー表示

商品イメージの表現という点ではアストラ・プロ いくつかのギャラリーレイアウトが利用可能です:

  • バーチカルレイアウト
  • 水平レイアウト
  • 最初の大きな地図
  • 垂直スライド
  • 水平スライダー
画像[6] - Astra ProプラグインでWooCommerceの単一商品ページを最適化する方法

さらに 画像ズーム効果この製品は、ユーザーがマウスをホバーさせながら製品画像を拡大し、詳細を見ることができるように設計されています。

画像 [7] - Astra ProプラグインでWooCommerceの単一商品ページを最適化する方法

商品画像と概要を修正

アストラ・プロ ページの視認性を高めるために、以下の機能を有効にすることができます:

  • 商品画像の修正ページをスクロールしても、商品画像はページ上部に固定され、常に表示されます。
  • 固定商品の概要: ページをスクロールしても、商品概要は常にページの一番上に表示され、見やすくなっています。
画像 [8] - Astra ProプラグインでWooCommerceの単一商品ページを最適化する方法

製品ナビゲーションとバリアント・プレゼンテーション

Astra Proは、商品ページに以下の機能を提供します:

  • 製品ナビゲーションページのインタラクティブ性を高めるために、ユーザーは簡単に異なる製品を切り替えることができます。
画像 [9] - Astra ProプラグインでWooCommerceの単一商品ページを最適化する方法
  • 製品バリエーション複数のバリアントがある商品では、バリアントを並べて表示するか、重ねて表示するかを選択できます。
画像[10] - Astra ProプラグインでWooCommerceの単一商品ページを最適化する方法

商品説明と関連商品

とおす アストラ・プロマーチャントは、商品説明や関連商品の表示を柔軟にカスタマイズすることができます:

  • 商品説明ラベル縦書き、横書き、アコーディオンレイアウトなど、ラベルの表示方法が選べます。
画像[11] - Astra ProプラグインでWooCommerceの単一商品ページを最適化する方法
  • 関連商品商品ページの下部に関連商品やアップセールを表示し、ユーザーの購買意欲を高めます。
画像 [12] - Astra ProプラグインでWooCommerceの単一商品ページを最適化する方法

カートに入れるボタンを修正

コミッション カートに入れるボタンを修正 その後、「カートに入れる」ボタンは、ページ閲覧中にユーザーがどこをスクロールしても常に表示されたままになり、いつでも簡単に商品をカートに入れることができます。

画像 [13] - Astra ProプラグインでWooCommerceの単一商品ページを最適化する方法

概要

アストラ・プロ プラグインは WooCommerce 単一商品ページには強力なカスタマイズ機能があります。ヘッダーエリア、コンテナレイアウト、サイドバーの設定から、ギャラリー表示、固定画像、サマリー機能まで、各オプションはマーチャントがより魅力的で機能的な商品ページを作成するのに役立ちます。これらのカスタマイズは、商品のプレゼンテーションを強化し、ページのインタラクティブ性を高め、より多くの顧客を引き付け、より多くのコンバージョンを促進するのに役立ちます。

関連記事


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

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

    コメントなし