アメーバブログのカスタマイズの話し。

僕も使っていますがiPodが発売から１０年を迎えましたね。

おつかれさまです、速水です。

ネットから音楽データを購入する勇気は無く

レンタルで借りて来たCDを入れて楽しんでいます。

さて、

ここ数日資料作り漬けなんですが

息抜きにアメブロのデザインの変更とかしてみました。

そしたらfacebookの「いいね！」ボタンが消えてしまったのです。

このボタン、

以前に貼付けた時も結構苦労したんです。

そして、今回もやはり。。。

ネットからコードを持って来て貼付けてみるんですが

なかなか上手く行きません。。。

そして見つけました！

アメブロカスタマイズのわざめーばさん

この人は凄いです。

凄過ぎるのでバナーでリンクを貼らせて頂きました。
←
←

ここを参考にして僕もチョコチョコっと改造しました。

まずは「いいね！」ボタンの張り付け。

方法は　まずjavascriptを使える様にするため

アメブロ内の「サイドバーの設定」一番下の

フリープラグイン「編集」の一番下に

<script type="text/javascript" src="http://www.google.com/jsapi"></script>

<script type="text/javascript">google.load('jquery', '1.6.2');</script>

<script type="text/javascript">(_JQ162_=jQuery)(function(){$=jQuery=_JQ162_;});</script>

と張り付け

続いてボタンを貼付けるコード

<script src="http://p.wazameba.com/js/jquery.socialbutton.js"></script>

<script src="http://p.wazameba.com/js/socialbutton.js"></script>

<script>

socialbuttons({buttons:['hatenabm','twitter','fbshare','fblike']});

</script>

を貼付けます。

それだけです。

なんで今まで上手く行かなかったんだろう。。。

そしてせっかくなので

ブログ記事の下にfacebookのコメント欄を貼付けました。

これも

先程のフリープラグインの編集欄の一番下に

<script src="http://p.wazameba.com/njs/fbcmt.js"></script>

<script>wzmbFBCmt()</script>

と貼付けて保存するだけです。

わざめーばさん、凄いです。

簡単に出来てしまいます！

こんな事も出来ました。

ブログ記事の一番上のバー、

要らないので消しちゃいました。

アイコンをバーが有った所に持って行くと

表示されますが、いらないでしょ？これ。

方法ですが

今回はフリープラグインじゃなくて

CSSで編集します。

その為にはアメブロのデザインも

「カスタム可能ベーシック」か「CSS編集用」を

選んでおく必要が有ります。

デザインを選ぶと

「CSS編集」と有りますので

そこを開いて

難しいコードが羅列している窓の一番下。

／＊その他、拡張があれば記述＊／

と書かれた下に

#amebaBar{

  opacity:0.35;

  filter:alpha(opacity=35);

  -ms-filter:alpha(opacity=35);

}

#amebaBar:hover{

 opacity:1.00;

 filter:alpha(opacity=100);

 -ms-filter:alpha(opacity=100);

}

このコードを貼付けて保存します。

赤文字で書いてある部分が透明度の指定で

０～１００までの選択で濃さを選べます。

僕は０にして消しました。

本当は広告部分を消したいんですが

今はまだその方法を見つけられていません。

そうぞ、ご参考までに。

ブログランキングに参加中です。
　「遊ばずに仕事しなさい！」
とお思いの方もクリックをお願いします！
　　　　　　　　↓

伊丹のおくりびと

伊丹市の幸せ創造企業速水葬祭二代目創業者　速水英城です。
色んな所で様々な人々に支えられご縁を頂き毎日を過ごしています。
感謝を込めて綴ります。

アメーバブログのカスタマイズの話し。