xili-tidy-tags タブをグループ化して表示するプラグイン 設定方法と使い方読み終わるまで 1 分

ワードプレス(WordPress)のタブをグループ化して表示するプラグイン xili-tidy-tagsの設定方法と使い方を解説します。

xili-tidy-tagsで実現できること

xili-tidy-tagsプラグインはタグ(tag)をグループ分けして表示することができます。
カテゴリのように、グループ化できるので、タグを分類別けして表示することができるので、利用者の操作性を向上させることができます。

ウィジェット機能を使ってタグを表示させたり、カスタムHTMLを使ってショートコードでタグを表示させることもできます。

ショートコードを使うことで、カスタマイズもできますが、全体的にやや敷居が高く、思い通りの見た目にならず、使い辛い面があります。

xili-tidy-tagsのインストール方法

xili-tidy-tagsプラグインをWordPressにインストールする方法を解説します。

WoredPressのダッシュボード(管理者画面)の新規プラグイン追加画面

1. WordPressのダッシュボード(管理者画面)の「プラグイン」をクリックします
2. 「新規プラグインを追加」をクリックします
3. 検索ボックスに”xili-tidy-tags”と入力すると下に検索結果が表示されます
4. ”xili-tidy-tags”の今すぐインストールボタンをクリックします

“xili-tidy-tags”のインストール完了画面

↑xili-tidy-tagsのインストールが完了すると有効化ボタンが表示されるのでクリックします。

“xili-tidy-tags”を有効化すると表示されるプラグイン画面

これでxili-tidy-tagsのインストールと有効化は完了です。

xili-tidy-tagsの設定と使い方

xili-tidy-tagsプラグインを有効化するとダッシュボード(管理画面)の設定の中に「Tidy タグ」が表示されます↓

xili-tidy-tagsプラグインのダッシュボード(管理画面)

xili-tidy-tagsの設定は先ずグループを作成し、その後にタグをグループに紐づけます。

1. Tidy タグ settings
2. Tidy タグ assign

以降で各設定方法を解説します。

① Tidy タグ settings

xili-tidy-tagsの【Tidy タグ settings】画面

この画面ではタグをグループ化するために使う、グループを作成します。

1. Nameには任意のグループ名を入力※画像では”グループ2″にしている
2. tags group slugには英語でグループ名を入力
3. Addボタンを押すと、Group of タグの一覧表に追加される

② Tidy タグ assign

xili-tidy-tagsの【Tidy タグ assign】画面

この画面では①のTidy タグ settingsで作成したグループにタグを紐づけます。

1. 既存のタグに、どのグループを紐づけるか選択
2. Updateボタンを押す

後は、ウィジット機能やショートコードを使ってタグを表示する設定をします。

ウィジェット機能を使ってタグを表示

ウィジェット機能を使ってサイドバーにタグを表示する手順と方法を解説します。

1. WordPressのダッシュボード(管理者画面)の「外観」→ 「ウィジェット」に入る
2. 任意の場所で「ブロックを追加」を押す
3. 「すべて表示」を押して[©xili] Tidy tags cloudを選択
4. 必要項目を入力　→ 更新ボタンを押す

ウィジェットにある[©xili] Tidy tags cloud

↑[©xili] Tidy tags cloudを選択します。

xili-tidy-tagsの入力項目画面

↑Smallest size(最小サイズ)とLargest size(最大サイズ)は文字のサイズのことで、上記画像のように同じ値にしないと表示がちぐはぐになります。

Display as は横並びと縦並びの違いで、Cloudは横、Listは縦並びになります。

更新ボタンを押して保存します。

表示を確認

xili-tidy-tagsでサイドバーに表示されたタグ

↑xili-tidy-tagsを使ってサイドバーに表示させたタグです。
WordPress標準機能のタグクラウドよりも見やすいです。

ショートコードをカスタムHTMLを使ってタグを表示

ウィジェット機能のカスタムHTMLを使ってショートコードを埋め込んでサイドバーにタグを表示する手順と方法を解説します。

1. WordPressのダッシュボード(管理者画面)の「外観」→ 「ウィジェット」に入る
2. 任意の場所で「ブロックを追加」を押す
3. 「カスタムHTML」を押す
4. [xili-tidy-tags params=”tagsgroup=【グループ名】&largest=10&smallest=10″ glue=” | “]を入力
5. 更新ボタンを押す

ウィジェットにあるカスタムHTML

↑カスタムHTMLを選択します。

HTML を入力…の欄に下記のショートコードを入力します。

[xili-tidy-tags params="tagsgroup=【グループ名】&largest=10&smallest=10" glue=" | "]

【グループ名】の箇所は適宜置き換えて入力してください。

各パラメータ意味は下記のとおりです。

• tagsgroup：タググループのtags group slug
• largestt：最大フォントサイズ
• smallest：最小フォントサイズ
• glue：タグ間の区切り文字

更新ボタンを押して保存します。

表示を確認

xili-tidy-tagsのショートコードでサイドバーに表示させたタグ

↑xili-tidy-tagsのショートコードを使ってサイドバーに表示させたタグです。

このようにやや地味なので、必要に応じてカスタマイズで装飾したほうがよさそうです。

以上がxili-tidy-tagsの使い方と設定です。

グループ毎にタグを表示する方法

xili-tidy-tagsを使ってグループ毎にタグを表示する方法を解説します。

前提として、【[©xili] Tidy tags cloud】ウィジェット1個のみで複数のグループを一度に表示させることはできません。

なので、表示したいグループの数だけウィジェット機能の【[©xili] Tidy tags cloud】を使って1グループづつウィジェットを作成し、サイドバーに並べます。

グループ名を例えば”セキュリティ関連タグ一覧”と”HTML関連タグ一覧”のように2個ウィジェットを作成します。そうして作成すると下記の画像のようにグループ毎に表示させることができます↓

[©xili] Tidy tags cloud ウィジェットをグループ毎に2個並べたサイドバーのタグ一覧

実際にxili-tidy-tagsを使った感想とメリットデメリット

実際にxili-tidy-tagsを使ってみた感じたメリットとデメリットです。

xili-tidy-tagsのメリット

WordPress標準機能のタグクラウドは見出しが作れませんが、xili-tidy-tagsを使うと”タグ一覧”などのように見出しを簡単に表示できる点がメリットです。

タグをグループに紐づけることができるので、後からタグ一覧のように、グループ毎に一覧表示させることができるので、ユーザーの閲覧性の向上に役立ちます。

xili-tidy-tagsのデメリット

使い方と機能の説明が明瞭ではないので判り辛く、かつ思惑通りに表示されないことが度々起きることがデメリットです。

まとめ

xili-tidy-tagsはタグに簡単に見出しを付けて、グループ毎に表示させることができるプラグインです。

1つのウィジェットで複数個のグループを表示できないため、すべてのグループを表示させたい場合は、グループの数だけウィジェットを作成する必要があります。

設定項目の用途が判り辛いなど、ややとっつきにくい面がありますが、割り切って使えば逆にシンプルで使いやすいです。

タグはすべて文字リンクの表示になるので、
もし、タグをボタンのデザインで表示させたい場合は他のタグ用プラグインを利用することをおすすめします。