Elementorを使用した製品カルーセル

公開: 2021-11-16

WooCommerce Webサイト内でElementorを使用して製品カルーセルを使用する方法をお探しですか？オンラインのWooCommerceストアの場合、製品カルーセルは、コンパクトなスペース内に多数の製品を表示するのに役立ちます。

ウェブストアではカスタマーエンゲージメントが最も重要であるため、装飾品のカルーセルは人々の注意をすばやく引くための最良の方法です。

したがって、ショップの外観を向上させることを計画している場合は、WCカルーセルアドオンを使用するのが最適です。このツールは、製品をまとめて展示するのに役立つだけでなく、見栄えの良いレイアウトも備えています。

気になる？私はあなたをこれにもっと深く連れて行きましょう、そして確かに、あなたはそれを後悔しないでしょう。

Elementorを使用して製品カルーセルで視聴者を引き付ける

WooCommerce Product Carouselは、主にElementorのスライダータイプのウィジェットです。これは、製品の親指のビューで顧客を引き付け、顧客が何百ものアイテムをシームレスに簡単に閲覧できるようにするための完璧なツールです。

製品カルーセルには「カートに追加」機能が付属しており、商品をより迅速に購入する方法を提供することで、売り上げを伸ばすことができます。これにより、顧客は製品のカートボタンをタップするだけで、欲しいものを購入できます。

上の画像の例を見てください。商品画像のすぐ下にカートボタンが表示されています。カートに何かを追加する必要があるたびに個々の商品の詳細ページに移動するのではなく、より速く買い物をするのに役立ちます。

Elementorを使用したWooCommerce製品のカルーセルの最も優れている点は、人々の注目を集めるカルーセルを使用して魅力的なデザインを作成できることです。カルーセルアニメーションを鮮やかに設定して、複数の一意のインターフェイスを一度に作成できます。

その結果、誰かがあなたのWebサイトにアクセスして、アニメーション化されたカルーセルを見るたびに、人々は見事な製品カルーセルに魅了されます。それがすべてではありません！また、製品カルーセルを使用して、注目の製品をWebサイトの最初のものとして表示することもできます。

Element Pack ProのWooCommerceカルーセルウィジェットは、WoCommerceに新しいエッジをもたらします

WooCommerce製品のカルーセルを設計する際にコーディングを必要としないツールを入手した場合でも、手動コードを使用しますか？もちろん、あなたはそうしません。 Element pack Pro（By Bdthemes）のWCカルーセルウィジェットを自由に使用できる場合は除きます。

Element Pack Proのウィジェットを使用している70,000人を超える顧客がいることから、WCカルーセルはとりわけスターであることが証明されています。これは、ウィジェットを使用すると、コードの準備や知識を一切必要とせずに、Elementorを使用して動的な製品カルーセルを作成できるためです。

Elementorは、単純なドラッグアンドドロップ技術を使用して、Webサイトに新しい機能を追加するウィジェットをインポートします。 WCカルーセルはElementorで使用するためのツールです。これを使用すると、ショップ向けの見事な製品カルーセルをデザインしたり、レイアウトを変更したり、色やフォントを変更したり、カスタマイズしたいすべてのものを変更したりできます。

言うまでもなく、Elementorを使用したWC製品のカルーセルの実際の使用方法を見てみましょう。

Elementorを使用して強力なWooCommerce製品カルーセルを作成する

ここで紹介する手順は、立ち上がって最も効率的な方法で仕事をするのに役立ちます。ただし、これにはElementorの基本的な知識が必要です。 Elementorを初心者として操作する方法を知らない限り、物事はあなたにとって難しいでしょう。

ヘルプが必要な場合は、この初心者エレメントチュートリアルビデオにアクセスして、基本を学んでください。

とにかく、Elementorを使用して製品カルーセルを作成することほど簡単なことはありません。ただし、最初に、WordPressWebサイトでこれらの要件を確認する必要があります-

