BlogPetの更新ボタンを付けてみました♪
大抵画面の切りかえボタンがついていて、
ボタンひとつで他のペットと遊ぶことができ
とても便利だなぁと思っていました。
BlogPetの部分だけが読み込まれるので
ストレスなくペットたちと遊ぶことができます。
まゆびは多頭飼いではないですが、
あんなボタンがあったらいいなぁと以前から
ずーっと考えていたのですが、
やっと完成しました!!
うさびの上にうさぎの画像があります♪
こちらをクリックしてみてくださいませ♪
するとうさびが更新され背景が変わります♪
これでストレスなく背景を楽しむことができます♪
この可愛いうさぎの画像は「**Silver Heart**」のmayuさんの
「背景 みんなでやっほー♪」の記事よりお借りいたしました。
ｍａｙｕさん、ありがとうございます。＜(＿ ＿)＞
ではではまゆびの使った方法を
書かせていただきますね!!
コチラの方法はiframeというものが使えないブログでは使えません。
なのでエキサイトブログの方は使えないです。＜(＿ ＿)＞
他にも使えないブログがあると思いますので、
よく調べてから実行してくださいね♪
また、htmlファイルをアップロードするサーバスペースが必要となります。
各ブログでhtmlファイルがアップロード出来る場合は問題ありません。
(FC２は出来ます♪)
iswebは広告が出るので無理ですので、
広告の出ないサーバースペースを使ってくださいね。
まずはBlogPetを表示させるページを別に作ります。
はじめにusabi.htmlというファイルを作りましょう!!
もちろん皆様は自分のペットのお名前でね♪(o^-^o) ｳﾌｯ
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head><!--Copyright (c) usabi All rights reserved.//-->
<title>うさび</title>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<link rel="STYLESHEET" href="st.css" type="text/css">
</head>
<body>
<a href="http://～/usabi.html" title="リロード">リロード</a>
ここにBlogPetのスクリプトを貼ってね!!
</body>
</html>
青字の部分はこのファイルのアドレスにしてください。
赤字の部分は好きな言葉に変えてくださいね♪
ちなみにまゆびが使っているコードはこんな感じになっています。
留守番背景の設定がされているのと(緑字部分)<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head><!--Copyright (c) usabi All rights reserved.//-->
<title>うさび</title>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<link rel="STYLESHEET" href="st.css" type="text/css">
</head>
<body>
<table><tr><td valign="middle"><a href="http://～/usabi.html" title="リロード"><img src="(アイコンのURL)" alt="うさぎアイコン" border="0"></A></td><td valign="middle"><font size="1">←背景が変わるよ♪<br>クリックしてね♪</font></td></tr></table>
<table border=0 cellspacing=0 cellpadding=0 width=127 height=196 background="(留守番背景のURL)"><tr><td>BlogPetのスクリプト</td></tr></table>
</body>
</html>
BlogPetの上に画像と文字を入れたかったので
テーブルが組まれているところ(ピンク字部分)が
先ほどと違っています。
同じように画像を入れたい方はこちらのコードにされるといいかもしれません。
留守番背景の設定については
「留守番背景を設定しました♪(*^-ﾟ)v」の記事をご覧くださいませ♪
BlogPetを配置する部分の背景色が白ではない方は
<body>を<body bgcolor="#～">
に変更して自分のブログの背景色を#～の部分に設定してくださいね♪
そしてこのファイルを.htmlの拡張子で保存します。
(まゆびの場合はusabi.htmlです♪)
それからhtmlファイルをアップロードしてください。
このときに一度このファイルのアドレスを入れてページを確認してみてくださいね♪
リロードボタンも動けばOKです♪
もしも表示されない場合は何らかのミスがあるものと思われます。
次にこのファイルを表示させるコードを貼ります。
<iframe name="uri" src="http://～/usabi.html" width=130 height=240 scrolling="no" frameborder=0 border=0></iframe>
ブログペットの幅の部分は130でいいのですが、
高さは200で、リロードボタンの部分の高さを加えなければなりません。
まゆびは240で少し大きいくらいになっています。
このあたりは自分で調節してくださいね♪(*^-^)ﾆｺ
さぁ、いかがでしょう？？？
これでますますうさびと楽しく遊べるかしら!!(o^-^o) ｳﾌｯ
こちらのコードを使用される方はこの記事にコメント、
またはトラバでお知らせいただけますようよろしくお願いします。＜(＿ ＿)＞
くれぐれもバックアップをお忘れなく!!
↓よろしくお願いします。＜(＿ ＿)＞
2006/08/09 17:51 追記
htmlファイルをアップロードしたときに
サーバスペースによっては周りに余白が出来てしまうようです。
その余白を無くす方法が
「yozoの気が向いたと記2.0」のyozoさんの
「BlogPet背景変更ボタンの作成と留守番背景の設置」の記事と、
「うさもの気が向いたと記」のyozoさんの
「BlogPet背景変更ボタンの作成と留守番背景の設置」にて公開されています。
同じ症状の方はぜひ行ってみてくださいね♪d(*⌒▽⌒*)b ﾆｺﾆｺｯ
2006/10/30 追記
XHTMLバージョンのソースにしてみました!!
詳しくは「BlogPet更新ボタンをバージョンアップ!!XHTMLバージョン」を
ご覧くださいね♪ヽ(=´▽`=)ノ
コメント
これはナイスなアイデアですね。めっちゃ助かりますよ。
[更新]をクリックすると、ブログ全体がリロードされちゃって、
なかなか、表示されないところもありますからね。
yozoのlivedoorもそうかも・・・(ＴｍＴ)ｳｩｩ･･･
iframeのひっぱってくる先でBlogPetだけを更新させるとは、グッドアイデアですよ。
たぶん、一番軽いのでは・・・というわけで、近々真似させていただきますので
よろしくお願いします。m(_ _)m
seesaaとlivedoorは急務ですからね。(*^-^)
Posted by yozo at 2006.08.07 18:37 | edit
おぉぉー！！すごいすごい！！
何回も押してしまいますねー。
色々な背景が見れるのもかなりポイント高いですよねっ☆
新しい背景がアップされたりしたら
色んなの見たいといつも思ってたんですよー。
ステキなアイデアですー！
Posted by babar at 2006.08.07 19:51 | edit
きょほほほほーーー早速遊んじゃいました♪
すごいすごい♪
いっぱい背景があって、くるくる変わっていくぅーーーー♪うふふふふ☆
これいいですねー♪スゴイなぁー♪
あ、、、ここに書くことじゃないかも知れないけど、
rara存続の危機を迎えているのです・・・。いろいろ考えちゃって・・・。うーーん・・・。
三千里の旅に出ようとしていた矢先にこんな事になってしまって・・・。
ううう・・・。落ち着いたら参加させてくださいねー!!!
早く行きたい気持ちは満々なのです・・・。うううう・・・。
悩み中のenuでした・・・。関係のないコメントになってしまってすいません・・・。
Posted by enu at 2006.08.07 19:52 | edit
凄すぎます！
これはｍ便利の玉手箱～～☆
ついつい、押しまくって遊んでしまいました。
表示も直に出てくるので、ストレスも無いですね。
背景のランダム表示をされている方たちには、
朗報かもしれませんね＾＾
ウン♪楽しいですねぇ～＾＾
Posted by 凸 ねこ at 2006.08.07 21:43 | edit
いつも背景のキャプを撮るときに、あったらいいなぁって思っていたのですよ!!
ずっと悩んでいたんですが、やっと出来ました。
ブログ自体が重いときはできるだけ更新したくないですからねー。
＞yozoのlivedoorもそうかも・・・(ＴｍＴ)ｳｩｩ･･･
まゆびもｌｉｖｅｄｏｏｒのほうをしなくっちゃ!!(笑)
でもあっちは背景が画像なので難しい。
＞たぶん、一番軽いのでは・・・というわけで、近々真似させていただきますので
＞よろしくお願いします。m(_ _)m
ぜひぜひー♪これでyozo家３姉妹と遊びやすくなりますー♪
三千里の旅も楽しめそうです♪(o^-^o) ｳﾌｯ
Posted by まゆび→yozoさんへ at 2006.08.07 21:51 | edit
すごいカスタマイズですね～(*´ω`*)ﾎﾟｯ
うさびちゃんもお客様に色々背景を披露できて喜んでいることでしょうね！
思わずFirefoxにブラウザを変えてポチポチ押しまくっちゃいましたよww
（どういうわけかsafariでは ”BACK GROUND NOW LOADING"のままなので；；）
まゆびさんこんなことまで出来ちゃうの尊敬(*´ω`*)ﾎﾟｯ
カスタマイズも奥が深いですね～♪
Posted by モンビッケ at 2006.08.07 22:08 | edit
すごーい！まゆびさま天才！感動です！
多頭飼いの切り替えをされてる方は知ってましたが、そこからこんなステキな手法を編み出すなんてステキです。
とても難しそうですが、ととろもこれから挑戦してみます。
これは是非とも完成させたい技ですね。あぁ、できるかしら、ととろに！
ではでは(^-^)ノ~
Posted by ととろ at 2006.08.07 22:09 | edit
早速遊んでいただけてよかったですー♪
実は設置したときはまゆびもクリックしまくりました!!(笑)
＞色々な背景が見れるのもかなりポイント高いですよねっ☆
ですよねー!!ランダム設定なのでたくさん設定してあるのですが、
ブログ全体を更新しなおそうと思うと、面倒だし、時間かかっちゃいますからね!!
背景はちょこちょこ入れ替えますのでぜひ楽しんでくださいね!!(*'ｰ')
うさびも喜びますわ♪(o^-^o) ｳﾌｯ
Posted by まゆび→ｂａｂａｒさんへ at 2006.08.07 22:14 | edit
ヾ(＠⌒▽⌒＠)ﾉﾜｰｲ! 早速遊んでくださってありがとうございます。＜(＿ ＿)＞
大体背景って２つ～３つくらいしか確認できませんよね。
ランダム背景はどうしても同じ背景が出ることもありますしね。
ぜひぜひ、うさびの背景を変えて楽しんでくださいませ♪(*^-^)ﾆｺ
＞rara存続の危機を迎えているのです・・・。いろいろ考えちゃって・・・。
yozoさんの移転と同じ理由かしら？？？
同じ理由なら、そのまま一切変更なしで使うか、
ブログを移転するか、別館の方へｒａｒａちゃんを移すかしかないかなぁ？
うーん。難しいですよねー。
ゆっくり考えて決めてくださいね!!
三千里の旅はもちろん時間のあるときに出てくださいね!!ヾ(=^▽^=)ノ
Posted by まゆび→enuさんへ at 2006.08.07 22:24 | edit
Ｏ(≧▽≦)Ｏ ﾜｰｲ♪ 褒めてもらえて嬉しいですー♪
そうそう、クリックしちゃうでしょ!!
まゆびも楽しくてクリックしまくっちゃったー。(爆)
表示も早いしとっても嬉しい!!
まぁ、アップロードしたところが重くなったらどうしようもないですが。。。
折角の素敵な背景、楽しみたいですからねー。
上手くいってよかったです♪o(*^▽^*)o~♪
Posted by まゆび→凸ねこさんへ at 2006.08.07 22:28 | edit
もうかなり時間をかけて頑張っちゃいましたよ!!
以前からアイディアは持っていたのに、なかなか実行にうつせなくて。。。
これでたくさんの背景を楽しむことができます♪(o^-^o) ｳﾌｯ
＞思わずFirefoxにブラウザを変えてポチポチ押しまくっちゃいましたよww
おぉぉ。うさびと遊んでいただいてありがとうございますー!!
ｓａｆａｒｉもダメなのかぁ。ブラウザによって背景がきちんと出ないものがありますねー。
＞まゆびさんこんなことまで出来ちゃうの尊敬(*´ω`*)ﾎﾟｯ
(//∇//(//∇//(//∇//) ﾃﾚﾃﾚ
でも時間がかかっちゃいましたけど。。。(苦笑)
本当にやりたいことがあるのに分からないことが多すぎてー。。。
勉強しないといけませんね!!
Posted by まゆび→モンビッケさんへ at 2006.08.07 22:34 | edit
＞すごーい！まゆびさま天才！感動です！
(//∇//(//∇//(//∇//) ﾃﾚﾃﾚ
嬉しい言葉をありがとうございます。＜(＿ ＿)＞
切り替えボタンがうらやましくてうらやましくて。(笑)
あのボタンをつけたら上手くいくかと思って真似したこともあったのですが、
ことごとく失敗しましたー。(笑)
＞とても難しそうですが、ととろもこれから挑戦してみます。
ぜひぜひ!!頑張ってみてくださいね!!
ぴょんちゃんに付けてもらえるとまゆびも嬉しいです♪(o^-^o) ｳﾌｯ
Posted by まゆび→ととろさんへ at 2006.08.07 22:39 | edit
今夜はこれしかやってません。巡回も何かも明日です（笑）
まだまだ私の方では表示が違うので直したい部分はありますが、どうしてもみていただきたくてアップしちゃった。是非是非、まゆびさまに教えを請いたいです。
あ～、それにしてもうれしい！なんて、すごいんでしょう！きっとまだやりたい事がいっぱいと仰ってみえたので、いろいろ飛び出してくるんじゃないかしら・・・ヾ(〃^∇^)ノ
Posted by ととろ at 2006.08.08 01:36 | edit
やっぱり他所様のブログでリロードしまくりは、気が引けるので...。
Posted by KOROPPY at 2006.08.08 08:51 | edit
リロードボタンって、なるほど、こういうことだったんですね～。
多数飼いでの切り替えにアイコンを使ってると、
かってに、ペットだけリロードしてくれてたので、考えたことなかったぁ。
アイコンのご利用、ありがとうございました。
そうそう・・
あと、コメント＆TBの件ですが・・
ほんとに、申し訳ない。。なんとか、修正しないとなぁ・・・と、思いつつ・・
反映されるまで時間がかかってしまうこと、お許しくださいませ。
m(。_。;))m ペコペコ…
Posted by mayu at 2006.08.08 14:09 | edit
トラバありがとうございました!!
早速試していただいて本当に嬉しいですー♪＜(＿ ＿)＞
ぴょんちゃんの背景＆フレームが楽しめて本当に嬉しいですわ♪
早くうさびかうさな、ぴょんちゃんのところへお出かけしないかしら～!!
最近お邪魔してないのよねぇ。残念。
やりたいことはいっぱいあるんですが、実力が伴いません。。。orz
まずはこのブログのカスタマイズに力を入れなければならないのですが。。。
うちのブログエラーだらけなのよ。(笑)
あぁ、時間が欲しいわ!!(*'ｰ')
Posted by まゆび→ととろさんへ at 2006.08.08 15:55 | edit
Ｏ(≧▽≦)Ｏ ﾜｰｲ♪ 背景楽しんでもらえてよかったです!!
以前からKOROPPYさん、ｍａｙｕさんなどなどの多頭飼いのところで
うらやましいなぁと思っていたのでした!!
まゆび自身も背景紹介のためのキャプを撮るときにすごく面倒だなぁと
思っていたので大満足です♪(o^-^o) ｳﾌｯ
Posted by まゆび→KOROPPYさんへ at 2006.08.08 15:57 | edit
す・す・すごいです(*＾▽＾*) 感激!!!
うさぎアイコンをクリックするたびに背景が変わるぅ＾＾
きゃわいい～～。楽しいぃ～。最高♪
また、お勉強されたのですね＾＾
まゆびちゃん、すごい o(^o^)o
Posted by ゆうゆ at 2006.08.08 16:04 | edit
そうなんですー。切り替えボタンがうらやましくてうらやましくて!!
ｍａｙｕさんのところでもポチポチクリックして楽しませてもらっていました!!(o^-^o) ｳﾌｯ
ウサゴロウちゃんの背景やフレーム、いつも楽しませてもらっています♪
いやいや、コメント＆トラバの件は気にしないでくださいね。
エラー画面が出なかったから多分入っているのだろうと思ったのですが、
一応掲示板でお知らせさせていただいたのでした。
こちらこそお手数かけてしまいすみません。＜(＿ ＿)＞
とても可愛いアイコンをありがとうございました♪
ますますうさびと遊ぶのが楽しくなっちゃいました♪(〃￣ω￣〃ゞ ｴﾍﾍ
Posted by まゆび→ｍａｙｕさんへ at 2006.08.08 16:05 | edit
おぉ。クリックしていただいて嬉しいですー♪
うさびもゆうゆさんと遊べて喜んでますわ♪
＞うさぎアイコンをクリックするたびに背景が変わるぅ＾＾
楽しくなっちゃってまゆびもクリックしまくりです。(爆)
かなり時間がかかったのですが、
完成してよかったです!!
＞まゆびちゃん、すごい o(^o^)o
ありがとうございます♪Ｏ(≧▽≦)Ｏ ﾜｰｲ♪
Posted by まゆび→ゆうゆさんへ at 2006.08.08 16:08 | edit
素人のととろがこんなに早く設置できたのはひとえにまゆびさまの解説の分かりやすさだと思いました。
きっとこれが完成するまでに時間を掛けて調整された事と思います。こんな恩恵にあずかることができてとてもうれしいです(*^^*)
こちらにTBも入れて下さってありがとうございました。
Posted by ととろ at 2006.08.08 19:28 | edit
いえいえ、喜んでいただけてよかったです!!(ﾟ-ﾟ*)(｡｡*)ｳﾝｳﾝ
解説分かりやすかったですか!!嬉しいですわ!!(o^-^o) ｳﾌｯ
ところどころどうやって説明したらいいのか悩んでしまいましたが。
本当に説明するのって難しいですねぇ。
＞きっとこれが完成するまでに時間を掛けて調整された事と思います。
時間はかかりましたが、勉強になりました。
やっぱりいろいろやってみるのって大切だなぁと実感しました。(*'ｰ')
よし、更新ボタンもついたことだしペットたちと遊ぶぞ!!(*ﾟ▽ﾟ)ﾉ
Posted by まゆび→ととろさんへ at 2006.08.08 22:58 | edit
yozoさんに、いつもお世話になっている、ろんちゃんと申します☆
yozoさんの記事から、まゆびさんのこの記事を読ませて頂きました！
これは凄いですね！まさに、私が日頃欲しいな～っと感じていたモノでした。
ただ、私はココログ＆カスタマイズに余り詳しくない者なので、実現可能かどうかは自信はありませんが・・・
この記事を参考に使用させて頂いた際には使用報告致しますので、どうぞよろしくお願いいたします。m(_ _)m
Posted by ろんちゃん at 2006.08.09 10:22 | edit
yozo様のブログと、ととろ様のブログから、今回のまゆびさまの更新ボタンを知りました。
こちらの記事を参考にしたら、上手く出来るようになりました。
本当にありがとうございますm(_ _)m
Posted by わたる at 2006.08.09 13:10 | edit
yozoさんのところから来ていただいたのですね!!
訪問＆コメントありがとうございます。＜(＿ ＿)＞
＞これは凄いですね！まさに、私が日頃欲しいな～っと感じていたモノでした。
以前からまゆびも何とかできないかなぁと悪戦苦闘しておりました。
すごく時間がかかってしまいました。。。(苦笑)
でも、これで楽しくBlogPetと遊ぶことが出来ます♪(o^-^o) ｳﾌｯ
時間があるときにでもぜひぜひお試しくださいね♪
成功を祈ってます!!ヽ(=´▽`=)ﾉ
Posted by まゆび→ろんちゃんさんへ at 2006.08.09 15:13 | edit
yozoさんとととろさんのところから来ていただいたのですね!!
ありがとうございます。＜(＿ ＿)＞
おぉ。設置できたのですね!!おめでとうございます!!
これでペットの背景をますます楽しむことが出来ますね!!
お役に立ててよかったです♪d(*⌒▽⌒*)b ﾆｺﾆｺｯ
Posted by まゆび→わたるさんへ at 2006.08.09 15:16 | edit
やっと何とか悪戦苦闘の末、BlogPetの更新ボタンの設置が出来ましたぁ～～！！
まゆびさんのブログに長い間居座ってしまいましたが、本当にありがとうございました！ m(_ _)m
とり急ぎ、使用報告させて頂きました☆
Posted by ろんちゃん at 2006.08.14 00:48 | edit
そして更新ボタン設置成功おめでとうございます!!
本当に良かったです!!
これで存分にペットの背景を楽しむことができますね!!(o^-^o) ｳﾌｯ
お役に立ててよかったですー♪ヾ(〃^∇^)ﾉわぁい♪
Posted by まゆび→ろんちゃんさんへ at 2006.08.14 10:41 | edit
遅ればせながら、わたしもまゆびさんの記事を参考に更新ボタンを設置してみました！すごく楽しくって、まず自分が楽しんじゃいましたよ(*'m')
本当に素晴らしいアイディアでしたね！！感謝感激です～♪
わたしの場合、テーブルなしで組んでみました。
あ、あと、iframeですが、idを付け加えたり、="～"という形にしておくとエラーが出づらくなるかと思います♪
トラックバックを送らせていただきました。
お時間あるときにでも遊びに来ていただけたらうれしいです♪
ではでは、また*'ー')ﾉ
Posted by mio at 2006.08.20 22:50 | edit
先にお邪魔してまいりましたー♪
本当に素敵なボタンがついていて
こうさちゃんも嬉しそうでした!!
新しい背景楽しませていただきましたよ!!
見たことのない背景もいっぱいありました!!
＞本当に素晴らしいアイディアでしたね！！感謝感激です～♪
いえいえ、お役に立ててよかったです!!
＞わたしの場合、テーブルなしで組んでみました。
おぉぉ。早くやらないとーー!!
テーブルなしの方が絶対いいですものね!!
頑張ります!!
＞iframeですが、idを付け加えたり、="～"という形にして
＞おくとエラーが出づらくなるかと思います♪
ありがとうございます!!
こちらも合わせて修正させていただきます!!
さぁ、うさび、うさなが遊びに行くの楽しみだわ♪
もしも行ったらいっぱい更新していろんな背景で
楽しませてもらいますね!!(o^-^o) ｳﾌｯ
Posted by まゆび→ｍｉｏさんへ at 2006.08.20 23:39 | edit
更新ボタンのコードを使用させていただきましたので、ご連絡に来ました。
とってもわかりやすくて、しかもブログペットだけの更新が簡単に出来るということで、すごくうれしいです。
ブログペットの素材サイトさまで、更新ボタンがあったので、自分もいつかはつけてみたい！と思っていたので、夢がかなってとてもうれしいです。
本当にありがとうございました！
Posted by アルシュ at 2006.09.14 15:02 | edit
こちらの記事がお役に立てたようで本当によかったです。
私は本当にたくさんの背景を使わせてもらっていて、
その背景をもっと楽しむためにはどうしたらいいのかしらと
ずっと考えていたのです。
BlogPetは背景設置の楽しみが本当に大きいですものね♪
アルシュさんもどんどんボタンクリックして
楽しんでくださいね♪(*^-^)ﾆｺ
Posted by まゆび→アルシュさんへ at 2006.09.14 15:50 | edit
念願だったブログペット背景更新ボタンを設定しました。
こちらの記事をお手本にさせて頂きましたので、トラバ入れましたので、ご報告いたします。
これからも宜しくお願いしますm(_ _)m
Posted by joey at 2006.11.08 20:56 | edit
トラバありがとうございました。(*- -)(*_ _)ペコリ
更新ボタン設置できてよかったですね。
これでランダム背景もますます楽しめることと思います。
dingoちゃんといっぱい遊んであげてくださいね!!
Posted by まゆび→joeyさんへ at 2006.11.08 23:04 | edit