<--!リンク--> アメブロのフッター(記事下)の「コメントする」ボタンにアイコンを付ける方法|あんなこと、そんなこと、どうでもいいこと・・・

あんなこと、そんなこと、どうでもいいこと・・・

;気まぐれに書いてます^^
あんなこと、そんなこと、どうでもいいこと・・・ TOP  >  スポンサー広告 >  未分類 >  アメブロのフッター(記事下)の「コメントする」ボタンにアイコンを付ける方法

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
[ --年--月--日 --:-- ] カテゴリ:スポンサー広告 | TB(-) | CM(-)

アメブロのフッター(記事下)の「コメントする」ボタンにアイコンを付ける方法

※CSS編集可能デザインを採用されている方向けです



以前、フッター下の「いいね!した人」にアイコンを付ける方法をご紹介しました。

今回は「コメントする」ボタンにアイコンを表示する方法をご紹介します。

「ブログを書く」絵文字のボタンをクリックして、試しに「メモ」⇒メモを、アイコンとして文字の左側に表示してみました。

「デザインの変更」⇒「CSSの編集」で、以下の設定をご自身のアメブロの「現在使用中のブログデザインCSS」の末尾に追記(コピペ)してみて下さい。

/*「コメントする」ボタンにアイコンを表示*/
.articleCommentBtnArea{
border: 1px solid #cccccc;
border-radius: 2px;
background-image: url(http://stat100.ameba.jp/blog/img/btn/btn_basic_ss.1.0.png);
}
.articleCommentBtnArea:hover{
background-image: url(http://stat100.ameba.jp/blog/img/btn/btn_basic_ss_hover.1.0.png);
}
.articleCommentBtn, .articleCommentBtn:hover{
padding-left: 28px;
border: 0 none;
background-color: transparent;
background-position: 6px 2px;
background-repeat: no-repeat;
background-image:url(http://stat.ameba.jp/blog/ucs/img/char/char2/131.gif);
}



赤字の箇所が、今回使用したアイコンとして表示する画像のURLです。お好みの画像URLに差し替えてください。


☆ブィブィ ゞ(o^-')b
スポンサーサイト
[ 2014年01月08日 09:40 ] カテゴリ:未分類 | TB(0) | CM(0)
コメントの投稿












管理者にだけ表示を許可する
トラックバック
この記事のトラックバックURL

プロフィール

awantan

Author:awantan
なんだか良く解りませんが、
ポチポチ頑張ります。;^^

メインは、こちらの方です。

ワンタンのアメブロ

検索フォーム
ブロとも申請フォーム
QRコード
QR


上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。