ElementorPageBuilderプラグインをインストールしてアクティブ化しました
インストールおよびアクティブ化されたWooCommerceプラグイン
Element Pack Proプラグインをインストールしてアクティブ化します（WCカルーセルウィジェットを使用するために必要です）

完了したら、WC製品カルーセルの作成フェーズに入ります。手順を正しく実行してください。

ステップ-1：ダッシュボードからWCカルーセルウィジェットをオンにします

最初のステップでは、WordPressダッシュボードからウィジェットをアクティブ化する必要があります。 Element Pack Proウィジェットをインストールすると、ダッシュボードに表示されます。

次に、 [ダッシュボード]> [Element Pack Pro]> [サードパーティウィジェット]に移動し、ウィンドウをスクロールしてWooCommerceカルーセルウィジェットを見つけます。ウィジェット名の横にあるスイッチャーをクリックして、[変更を保存]ボタンをクリックする必要があります。

次に、製品カルーセルを表示するWebページを開く必要があります。もちろん、Elementor内のページを開くには、「Elementorで編集」ボタンをタップする必要があります。

次に、左側のウィジェットメニューからWCカルーセルウィジェットを探すことができます。メニューにウィジェットが表示されたら、ウィジェットアイコンをクリックして押したまま、ページ内にドラッグします。

上の写真でわかるように、ウィジェットにElementPackProのロゴが付いていることを確認してください。

ステップ2：Elementorを使用してWooCommerce製品カルーセルをカスタマイズする

Elementorページビルダーからのデフォルト設定では、すべての基本的なレイアウトコントロールが[コンテンツ]タブにあります。 WooCommerceカルーセルウィジェットの場合、ここに多数のレイアウトカスタマイズオプションがあります。

たとえば、製品ラインアップの列番号を設定できます。製品の高さを一致させることは、すっきりとしたインターフェイスを表示するための良い方法です。

クエリセクションを使用して、カルーセルスライダーのソースを選択できます。商品を表示する必要がある場合は、投稿することで詳細を表示できます。

とにかく、特定の製品を選択したり、カルーセルから除外したりできるため、マイクロ機能の操作が簡単になります。

次に、カルーセル設定に移動して、アニメーションを要件に合わせてシフトできます。たとえば、Elementorを使用して、製品カルーセルのカルーセルとカバーフローのレイアウトスタイルを選択できます。

さらに、カルーセルのアニメーション速度やその他の設定を変更して、レイアウトをさらに発展させることができます。

製品カルーセルには、製品の状態を示す各製品のバッジがあることに注意してください。バッジには、利用可能な商品と在庫切れの商品が自動的に表示されます。また、バッジのスタイルをカスタマイズして、サイトのテーマに合わせることができます。

ステップ-3：製品カルーセルの外観をカスタマイズする

Elementorを使用して製品カルーセルを作成することの最も良い点は、多くの色、境界線、パディングなどを使用してインターフェイス全体をカスタマイズし、他の市場からユニークなものを構築できることです。

WooCommerceカルーセルウィジェットの場合、これらのカスタマイズ設定は「スタイル」タブ内にあります。ここでは、カルーセルの背景を変更して、ページ上で目立たせることができます。

オプションは、タイトル、バッジ、カートに追加ボタン、評価、価格など、カルーセルのすべての部分に拡張されます。カルーセルレイアウトにスタイルを追加するためにすべてのセクションに沿って進むと、さらにエキサイティングになります。

スタイルに自信がついたら、「公開」ボタンを押して、顧客にアピールし始めます。

以前思っていたよりずっと簡単だと思います。手順に必ず従ってください。そうすれば、Elementorを使用してすぐに素晴らしいWooCommerce製品カルーセルを構築できます。

結論

この記事を楽しんでいただけたでしょうか。このトピックまたはそれ以外のことについて質問がある場合は、ライブチャットオプションまたはサポートを使用してお気軽にお問い合わせください。

安全を確保し、WooCommerce製品のカルーセルウィジェットのフルブラストをお楽しみください。