ヘッダー画像転換

ロールオーバーですが、ご存知とは思いますが”スキンCSS編集”にて行ないます。
その中の”ヘッダー”という箇所を探して編集するのですが、
私のブログの場合はこんな感じです・・・

#header {
background-image: url(http://stat.ameba.jp/user_images/20090516/13/lord-jack/d7/ef/j/ホニャララ.jpg);
}

#header:hover {
background-image: url(http://stat.ameba.jp/user_images/20090516/14/lord-jack/0c/40/j/チョメチョメ.jpg);
}

#header:hover { がロールオーバー後の画像です。これはどこにもないので書き足すことになります。
”:hover”と画像URL以外は同じことがかいてあります。

それぞれのhttp～の部分を保存した画像のurlに変更して保存です。

ちなみに、ブラウザのバージョンによっては画像転換しないそうです・・・

あと、大きい画像のまま送ってしまったのですが、20%縮小で以前の画像と
同じ大きさになる縦横比になっています・・・(｡-人-｡)

何か不明な点があれば遠慮なく仰ってくださいね！(*＾ー＾)ノ

サイドバーへの貼り方

文章だけだとわかりにくいので動画も撮ってみました。

事前に画像フォルダに会員証をアップしておきます。

まずスタートは”記事を書く”からです。
いつもしているように、写真を貼り付ける要領で会員証を貼り付けます。
この時、”大きさ：”を、オリジナルとして貼り付けるのが良いです。

貼り付けたら画像をクリックすると四隅に白い■が出るので
それをマウスで掴んで縮小させます。

その後、編集欄の下部にある”HTMLタグを表示”をクリック。
その中の数字部分を任意の数字に書き換えます。
"width"が横幅、"hight"が縦幅のことです。
会員証は横と縦の比がちょうど2：1ですので、そうなるようにどちらも調整します。
映像では300と150に書き換えています。

そして、"<img="という所から"</a>"の手前までを選択し、コピーします。

ここまでの作業の動画


編集エリア上部の”サイドバーの設定”をクリック。
その中の”フリースペースの編集”をクリック。
編集エリアに先ほどコピーしたものを貼り付け。
編集エリア下部の保存ボタンを押下。

この作業の動画


恐らくこれで貼り付けだけは完了していると思います。
もしはみ出しているようなら、さきほど変更した数字をさらに小さくして
調整をする必要があります。

この時点でブログに何も表示されていない場合、
次のことを確認してみてください。

編集エリア上部の”サイドバーの配置”をクリック。
”使用しない機能”の欄に”フリースペース”があるなら、
それをマウスで掴んで、”使用する機能”のほうへ持ってきてください。
最後に下部の保存ボタンを押下。
サイドバーに表示する順番などもここで入れ替えることが出来ます。

この作業の動画


解らないことがあれば、本家のブログのプチメでお問い合わせくださいね！(*＾ー＾)ノ

ねこばか道会員証 to まはぁさん

ねこばか道の会員証です。
ここからダウンロードしてくださいね！(*＾ー＾)ノ



↓オリジナルの大きさです