from :: Asahikawa Hokkaido

passer-by198

primetime pencil

2011/02/28


Posted

Bloggerの「共有ボタン」が仕様変更で表示されない場合の修正

Blogger の「共有ボタン」に仕様変更があったようで…

表示されなくなった…との連絡をうけ…

おや…まぁ…ってなもんで…

色々弄ってみた…

結論は…「ウィジェット テンプレートをデフォルトに戻す」と…

表示されます…

つまり…どうやら…「ウィジェット」を「デフォルト」のまま…

使用している方は不具合が無い

しかしながら…「デフォルト」に戻すと…

デザインがとんでもない事になってしまうので…

仕様変更された部分を修正して…

「共有ボタン」が表示されるようにしてみましょう…

「デザイン」「HTMLの編集」「ウィジェットのテンプレートを展開」で…

<b:includable id='shareButtons' var='post'>

を「Ctrl + F」で検索すると該当する箇所は…
  1. <b:includable id='shareButtons' var='post'>
  2. <a class='share-button sb-email' expr:href='data:post.sharePostUrl + "&target=email"' expr:title='data:top.emailThisMsg' target='_blank'>
  3. <span class='share-button-link-text'><data:top.emailThisMsg/></span></a>
  4. <a class='share-button sb-blog' expr:href='data:post.sharePostUrl + "&target=blog"' expr:onclick='"window.open(this.href, \"_blank\", \"height=270,width=475\"); return false;"' expr:title='data:top.blogThisMsg' target='_blank'>
  5. <span class='share-button-link-text'><data:top.blogThisMsg/></span></a>
  6. <a class='share-button sb-twitter' expr:href='data:post.sharePostUrl + "&target=twitter"' expr:title='data:top.shareToTwitterMsg' target='_blank'>
  7. <span class='share-button-link-text'><data:top.shareToTwitterMsg/></span></a>
  8. <a class='share-button sb-facebook' expr:href='data:post.sharePostUrl + "&target=facebook"' expr:onclick='"window.open(this.href, \"_blank\", \"height=430,width=640\"); return false;"' expr:title='data:top.shareToFacebookMsg' target='_blank'>
  9. <span class='share-button-link-text'><data:top.shareToFacebookMsg/></span></a>
  10. <a class='share-button sb-buzz' expr:href='data:post.sharePostUrl + "&target=buzz"' expr:onclick='"window.open(this.href, \"_blank\", \"height=415,width=690\"); return false;"' expr:title='data:top.shareToBuzzMsg' target='_blank'>
  11. <span class='share-button-link-text'><data:top.shareToBuzzMsg/></span></a>
  12. </b:includable>
ってな感じになっていますので…

以下の…12行目と黄色の太字文字列を追記して…こんな感じに…
  1. <b:includable id='shareButtons' var='post'>
  2. <a class='goog-inline-block share-button sb-email' expr:href='data:post.sharePostUrl + "&target=email"' expr:title='data:top.emailThisMsg' target='_blank'>
  3. <span class='share-button-link-text'><data:top.emailThisMsg/></span></a>
  4. <a class='goog-inline-block share-button sb-blog' expr:href='data:post.sharePostUrl + "&target=blog"' expr:onclick='"window.open(this.href, \"_blank\", \"height=270,width=475\"); return false;"' expr:title='data:top.blogThisMsg' target='_blank'>
  5. <span class='share-button-link-text'><data:top.blogThisMsg/></span></a>
  6. <a class='goog-inline-block share-button sb-twitter' expr:href='data:post.sharePostUrl + "&target=twitter"' expr:title='data:top.shareToTwitterMsg' target='_blank'>
  7. <span class='share-button-link-text'><data:top.shareToTwitterMsg/></span></a>
  8. <a class='goog-inline-block share-button sb-facebook' expr:href='data:post.sharePostUrl + "&target=facebook"' expr:onclick='"window.open(this.href, \"_blank\", \"height=430,width=640\"); return false;"' expr:title='data:top.shareToFacebookMsg' target='_blank'>
  9. <span class='share-button-link-text'><data:top.shareToFacebookMsg/></span></a>
  10. <a class='goog-inline-block share-button sb-buzz' expr:href='data:post.sharePostUrl + "&target=buzz"' expr:onclick='"window.open(this.href, \"_blank\", \"height=415,width=690\"); return false;"' expr:title='data:top.shareToBuzzMsg' target='_blank'>
  11. <span class='share-button-link-text'><data:top.shareToBuzzMsg/></span></a>
  12. <b:if cond='data:top.showDummy'> <div class='goog-inline-block dummy-container'><data:post.dummyTag/></div> </b:if>
  13. </b:includable>
「テンプレートを保存」で完了…

これで Blogger の「共有ボタン」が表示されるようになります…

…たぶん…( ̄ー ̄)邪笑

まぁ…あくまでも…

ウィジェットを…色々と弄っている方用の記事です…

当サイトと同じ「共有ボタン」を作成したい方は…

 Bloggerの共有ボタンを自作ソーシャルブックマークボタンと入れ替える方法と必要性


こちらの記事もお奨めです…

 Bloggerの共有ボタンに「新 はてなブックマークボタン」を追加する…修正版




0 Comments :

「jQuery」と「jQuery UI」で HTML に彩りを添えよう…


「導入」「Button」「Accordion」「Tabs」「Effects/Slide」
「Progressbar」「Dialog」「Tooltip」「Menu」
「Extra」 / 公式「Widgets」以外の「jQuery UI」スクリプト
Blogger Template Customize Universal / INDEX

Blogger テンプレート・カスタマイズ / 全般を解説
高速化・最適化対策の結果と備忘録