Blogを開設している方なら、個別ページ向けのSNS共有用ボタンの他に、トップページ(ホームページ)向けの共有ボタンも設置したいと思う方もいらっしゃると思います。
footerに設置しました
SNS共有ボタンの設置方法は、
にて紹介済みなので、このエントリと共に参考にしてみてください。
Blog内のどのページを表示していてもトップページを共有するためのURLがBloggerには用意されています。それが以下のコードです。
data:blog.canonicalHomepageUrl今回は共有する対象のURLやhrefに”data:blog.canonicalHomepageUrl”を指定し、”expr:”をつけることでトップページの共有を実現します。
※canonicalがついているので、共有されたトップページの国別ドメインの違い(.jpや.com)に関わらず、共有された数の総数が集計され表示されます。
以下に、当Blogで現在使用している+1ボタンとTweetボタンの例を紹介します。
+1ボタン
<div class='g-plusone' data-size='medium' expr:data-href='data:blog.canonicalHomepageUrl'/>
Tweetボタン※赤太字部分が今回ポイントのところ。
<a class='twitter-share-button' data-count='horizontal' data-lang='en' data-related='anywhereTheJavascriptAPI' data-via='Chimtty' expr:data-text='data:blog.title' expr:data-url='data:blog.canonicalHomepageUrl' href='https://twitter.com/share'>Tweet</a>