Stinger3のSNSメニューに、Feedlyへの登録ボタンを追加する方法
2013年10月17日
思いついたらすぐ実行、しゅんぼー(@shun_kashiwa)です。昨日、ブログのテーマを突然Stinger3に変更しました。
そのカスタマイズをしているのですが、それをご紹介。
今回は、「SNSメニューにFeedlyの登録ボタンを追加」してみます！
ボタンを作る
まず、ボタンを作ります。
このページで、Feedlyのボタンを作ります。WordPressのRSSフィードは
|
1 |
http://example.com/?feed=rss2 |
となります。このブログの場合は
|
1 |
http://blog.skyd.biz/?feed=rss2 |
となります。
ボタンのデザインは自由ですが、僕は選択したものがオススメです。
最後に、一番下のフォームに生成されるコードをコピーします。
Stingerに書き込む
ここから、テーマに書き込んでいきます。
wp-content/themes/[stinger]/footer.php
の中に書き込みます。
75行ほどから、このような記述があるはずです。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
<div id="snsbox"> <div class="sns"> <ul class="snsb clearfix"> </ul><ul class="snsb clearfix"> <li><a class="twitter-share-button" href="https://twitter.com/share" data-count="vertical" data-via="" data-url="<?php the_permalink(); ?>" data-text="<?php the_title(); ?>">Tweet</a> <script type="text/javascript" src="//platform.twitter.com/widgets.js"></script></li> </ul> <ul class="snsb clearfix"> </ul><ul class="snsb clearfix"> <li><iframe width="320" height="240" style="border: none; overflow: hidden; width: 70px; height: 62px;" src="http://www.facebook.com/plugins/like.php?href=<?php the_permalink(); ?>&layout=box_count&show_faces=false&width=50&action=like&colorscheme=light&height=62" scrolling="no" frameborder="0"></iframe></li> </ul> <ul class="snsb clearfix"> <li><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script></li> <li><a class="hatena-bookmark-button" title="このエントリーをはてなブックマークに追加" href="http://b.hatena.ne.jp/entry/<?php the_permalink(); ?>" data-hatena-bookmark-title="<?php the_title(); ?>｜<?php bloginfo('name'); ?>" data-hatena-bookmark-layout="vertical"><img style="border: none;" alt="このエントリーをはてなブックマークに追加" src="http://b.st-hatena.com/images/entry-button/button-only.gif" width="20" height="20" /></a> <script type="text/javascript" src="http://b.st-hatena.com/js/bookmark_button.js"></script></li> </ul> </div> </div> |
ここを、次のように書き直します。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<div id="snsbox"> <div class="sns"> <ul class="snsb clearfix"> <li><a class="twitter-share-button" href="https://twitter.com/share" data-count="vertical" data-via="" data-url="<?php the_permalink(); ?>" data-text="<?php the_title(); ?>">Tweet</a> <script type="text/javascript" src="//platform.twitter.com/widgets.js"></script> </li> <li><iframe src="http://www.facebook.com/plugins/like.php?href=<?php the_permalink(); ?>&layout=box_count&show_faces=false&width=50&action=like&colorscheme=light&height=62" style="border: none; overflow: hidden; width: 70px; height: 62px;" scrolling="no" frameborder="0"></iframe></li> <li> <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> </li> <li><a class="hatena-bookmark-button" title="このエントリーをはてなブックマークに追加" href="http://b.hatena.ne.jp/entry/<?php the_permalink(); ?>" data-hatena-bookmark-title="<?php the_title(); ?>｜<?php bloginfo('name'); ?>" data-hatena-bookmark-layout="vertical"><img style="border: none;" src="http://b.st-hatena.com/images/entry-button/button-only.gif" alt="このエントリーをはてなブックマークに追加" width="20" height="20" /></a> <script type="text/javascript" src="http://b.st-hatena.com/js/bookmark_button.js"></script> </li> <li> ここにコードを追加 </li> </ul> </div> </div> <p> |
ul要素のなかに、新しくli要素を追加し、そこに書き込む感じです。
さいごに
ブログのPVは最近増えてきているのですが、購読してくれる人は少ないんです(:_;)
といことで、この記事が気に入ってくれた方は、ぜひ登録をお願いします(^^)
それではしゅんぼー(@shun_kashiwa)でした