新スキン対応:アメブロにFacebookのいいね!ボタンを貼り付ける方法。 | 佐渡の洋食屋店長のブログ

佐渡の洋食屋店長のブログ

佐渡の洋食屋店長のマニアックなブログです。 グルメネタは少なく、マニアックなネットTEC的なネタ、佐渡ネタが豊富なブログです。

アメブロが新スキンになってから、自分のブログのカスタマイズもしなくちゃ!なんですが、、、
写真素材も乏しく、未だ旧スキンのままのこのブログ・・・。
秋には写真素材を揃えてリニューアルかけたいと思います。

さて、新スキンに対応したFacebookのいいね!ボタンの付け方ですが、今まで同様フリープラグインのところに記載するだけで出来ちゃいます。
こちらのサイトが参考になりました。感謝!!
新スキンになってから独自の方法で、HTMLやCSSの構成を解析していたのですが、この方のブログ記事「新スキンのカスタマイズの参考に。id&classレイアウト」は大変に参考になります。アメブロカスタマイズする方はぜひご一読を。

では、ソースのご紹介を。




上記をコピペしてアメブロのフリープラグインに入れるだけでOKです。
下記のように表示されると思います。
$佐渡の洋食屋店長のブログ-新潟の工務店さんのブログ

いいね!ボタンをブログの下部に表示させたい場合は、

$(".articleTheme").eq(i).after(" <span>"+e+"</span>")
となっているところを・・・
$(".articleLinkArea").eq(i).before(" <span>"+e+"</span>")
に置き換えるとブログ下部にいいね!ボタンが付きます。

何か表示がズレてておかしい場合は、<iframeの前に<br />を加えてください。


早速こちらの新潟の工務店さんのブログで実装させていただきました。

※追記※
現在シェアボタンが機能しません。
こちらが最新の主要ソーシャルプラグイン全部載せスクリプトです。



ブログ読者登録はこちらです。
↓↓
読者になる