ProductX リスト ブロックの紹介 [商品説明に力を加えましょう!]

公開: 2023-08-21

ProductX は、多くの人の心を掴んだWooCommerce ブロック プラグインです。 ただし、製品の説明を強化し、WooCommerce サイトを紹介するには作業が必要でした。

そのために、私たちは確実に効果をもたらすソリューションを考え出しました。

ProductX リスト ブロックをご紹介します。製品や WooCommerce ストアを紹介するクリエイティブな方法です。

これには、 ProductX Gutenberg ブロック プラグインに期待されるのと同じレベルの機能性と流動性が備わっています。

それでは、このような便利なソリューションを作成するというアイデアのきっかけとなったものを見てみましょう。

ProductX リスト ブロックが役立つのはなぜですか?

リスト ブロックはさまざまな創造的な方法で使用できますが、ここでは便利な方法をいくつか紹介します。

多様な商品説明を作成する

単一の商品ページを作成している場合は、WooCommerce ビルダー とても役に立ちます。

さまざまな重要なWooCommerce Gutenberg ブロックを追加して、製品ページにスパイスを加えることができます。

ただし、以前は、製品の説明を表示するには退屈な Gutenberg ブロックに依存する必要がありました。

あまり効率的ではありません!

リスト用の ProductX Gutenberg ブロックを使用すると、機能がさらに深くなります。 細かいレベルのコントロールを使用して、希望どおりにリストを表示できます。

製品説明をスキャン可能にする

何かを理解する必要があります。

顧客は同じレベルの熱意を持っていないでしょう - 彼らはあなたの製品についてあなたと同じように感じていません。

製品を強調する理想的な方法は次のとおりです。

  • 説明をリストでスキャンできるようにする
  • 明確に伝えるために空白とフォントサイズを変更する

これらすべてのことは、ProductX リスト ブロックを使用して行うことができます。

リストや箇条書きを使用すると、読みやすい製品説明を作成するのが簡単になります。 キャッチ商品の説明文を簡単に作成できます。

さらに、詳細設定を使用すると、高さを調整したり、インライン化したり、好きなようにカスタマイズしたりすることができます (できることについては後ほど詳しく説明します)。

好きなように使ってください

商品説明にのみ使用すればよいというわけではありません。

WooCommerce ストアのどこでも、動的リスト ブロックを使用できます。 スキャン可能な方法でストアについての簡単な説明として使用できます。

または、他の目的にも使用できます。

次に、リスト ブロックの機能を見てみましょう。

機能を調べる前に、まず ProductX リスト ブロックの使用方法を知る必要があるでしょう。

ProductX リスト ブロックの使用方法

この ProductX ブロックの使用方法は、他のブロックと同様です。 もちろん、これを行うには、WordPress サイトに ProductX プラグインをインストールする必要があります。

あなたがしなければならないことは次のとおりです。

How to add the ProductX list block to a product page
ProductX リスト ブロックをページに追加する方法
  • ページに移動し、右上「+」アイコンをクリックします
  • 「list」を検索すると、 ProductX リスト ブロックが表示されます。
  • ページにドラッグするだけでポップアップ表示されます

これは方法の 1 つにすぎません。

ここで行ったのと同じようにパターンを変更できます。 次のセクションで機能に進みながら、詳しく説明します。

ProductX リスト ブロックの機能を調べる

リスト ブロックの機能の深さには 1 つの焦点があります。これは、製品をよりよく強調するのに役立ちます。 このため、ここで説明する内容に注意を払うことが重要です。

リストブロックパターン

ProductX WooCommerce Gutenberg プラグインのボタン ブロックと同様に、バックエンド プロセスを迅速に追跡するために使用できる事前に作成されたパターンがいくつかあります。

これらのパターンの 1 つをインポートして、好みに合わせてカスタマイズすることができます。

Explore list block patterns
リストのブロックパターンを調べる

いくつかの既製のパターンから選択できます。これらのパターンを事前に確認することができます。 以下のリンクにアクセスして、実際の見た目をチェックしてください。

パターンのプレビュー

次に、リスト ブロックの主な機能を見てみましょう。

グローバルな配置、レイアウト、および位置決め

既製のパターンの 1 つを使用したカスタム例を考え出しました。 カスタム調整を行うこともできます。

Global Alignment, layout, and positioning for ProductX list block
ProductX リスト ブロックのグローバルな配置、レイアウト、位置決め

グローバルにレイアウトを変更できます。あらかじめ用意されたオプションがいくつか用意されています。 インライン ビューと垂直方向の配置機能を使用すると、リスト全体の位置をカスタマイズできます。 さらに、リスト項目の間隔や、ページ上でリストを表示する場所を変更することもできます。

