ホームページ制作、SEO対策 サイバーアクセル・アドバイザーズTOP » ブログ » webコラム» アメブロカスタマイズ サイドバーの読者登録ボタンをオリジナル画像にする方法
投稿日: 2015/01/23 投稿者:webコラム
こんにちは。
今回は、アメブロのサイドバーにある読者登録ボタンをオリジナル画像に変更する方法についてご案内したいと思います。
初めから用意されている読者登録ボタンはこんな感じ。
目立たないですよね・・・。
私もいろいろなブログを見て回って、また読みたいなと思うブログには読者登録するのですが、この「読者登録ボタンがどこにあるかわからないっ!」ということがあります。
サイドバーをスクロールしてあちこち探してみたり・・・。
より読者を増やすための読者登録ボタンなのにもったいないですよね!
やはり読者登録ボタンは目立っているほうがいい!
ということで、変更方法をご案内します!
「ブログを書く」→「デザイン編集」→「CSSの編集」とクリックします。
読者登録ボタンの画像をアップロードします。
アップロードすると、下に画像が出るので、「この画像のパス」をコピーします。
スタイルシート編集画面の一番下までスクロールし、下記のスタイルシートを貼り付けます。
.readerMenu a.skinImgBtnS{
width:250px;
height:47px;
text-indent:-9999px;
background-image:url(画像のURL);
background-repeat:no-repeat;
background-position:center 0px;
}
.readerMenu a:hover.skinImgBtnS{
background-position:center -47px;
}
.readerMenu .skinMenuBody{
padding:0px;
margin:0px;
}
※ 青色の部分は画像の幅や高さによって変更してください。