facebookいいねボタン設置覚書-1

ブログ村のバナーが貼れたこと、で、変な自信を持ってしまい、facebookのいいねボタンが貼れるのではないかと、挑戦中です。

ココログのF＆Q等を参考に、自分なりの工夫をして、フッター部分にTweetボタンと並べて貼り付けるところまでは出来ました。

facebookのいいねボタンは、IFRAMEのプラグインを使用しました。

<script type="text/javascript"> $(function() { $(".entry-footer-links-twitter").after('<iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fanocora.cocolog-nifty.com%2Fblog%2F&width=100&layout=button_count&action=like&show_faces=true&share=false&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:21px;" allowTransparency="true"></iframe>'); }); </script>

このままでは、記事毎のいいねボタンにはならず、ブログ全体に対してのいいねになってしまいますので、記事毎のいいねに出来るよう挑戦中です。

問題は、

・ブログのトップページと、固定リンクで記事のURLの記載が異なっていること。
・ＪＱUＥＲＹを使って、ブログ記事のURLを取得する方法が判らないことです。

先ず、記事のURLを取得できないと、次へ進めないので、試行錯誤しました。
タグの中に記載されたURL情報などは、「属性値」というそうです。
「JQUERY　属性値取得」で検索して、ようやく、URLを取得する方法にたどり着きました。
参考にしたのは、jQuery逆引きリファレンス：第2回 属性＆コンテンツ編 (2/19)です。

    window.alert($('a').attr('href'));
で、取得したURLを表示出来ましたが、まだ取得したい場所のURLでは有りません。

$('a')を取得したい場所に指定する必要があります。

TOPページのブログ記事のURLはブログ記事
jQuery – いろんなセレクタ指定方法＋αを覚えて、目的の要素をさくっと取得するを参考に
    window.alert($('a[href]','.entry-header').attr('href'));
で、取得したURLを表示出来ました。

固定リンクの場合は、
jQuery　色々な自分自身の○○を取得する
から
    location.href
でURLを取得できることが判りました。

後は、トップページと固定リンクで、取得するURLをIF文を使って条件設定できれば、形になりそうです。

jQueryのプログラミングは初挑戦です。
プログラミングを覚えるのは、「やりたいことを見つけること」が持論です。

諦めずに頑張ってみようと思いますが、もしこうすれば出来るという、ノウハウをお持ちの方がおられましたら、御伝授いただけると幸いです。