WordPressのウィジェットのドロップダウン表示がおかしい

 WordPress を使ってブログを運営するような人は気合を入れて更新をしておられると思うので、カテゴリーやアーカイブが縦に長くなっていることと思います。細かいことを気にしない人ならよいのですが、記事の本文よりサイドバーが長くなるのが気になったので、ウィジェットをドロップダウン表示にしてみようと調べたことをまとめておきたいと思います。

20160821_1

ウィジェットをドロップダウン表示にするのは簡単

 ウィジェットの管理画面に移動し、「ドロップダウン表示」にチェックを入れるだけなので簡単です。

20160821_2

どのように表示されるのか確認してみましょう。

20160821_3

ドロップダウンメニューの隣に妙なものが表示されてしまっています。

管理画面でタイトルを入力してどのように表示されるのかを見てみましょう。

20160821_4

どうやらタイトルが二重表示されてしまっているようですね。

20160821_5

 ネットで検索すると解決策がいくつかでてきますが、1年以上たっても修正されていないようです。変な仕様だな。

回避方法

 ドロップダウンメニューの重複タイトルは label タグでクラスが screen-reader-text に設定されているので、スタイルシートに次のように追記すれば余計な表示を抑えることができます。

あとはドロップダウンメニューをカスタマイズするだけです。プラグインで解決する方法もあるようですが、こちらの方が簡単です。

20160821_6

カテゴリーのデフォルトのテキストは変更できる

 カテゴリーをドロップダウンで表示するとデフォルトのテキストが「カテゴリーを選択」になっていますが、このテキストは変更することができます。例えば、WordPress を使って商品紹介ブログを運営している場合、「商品から選択」のような表示にしたいことがあるかもしれません。

 function.php を開いて次のように追記してください。

デフォルトのテキストが変更されます。

20160821_7

アーカイブのデフォルトのテキストは変更について

 ここでアーカイブのデフォルトのテキストも変更できるのではないかと考えるかもしれませんが、これが結構難しかったりします。ネット検索したり、WordPress のコアファイルを検索したりしたのですが、widget_categories_dropdown_args フィルターフックの引数である show_option_none のようにデフォルトテキストを変更するパラメータが存在しません。

 wp-includes/widgets/class-wp-widget-archives.php ファイルの 71 ~ 97 行目を見ると理由がわかります。

 アーカイブのデフォルトのテキストは $dropdown_args[‘type’] の値を switch 文によって分岐して決定されるため、widget_archives_dropdown_args をフィルターフックしてもカスタマイズできないことがわかります。

 どうしても変更したい場合には function.php に次のように追記します。アーカイブのデフォルトのテキストが「月を選択」だった場合を想定してください。

 WordPress は最初に英文で Web ページを出力した後、wp-content/languages/ja.po を使って日本語に変換しています。gettext フィルターフックは translation 関数で翻訳されたテキストを取得できますが、上のソースコードはその中から「月を選択」の部分を抜き出して文字列を置き換えたものです。

 ただし、この方法は他の部分で「月を選択」という翻訳が存在した場合にそれも置き換えてしまうため、あまりよい方法とは言えないと思います。がんばって調べている途中で気づいたのですが、アーカイブのデフォルトのテキストなんぞは「月を選択」や「年を選択」ぐらいしか必要でないので、カスタマイズする方法がないのかもしれません。

 無理に表示を変更して WordPress をクラッシュさせてしまうぐらいなら、最初から用意されているものを素直に使ったほうが無難かも?カスタマイズ前によく検討してみてください。

「役に立った」と思ったら、記事のシェアをお願いします。

スポンサーリンク

Comment

コメント認証制です。反映されるまで時間が掛かる場合があります。
URLの記入はhttpのhを抜いて下さい(宣伝対策です)。
連続でコメントするとスパム扱いになる場合があります。
しばらく待ってからコメントしてください。

CAPTCHA


Si prega di attivare i Javascript! / Please turn on Javascript!

Javaskripta ko calu karem! / Bitte schalten Sie Javascript!

S'il vous plaît activer Javascript! / Por favor, active Javascript!

Qing dakai JavaScript! / Qing dakai JavaScript!

Пожалуйста включите JavaScript! / Silakan aktifkan Javascript!

TOP