Iconic Oneのヘッダー部分にFeedlyアイコンを追加

Iconic Oneのヘッダー部分にFeedlyアイコンを追加

2013年9月1日

現在、このブログで使用しているテーマはIconic Oneというものです。このテーマには有料版Proも用意されていますが、僕はまだ無料版のままです。気になったテーマに巡りあったら、そのテーマに変更するかもしれないからです。

さて、今回はこのIconic Oneのヘッダー部分にあるソーシャルネットワークやRssのアイコンが表示されている場所に、Feedlyアイコンを追加してみました。BIBALOGUE___びばろうぐ:地理教育とライフハックについての私的記録

Feedlyを使うようになったので、このブログにもFeedly登録用のボタンを設置しました。この時はサイドバーに表示するウィジェットにHTMLコードを貼付けるという方法でした。

Iconic Oneでは、外観の設定で簡単にソーシャルアイコンなどをヘッダー部分に表示することができます。しかし、標準のままでの表示内容は限定的で、Twitter・Facebook・Google+・RSSの4つ全部を表示するか非表示にするかしか選択できません。

そこで、できたらこの場所にFeedlyアイコンを設置したいと思い、少し調べてみました。すると、WordPressのサポートサイトで同じような質問がなされていることのを見つけました。そして、その質問に対して次のような返答が書き込まれていました。

Hi,

simply add this code after line 42 in header.php file

<a href="http://IMGlink" target="_blank"><img src="http://IMG.png"/></a>

replace IMGlink with linked/youtube page url and img.png with linkedin/youtube png image, it must be full image URL.

ここからheader.phpファイルの42行目のあとに、指示された内容を挿入すれば表示できることがわかりました。簡単そうなので、早速やって見ました。

まず、header.phpファイルに挿入するHTMLコードを取得するために、Feedlyボタンを設置する時に使ったサイトを使います。ここでの手順は、Feedlyボタンを設置する時と同じです。

取得したコードを今回は44行目に挿入してみました。その結果、Feedlyのアイコンが右端に追加されましたがアイコンの大きさが他のものと違っていることに気づきました。そこで、取得したコードにある幅と高さを’28’から’32’に変更してみたらほぼ同じ大きさになりました。

この場所に表示したい他のアイコンがあれば、同じ手順を繰り返すだけでできます。また、表示したくないアイコンについては、この43行目にある記述を削除すればいいわけです。

今のところほとんど使わないGoogle+は削除してしまおうかと考えています(^_^)