画像またはアイコン (全体的な変更)

箇条書きをアイコンや画像に設定したり、その他の事前に作成された設定から選択したりできます。 カスタム画像も自由にアップロードできます。

Image and icon settings for the list block
リストブロックの画像とアイコンの設定

ここに表示されている画像では、画像は個別に設定されています。 ただし、グローバル画像またはアイコンを設定し、それを 1 つの特定のリスト内のすべての項目に使用することができます。

コンテンツ設定

製品の特徴を強調するために話したポイントを覚えていますか? 箇条書きの内容を書いて編集を始めるだけです。

柔軟な機能を使用して、必要に応じてこれらのコンテンツ設定を強調表示できます。

Adjusting content settings for ProductX list block
ProductX リスト ブロックのコンテンツ設定の調整

テキストまたはサブテキストを無効にするか有効にするかを選択できます (独自の方法で創造力を発揮してください)。 また、テキストとサブテキストの組み込み設定を使用して、機能の説明をより魅力的にすることもできます。

ミッドポイント サブテキスト」は、事前に作成されたレイアウトでのみ機能します。 それについてはドキュメントを確認してください (また、他の機能で問題が発生した場合は)。 リスト ブロックを最大限に活用して WooCommerce 製品を紹介するのに役立ちます。

ドキュメントを調べる

コンテンツの折り返しと区切りの設定

コンテンツラップ」は、リストに異なる外観を与えるのに役立ちます。 凝ったものにしたい場合は、コンテンツ内の各項目のラップ方法を変更できます。 ここの例を見てください。

製品の主要な機能に生命を吹き込むために、パディング、背景色、境界線の半径を追加しました。 繰り返しになりますが、その仕組みが不明な場合は、詳細なドキュメントを必ず確認してください。

Content wrap and separator settings
コンテンツの折り返しと区切り文字の設定

セパレーター」はあなたの創造性を引き出すトリッキーな機能です。 特定の状況でオンとオフを切り替えることも、ProductX WooCommerce ビルダーを使用してグローバルに使用することもできます。

アイコンの種類とアイコンのスタイル(個別設定)

ProductX リスト ブロックの主要なカスタマイズ要素の 1 つである、個々のアイコンのタイプとスタイルを変更できます。 例を見ると、リスト項目ごとに個別のカスタム アイコンが追加されています。 あなたもそうすることができます!

Individual icon style and icon type settings
個別のアイコン スタイルとアイコン タイプの設定

必要に応じて箇条書きに個別の画像を設定するなど、さまざまな設定を試すことができます。 テキストとサブテキストのプロパティを変更したり、ホバー状態を変更したりすることもできます。 間隔も調整できます。

ただし、物事をシンプルかつクリーンに保つことはおそらく良い考えです。 目標は、製品説明をできるだけ明確に保つことです。 ユーザーは、それが自分の興味と一致し、問題を解決してくれることを認識する必要があります。

注:リスト ブロックの機能を説明するデモは、ProductX WooCommerce ビルダーを使用して単一の製品ページを構築して行われたことに注意してください。 ProductX リスト ブロックを使用してどこでも機能を紹介できますが、個々の製品ページを作成するときにページの「条件」を確認して指定する必要がある場合があります。 詳細については、ドキュメントを確認してください。

最後の言葉

これは、 ProductX リスト ブロックの単なるスナップショットです。

ご存知のとおり、リスト ブロックに組み込まれた機能は、レゴのような創造性を提供します。 あなたは構築者です – あなたが望む方法で製品機能を構築し、紹介します。 空には限界がある!

頑張って、創作を楽しんでください! 製品をどのように紹介するかを共有してください。

YouTube チャンネルで WordPress ビデオチュートリアルをご覧ください。 また、定期的に最新情報を入手するには、Facebook と Twitter をご覧ください。

この記事が気に入りましたか? 言葉を広める
  • How to Make Sticky Posts in WordPress Easily

    WordPress で固定投稿を作成する方法: 簡単ガイド

  • How to Set WooCommerce Category Discount with WholesaleX

    WholesaleX で WooCommerce カテゴリ割引を設定する方法

  • advanced slider block of postx

    PostX の最新のスライダー ブロックは、素晴らしい新しいレイアウトの機会をもたらします

  • How to Create and Customize WooCommerce Checkout Page Template with ProductX

    ProductX を使用して WooCommerce チェックアウト ページ テンプレートを作成およびカスタマイズする方法