ペタっとな～
問い合わせ？の多いオリジナルペタボタン☆
今日は作り方を
ご紹介することにします＾＾
といっても・・・
機械オンチで説明下手のぐみなので、
スイートエンジェル様に教えていただいたやつを
（勝手に）ほぼ右から左の内容でいきたいと思いますっ
(｀・ω・´)ゞビシッ
手順①
まずは、ペタボタンにしたい画像を用意します＾＾
ピグ写真でも、イラストでも、携帯からのデータでも、
なぁーーーーんでもOKです！
↑本日のサンプル☆
『居酒屋カッパブラザーズ♪』ｗｗｗｗ
（亀ちゃん、この葛飾応為もびっくりの
ステキな作品、もちろん
『右クリック＆名前をつけて保存』
でお持ち帰りしてくれるよね？？？）
で。
ペタボタンにしたい画像を
とりあえず画面に張っておいて、
手順②
アメーバが用意してくれている
既存のペタボタンを貼り付けます！
べつにどれでもいい。
ぐみはたいてい、こやつです。すんもです。
ぐんものライバルですね。
で、二枚を貼ってみたところで
手順③
「タグの非表示」、「HTMLタグを表示」を
切り替えてみてください。記事画面下にあります！
ふだん私たちは、
「タグの非表示」の状態で記事を書いている
わけなのですが、表示を切り替えて
「HTMLタグを表示」してみると・・・・？
ぐみのイラストはこう↓
<a href="http://stat.ameba.jp/user_images/20100926/15/bbbbb2010/af/54/g/o0640038510768615396.gif"><img
alt="ぐみきゃんデイ" src="http://stat.ameba.jp/user_images/20100926/15/bbbbb2010/af/54/g/t02200132_0640038510768615396.gif
" border="0" complete="true" /></a>
すんものペタボタンはこう↓
<a href="http://peta.ameba.jp/p/addPeta.do?targetAmebaId=bbbbb2010&guid=ON"><img
width="100" height="106" alt="ペタしてね" src="http://stat.ameba.jp/blog/ucs/img/decoPeta/pc/decoPeta_15.gif
" complete="true" /></a>
表示されます。
うがぁーーー・・・気絶しそうだぜ。
ここで
手順④
記号の羅列にはだしで逃げ出しそうになるのを、
ぐっとこらえます。
そして
手順⑤
すんものペタボタンの表示に注目していただくと、
青く表示された後半の部分がありますね。
htｔｐ．//stat.ameba.jp/blog～dekoPeta/pc/decoPeta 15.gif
の部分。
これがイラストのアドレスです。
要するに、このイラストアドレスを、
自分が用意した画像のアドレスに
すげかえればいいのです！！
いらないすんもイラストのアドレスを削除！
そして自分の画像のアドレスを
コピー＆ペースト！！
（あまった記号の羅列は消しちゃう。
あるいは、はじめから画像のアドレスだけをメモなどに
コピペしておけばOKです＾＾
画像のアドレスは、画像を右クリック、「プロパティ」から
見られますので、そこからコピーしておけばいいのです＾＾）
それを理解するまでに
ぐみは異常なほど長い時間を必要としました・・・
遠い目・・・
最終手順⑥
ペタのHTML表示の中に、
width="100" height="106"
という部分がありますね。これでペタボタンの
幅と高さが決まっています。
この数字を変えれば、画像のサイズも調整できると
いうことで、
ぐみの場合はもともとの絵のバランスに合わせて、
だいたい１．５倍から２倍くらいにして使っています。
・・・おわり。
読み返すとわかりづらいなぁ・・・
さすが私。
ペタボタンの作り方は、
ほかにもいろんな方がブログにupしてるので、
たぶんもっとわかりやすい説明のものが
あると思います＾＾；
もっと高度な技もあるかもです＾＾；
興味のある方は検索してみてください＾＾
（逃げｗ）
ああ
まじめな記事書いたら頭痛くなってきた・・・
いいな、きらたん・・・
ぐみも、阿蘇の空気を吸いたいでつ・・・