フィーチャーボックスは、特定のコンテンツや製品、サービスに注目させるためにウェブページ上にデザインされた領域です。フィーチャーボックスは、画像、アイコン、簡潔なテキスト、ボタンなどの要素でデザインされます。
Tablebergは多目的テーブルビルダープラグインです。フィーチャーボックスの素晴らしいレイアウトを作成するのに役立ちます。このチュートリアル記事では、このプラグインを使ってWordPressにフィーチャーボックスを追加する方法を簡単に紹介します。
下のバナーのボタンをクリックしてプラグインを入手してください。
美しいテーブルを作る
ブロックエディター付き
プラグインをサイトにインストールしたら、以下のチュートリアルに従ってください。
ステップ01: エディターにTablebergブロックを追加する
を追加する。 テーブルバーグ・ブロック to the editor.
作成したいフィーチャーボックスの数に応じて、ウェブサイトの行と列の数を定義します。
3つのフィーチャー・ボックスを作成するので、列と行の数を2*2に選択した。
定義された行数と列数が追加されました。
ステップ 02: ボックスに商品画像を追加する
フィーチャーボックスは、それぞれの製品の画像がなければ意味がありません。を追加してください。 イメージブロック を適当なセルに移す。
適当なセルに画像を追加する。丸いアイコンをドラッグすることで、画像のサイズを変更できます。
ステップ03：星評価を追加する
星の評価は、商品の品質や人気を直感的に表現する方法です。また、顧客エンゲージメントにも役立ちます。そこで Star Rating block をテーブルに置く。
の下から 設定タブ 右サイドバーで、スター評価ブロックの値を設定します。必要に応じてブロックのサイズを変更することもできます。
ステップ04：CTAボタンを追加する
CTAボタンを使えば、ユーザーの購買意欲や商品ページへの訪問意欲を高めることができます。そこで ボタンブロック の下にある。
に行く。 スタイルタブボタンブロックを選択したままにする。
ここから、ボタンを変更することができます テキストの色、背景色、サイズ、パディング、 アンd 半径は必要に応じて。
ステップ05：機能リストと説明を追加する
機能リストと説明を追加するにはスペースが必要なので、2つのセルを統合したほうがよいでしょう。 セルを選択する でカーソルを合わせる。 シフトキーを押しながら.
テーブルの編集をクリックする ツールバーのを押す。 Merge option on the list.
を追加する。 段落ブロック フィーチャー・ボックスにテキストを書き込む。
製品の特徴をリストで表示する方がよい。そこで Styled List block.
下の画像のように製品の特徴をリストアップできるといいですね。あなたは リストのアイコンを変更し、サイズを大きくする、 そして 色を変更する.
最後に、機能リストの下にある段落ブロックを使用して、製品の簡単な説明を追加します。