/home/by-natures/dev*

データ界隈で働くエンジニアとしての技術的なメモと、たまに普通の日記。

ブログに RSS フィードを追加しました

明けましておめでとうございます。天丼丸です。新年一発目は WordPress についてのお話です。(今年の抱負など、日記的なことは後日…)

ブログテーマを更新してから RSS フィードが無いことに今更ながら気がつきました。ヘッダメニューの左端に RSS フィードを付けたので、この方法も含めていくつか RSS フィードの表示方法について、以下の方法をご紹介します。

  • Widgetを用いてメニューに表示する
  • ヘッダメニューに表示する(PHPファイルの修正)

なお、WordPress では特に設定せずとも RSS 用の URL が存在するのですが、これを明示的にブログに記載するのが今回の作業となります。あまり仰々しくないように、さりげなくRSSフィードを用意するのが今回の目的です。

ウィジェットを使って追加する

Subscribe Me

ブログ全体の RSS フィードをウィジェットとして利用できる、Subscribe Me というプラグインがあります。下記画像で Subscribe Me を利用した場合の RSS フィード例をご紹介しています。(タイトルが「RSS」となっていますが、もちろんここも編集可能です。onMouse で各RSSリーダーへの登録リンクが現れます。)

説明文を加えた場合は画像は右(float:right)、説明文なしの場合は中央(float:center)にRSSアイコンのみが大きく表示されます。ただ好みの問題で、アイコンを左端に表示したかったため、下記画像ではCSSを書き換えてアイコンを左端に表示しています。しかしこれも含め、いくつか問題がありました:

  • onMouseした場合の各RSSリーダーへの登録リンクの出現位置が、右端で固定なので見栄えが悪い
  • RSS フィードを表示するだけなのに、メニューの大きな幅を使ってしまう

この2点から、Subscribe Me の利用は今回は見送りました。

また、Subscribe Me を用いず、テキストウィジェットで自前でリンクを用意した場合でも、ウィジェットを利用する関係からメニューの利用幅が大きく、ウィジェットを利用せずに RSS フィードを表示する方法を考えました。

[caption id="attachment_1880" align="aligncenter" width="400"]Subscribe Me Subscribe Me を利用した RSS フィード[/caption]

Category - RSS widget menu

ブログ全体の RSS フィードではなく、各カテゴリーごとに RSS を配信することも出来ます。そのためのプラグインが、RSS widget menu です。これを利用すると、通常のカテゴリーウィジェットの先頭に、RSS のアイコンが付いたような形になり、見た目にもシンプルに RSS フィードが表示可能です。

今回はブログ全体に対する RSS フィードを表示したかったのですが、調べていた中で見つけたこちらのプラグインも現在使用しています。

[caption id="attachment_1913" align="aligncenter" width="400"]Category - RSS widget menu Category - RSS widget menu を利用した様子です。カテゴリーウィジェットの各カテゴリーの先頭に、RSS アイコンが表示されています。ここから RSS フィードを表示することが可能です。[/caption]

ヘッダメニューに表示する

これが冒頭でご紹介した方法です。ヘッダメニューを表示している PHP ファイルを修正し、RSS フィードをねじ込んだ形です(ちょっと強引…)。

[caption id="attachment_1879" align="aligncenter" width="400"]RSS 配信リンクをヘッダメニューに追加 RSS 配信リンクをヘッダメニューに追加しました。この方法について解説します。[/caption]

ヘッダメニューは、wp-includes/nav-menu-template.php というファイル内で生成されています。このファイルで修正の必要があるのは下記ソースの15行目です:

function wp_nav_menu( $args = array() ) {
    static $menu_id_slugs = array();
    $defaults = array( 'menu' => '',
                       'container' => 'div',
                       'container_class' => '',
                       'container_id' => '',
                       'menu_class' => 'menu',
                       'menu_id' => '',
                       'echo' => true,
                       'fallback_cb' => 'wp_page_menu',
                       'before' => '',
                       'after' => '',
                       'link_before' => '',
                       'link_after' => '',
                       'items_wrap' => '
    %3$s
', 'depth' => 0, 'walker' => '', 'theme_location' => '' ); $args = wp_parse_args( $args, $defaults ); $args = apply_filters( 'wp_nav_menu_args', $args ); $args = (object) $args; ...

15行目は、$defaults に items_wrap という設定を記載している行です。ここがヘッダメニューの大枠部分であり、ヘッダメニュー全体が<ul> タグで生成される事を表しているようです。%3$s という部分が、実際にメニューが挿入される箇所のようですので、この前に RSS フィード用のタグを挿入します。

    %3$s
  • %3$s

この改修は、実際のヘッダメニューにリスト要素を1つ追加した形になるのですが、このブログで利用しているテンプレートだと、メニューの1つ1つをブロック要素として扱っているため、onMouse などの効果が不要な RSS アイコンはインライン要素で十分でした。その他、余白を設定したりなどして、最終的には次のようになりました:

  • %3$s

 

上記設定箇所を探すのに意外と手間取りましたが、よい位置に RSS アイコンが配置できて満足です。常にヘッダメニューに RSS アイコンがあるのは鬱陶しい気もしますが… 何かご意見あれば、ぜひお願いいたします。