WordPressでアイコンリストを追加する方法

WordPressでアイコンリストを追加する方法

アイコンリストは、リスト形式で表示されるビジュアル要素のコレクションです。ブログ記事やページコンテンツの視覚的な魅力や読みやすさを高めるために、さまざまな文脈で使用されます。

アイコンリストは主に、商品の特徴やポイント、メリットなどをリスト形式で紹介するのに使われます。大きなコンテンツを小さくまとめ、読みやすくすることで、読者は素早く簡単に理解することができます。

このブログでは、WordPressでアイコンリストを追加する2つの簡単な方法をご紹介します。最後までお付き合いください。

美しいテーブルを作る
ブロックエディター付き

方法1:アルティメット・ブロックを使う

アルティメット・ブロック は、25以上のカスタムブロックを備えたGutenbergブロックプラグインです。その中でも「Styled List」は著名なブロックです。ここでは、このブロックの使い方を紹介しよう。

ステップ1:Ultimate Blocksプラグインをインストールする

こちらへ プラグイン > 新規プラグインの追加 をWordPressダッシュボードに入力してください。検索ボックスにUltimate Blocksと入力してプラグインを検索してください。 インストール そして アクティブ化 the plugin after it appears below.

Ultimate Blocksプラグインをインストールして有効化する

ステップ2:スタイル付きリスト・ブロックをエディターに追加する

他のGutenbergブロックと同じように、 click the plus (+) button そして タイプ・スタイル・リスト を検索ボックスに入れる。ブロックが表示されたら 編集者宛.

スタイル付きリスト・ブロックをエディターに追加する

ステップ3: スタイル付きリストブロックにアイテムを追加する

スタイル・リスト・ブロックがエディタに追加されているのがわかります。さて、リストに項目を追加しましょう。商品の特徴をリストアップすることができます。

スタイル付きリスト・ブロックがエディターに追加される

スタイル付きリスト・ブロックにダミーのテキストを追加しました。

スタイルリスト・ブロックに追加された項目

ステップ4:スタイル付きリストブロックのアイコンを選択する

スタイル付きリストブロック全体を選択.設定タブの下にデフォルトのTickアイコンが表示されます。 ダニアイコンをクリック.

スタイル付きリストブロック全体を選択

アイコンのコレクションを含むボックスが開きます。好きなアイコンを選んでください。アイコンはスタイル付きリストブロック全体に適用されます。

スタイル付きリスト・ブロックのアイコンを選択する。

ステップ5:スタイル付きリストブロックをカスタマイズする

設定タブの下に、ブロックをカスタマイズできるオプションがいくつかあります。それらは以下の通りです:

アイコンサイズ アイコンサイズの増減

列の数 複数のカラムでリストクルブロックをショーケースする。

モバイルの列数 モバイルでリストクルブロックを複数カラムで表示する。

項目間隔(ピクセル) - リスティクル項目間のスペースを増減する。

スタイル付きリスト・ブロックをカスタマイズする

ステップ 06: スタイル付きリストブロックをスタイライズする

次ページ スタイルタブに移動する.アイコンの色、リストの文字色、リストの背景色はこのタブから変更できます。

その後、パディングとマージンを追加して、ブロックを好みのレイアウトにすることができる。

スタイル付きリスト・ブロックをスタイライズする

このように、Ultimate Blocksプラグインを使ってアイコンリストを作成することができます。

方法2:Tablebergを使う

WordPressのテーブルにアイコンリストを追加したいと思うことはよくあるでしょう。しかし、デフォルトのテーブルブロックではこれができません。そこで テーブルバーグ プラグインです。このプラグインを使って、あなたのサイトに包括的で多目的のテーブルを作成することができます。

ステップ1: TableBergプラグインのインストール

インストール そして アクティブ化 あなたのサイトにTablebergプラグインを追加してください。

プラグインでテーブルを作成する手順は、デフォルトのテーブルブロックとほとんど同じです。このガイドに従って TableBergでテーブルを作成する方法.

:Tablebergの無料版には、以下の機能が付属しています。 リストブロック.を使用するには Styled List blockを取得する必要があります。 プロ版 Tablebergの。

ステップ2:スタイル付きリスト・ブロックをテーブルに追加する

アイコンリストを追加したいセルを選択する。セルを選択すると、プラス(+)アイコンが表示されます。

プラス(+)アイコンをクリック.探す スタイル付きリストブロックを追加する to the cell.

Add the Styled List Block to the Table

スタイル・リスト・ブロックが即座にテーブルに追加されます。

スタイル・リスト・ブロックがテーブルに追加される

ステップ3:テーブル上のスタイル付きリスト・ブロックにアイテムを追加する

テーブルに好きなだけ項目を追加する。

テーブル上のスタイル付きリスト・ブロックに項目を追加する

ステップ04: スタイルリストブロックにアイコンを設定する

スタイル付きリストブロック全体を選択.に行く。 設定タブ on the right sidebar. ティックアイコンをクリック アイコンの設定]オプションの下にある。

スタイル・リスト・ブロックにアイコンを設定する

ポップアップが開き、アイコンのコレクションが表示されます。お好きなアイコンをお選びください。

アイコンを選択

選択されたアイコンは、スタイル・リスト・ブロック全体に適用されます。

スタイル付きリストブロックに適用されるアイコン

ステップ5:スタイル付きリストブロックをカスタマイズする

アイコン設定オプションでは、アイコンのサイズとアイコンの間隔をカスタマイズできます。

スタイル付きリスト・ブロックをカスタマイズする

ステップ 06: スタイル付きリストブロックをスタイライズする

スタイル」タブへ.アイコンの色、テキストの色、背景色、ブロックのパディングを変更できます。

スタイル付きリスト・ブロックをスタイライズする

このように、WordPressのテーブル上にアイコンリストを追加・作成することができる。

結論

WordPressのアイコンリストは、ユーザーに重要な情報を伝えるだけでなく、コンテンツのナビゲーションと美観を向上させます。ブロックをカスタマイズする際には、ブランドの一貫性、可読性のスコア、コンテンツの階層を念頭に置く必要があります。

これらの組み合わせがあって初めて、あなたのアイコンリストはユーザーにとって生きたものになるのです。今日はここまで。

こちらもお読みください:



テーブルバーグ・チーム