はじめに
「タグクラウド」ウィジェットには、ドロップダウン表示機能がありません。
そこで、「タグクラウド」ウィジェットに「ドロップダウンで表示」メニューを追加し、メニューの順序を投稿数の多い順に並べます。
この記事では、この方法について説明します。
完成イメージ
実装手順
以下のコードをfunctions.phpに追加します。
// ウィジェットに設定メニューを追加
add_action('in_widget_form', function ($widget, $return, $instance) {
// tag_cloudウィジェット以外は早期リターン
if ($widget->id_base !== 'tag_cloud') {
return;
}
$f_id = $widget->get_field_id('drop');
$f_name = $widget->get_field_name('drop');
$checked = checked(!empty($instance['drop']), true, false);
echo "<p><input type=checkbox class=widefat id={$f_id} name={$f_name} value=1 {$checked}><label for={$f_id}>ドロップダウンで表示</label></p>";
}, 10, 3);
// ウィジェットの入力データを更新
add_filter('widget_update_callback', function ($instance, $new_instance, $old_instance, $widget) {
$instance['drop'] = !empty($new_instance['drop']) ? 1 : 0;
return $instance;
}, 10, 4);
// タグクラウドのクエリを変更
add_filter('widget_tag_cloud_args', function ($args, $instance) {
$args['drop'] = !empty($instance['drop']) ? $instance['drop'] : 0;
return $args;
}, 2, 10);
// タグクラウドの出力を変更
add_filter('wp_tag_cloud', function ($return, $args) {
if (empty($args['drop'])) {
return $return;
}
$id = get_query_var('tag_id');
$tags = get_tags(['orderby' => 'count', 'order' => 'DESC']);
ob_start();
echo '<select onchange="document.location.href=this.options[this.selectedIndex].value;">';
echo '<option value=""' . selected('', $id, false) . ' selected="selected">タグを選択</option>';
if ($tags) {
foreach ($tags as $tag) {
$count = !empty($args['show_count']) ? " ({$tag->count})" : '';
echo '<option value="' . esc_url(get_tag_link($tag->term_id)) . '" ' . selected($tag->term_id, $id, false) . '>' . esc_html($tag->name . $count) . '</option>';
}
}
echo '</select>';
return ob_get_clean();
}, 2, 10);参考：「ターム一覧」ブロックについて
「ターム一覧（カテゴリー一覧）」ブロックを使えば、タグクラウドをドロップダウン形式で表示できます。
このコードを「ブロック」ウィジェットに登録するだけで、ノーコードで実現可能です。
さいごに
今回紹介した方法を使えば、「タグクラウド」ウィジェットに簡単にドロップダウン表示を追加でき、タグを投稿数の多い順に並べることができます。
これにより、訪問者が簡単にタグを選んで、関連する投稿を見つけやすくなります。
