アーカイブの表示を変更しました。
標準仕様のアーカイブ表示①
WordPressには、アーカイブを表示する機能が備わっています。
特別な操作なして、「アーカイブ表示」を設定するだけでは、以下のように月別で表示されます。
長く続けば続けるほど、表示される分も縦に長くなっていきます。
すっきりさせたくて、他の方法を探ってみました。
標準仕様のアーカイブ表示②
WordPressでは、上記の表示方法以外に、ドロップダウンリストでの表示方法があります。
下記のように、アーカイブのボックスにカーソルを合わせると、ドロップダウンできる仕様です。
カーソルを合わせると、次のように展開され、希望の年月を選択できます。
やっぱり長くなってしまいますね。
設定方法は以下の通りです。
管理画面の「外観」▶「ウィジェット」で、サイドバーに設定された「アーカイブ」を確認してみます。
「アーガイブ」がサイドバーになければ、「利用できるウィジェット」の中から探して追加しましょう。
「アーカイブ」を開くと、「ドロップダウンで表示」という場所があるので、チェックを入れ「保存」。
このように、ドロップダウンリストにすれば、表示はすっきりします。
ただ、クリックしなければいけないこと、いつのアーカイブがあるのかが、ひと目ではわからない点がデメリットです。
アーカイブデザインをカスタマイズ
そこで、冒頭のように表示を変更しました。
色々試しましたがうまくいかず、最終的に、下記のサイトを参考にさせていただきました。
【Cocoon】アーカイブウィジェットを年別にまとめてコンパクト表示【カスタマイズ】
こちらは、プラグインではなく、「テーマ編集」による方法です。「外観」▶「テーマファイルエディター」で行います。
WordPress初心者なので、テーマを編集するのは不安もあります。サイトが崩れるリスクがあるので注意が必要です。私は下記について注意しながらやってみました。
・編集前のバックアップをとる
・編集はテキストエディタで行う
・子テーマを編集する
そのままコピペすると、うまくいかない部分もありました。
各年横のアイコン（当サイトでは「▽」の部分）表示がうまくいきません。
そのため、Stylesheetに貼るコードの一部変更しています。
.widget_archive a.year::after{ /*各年横のアイコン*/
の部分です。この下に続くコードに、「アイコンの指定」がありますので、’ ‘内を「▽」に変更しました。
参考先のコードをコピペすると、「Font Awesome」のバージョンの違いのせいか、うまく表示されなかったからです。
content: ‘▽’; /* アイコンの指定 */
これで、うまく表示されましたよ。
ちなみに、標準のアーカイブ表示を「ドロップダウン」仕様にしていた場合には、このコードは作動しませんので、チェックを外しておきましょう。
アーカイブ表示も、色々ありますね。
自分でウェブサイトの運営をしていると、好みの表示にするのも簡単ではないということがわかります。
また一歩WordPressのことを知ることができました。この記事がどなたかのお役に立てたら嬉しいです。
【日記】
こども本の森中之島へ。今も予約制ですが、各回先着50名入館できます。涼しいので気持ちよく行くことができました。長女は妖怪の本、次女はおばけの本に夢中。空間も心地よく。パソコンはNGです。1時間半みっちり過ごしましたがまだ足りずに本やさんへ行きたいとのことでした。
子どもが安心して過ごせる空間です。9月誕生日のフォトスポットもありましたよ。
【something new】
モス メンチカツフォッカッチャ
コメント