もぜひご覧ください。
2005年12月3日 メロの世代交代等に対応させたMero Changerを公開しました。
2005年10月14日 「mayumayu's room お気楽Blog☆」で配布されている「ストラップ」の切り替えに対応したMero Changerをリリースしました。
2005年9月29日 スクリプト自動出力機能を搭載した「Mero Changer」をリリースしました。
JavaScriptを手動で書き換える必要がなくなり、設置が簡単になりましたので、こちらをお使いください。
2005年8月27日 Flashタブ対応版をリリースしました。
2005年8月17日 アイテムリスト対応版を公開しました。
メロの表示コード（メロコード）が変更になり、昨日のエントリーの通り、「Blog Parts Changer Light for メロ」も新コードに対応させました。
昨日はバージョンアップの手順を紹介しましたが、今日は新規に導入する際の手順を紹介します。
1.divタグを入れる
メロを表示する先のテンプレートを開き、メロを表示する位置（元々のメロコードを入れている位置）に、以下のタグを入れてください。
<div id="bpcl_mero"></div>
また、元々のメロコードは削除してください。
2.JavaScriptのダウンロード
こちらのページに接続してJavaScriptを表示し、内容をすべてコピーして、メモ帳等に貼り付けてください。
3.メロのkeyの設定
手順2.のJavaScriptの中で、3行目の「var mero_id = new Array('1つ目のkey', '2つ目のkey', '3つ目のkey');」の「1つ目のkey」「2つ目のkey」「3つ目のkey」を、メロの「key」に書き換えてください。
keyは、元々のメロ貼り付けスクリプトを見れば分かります。
スクリプトの最後の方に「・・・?key=○○○"></script>」という部分がありますが、「○○○」の部分（32文字の英数字）をコピーします。
例えば、それぞれのメロのkeyが「a1a1a1a1a1a1a1a1a1a1a1a1a1a1a1a1」「b2b2b2b2b2b2b2b2b2b2b2b2b2b2b2b2」「c3c3c3c3c3c3c3c3c3c3c3c3c3c3c3c3」の方の場合だと、以下のようにします。
var mero_id = new Array('a1a1a1a1a1a1a1a1a1a1a1a1a1a1a1a1', 'b2b2b2b2b2b2b2b2b2b2b2b2b2b2b2b2', 'c3c3c3c3c3c3c3c3c3c3c3c3c3c3c3c3');
また、メロを2種類だけ切り替える場合は、「, '3つ目のkey'」の部分を削除してください。
例えば、keyが「a1a1a1a1a1a1a1a1a1a1a1a1a1a1a1a1」「b2b2b2b2b2b2b2b2b2b2b2b2b2b2b2b2」の2つのメロを切り替え表示したい場合は、この行を以下のように書きます。
var mero_id = new Array('a1a1a1a1a1a1a1a1a1a1a1a1a1a1a1a1', 'b2b2b2b2b2b2b2b2b2b2b2b2b2b2b2b2');
4.タブの差し替え
メロのタブを自分の好きなものに変えたい場合は、スクリプトの4行目と5行目を書き換えます。
・4行目「var mero_mouseout_img = new Array(・・・);」
・5行目「var mero_mouseover_img = new Array(・・・);」
4行目には、タブをマウスで指していないときの画像のURLを指定します。
また、5行目には、、タブをマウスで指しているときの画像のURLを指定します。
それぞれURLを入れるところが3つありますが、１つ目～3つ目のそれぞれのメロに対応しています。
5.ランダム表示の設定
メロをランダムに表示させたい場合は、以下の2箇所を設定します。
・7行目「var mero_first_no = -1;」
ページを開いたときに、最初に表示するメロを指定します。
このまま変更しないと、ページを開くたびにメロがランダムに選ばれて表示されます。
ランダムではなく、常に1つ目のメロを表示する場合は、最後の「-1」を「0」に変えてください。
また、2つ目のメロなら「1」、3つ目のメロなら「2」に変えてください。
・8行目「var mero_interval = 30000;」
ページを開いている間にも、メロをランダムに切り替えて表示するかどうかを指定します。
このまま変更しないと、30秒ごとに切り替え表示します。
「30000」のところを変えると、切り替えの間隔が変わります（1000分の1秒単位です）。
例えば、1分（60秒）おきに切り替え表示するなら、ここを「60000」に変えます。
また、ここを「0」にすると、ページ表示中のランダム表示は行いません。
6.JavaScriptの貼り付け
手順1.のdivタグの後に、ここまでで設定したJavaScriptを貼り付けてください。
7.メロ切り替えリンクの貼り付け
手順6.のJavaScriptの後に、メロを切り替えるためのリンクとして、以下を貼り付けてください。
「1つ目のメロの名前」等の部分は、ご自分のメロに合わせて変えていただくことができます。
<a href="#" onclick="show_mero_main(0); return false;">1つ目のメロの名前</a> <a href="#" onclick="show_mero_main(1); return false;">2つ目のメロの名前</a> <a href="#" onclick="show_mero_main(2); return false;">3つ目のメロの名前</a>
8.ランダム表示オン／オフ切り替えチェックボックスの貼り付け
ページ表示中にメロをランダム切り替え表示するようにすると、コメントの入力に支障が出ることがあります。
その場合は、ランダム表示のオン／オフを切り替えられるように、チェックボックスをつけておくことをお勧めします。
手順7.のリンクの下のあたりに、以下のHTMLを追加してください。
<form name="bpcl_mero_random">
<p><input type="checkbox" checked name="random" onClick="if (document.bpcl_mero_random.random.checked) { mero_random_on(); } else { mero_random_off(); }"
>ランダム表示</p>
</form>
なお、Movable Typeなどのように、テンプレートを自由に編集できる場合は、チェックボックスを使わずに、コメント入力フォームのあるテンプレート（通常は個別アーカイブテンプレート）では、ランダム表示を無条件にオフにする方が良いでしょう。
対象のテンプレートを開き、手順6.のJavaScriptの後に、以下のJavaScriptを入れます。
<script language="javascript" type="text/javascript"> <!-- mero_random_off(); //--> </script>
9.クレジットバナーの貼り付け
「Blog Parts Changer Light for メロ」のクレジットバナーを作っていただきました。
ご自分のBlogに、クレジットバナーを貼り付けていただければ幸いです。
貼り付け方はこちらを参照してください。
10.注意事項
設置の際には以下の点にご注意ください。
・改行の自動変換をオフにする
レンタルBlogでは、「自由なHTMLを追加する」といった機能を使って設置することになります。
その際、「改行を自動的にbrタグに変換する」というような設定項目があったら、それはオフにしてください。
・Macをお使いの方
上記の2.の手順でJavaScriptをダウンロードする際には、Safariは使わないでください（文字化けが起こるため）。
FireFox等の他のWebブラウザをお使いください。
コメントはスレッド表示になっています。
また、スレッドの先頭のコメントに対する返信には、先頭に矢印を表示しています。
こんにちわ。
meromeroparkを2ﾊﾟﾀｰﾝ作ったのですが、うまく表示できません。どこがいけないのでしょうか？？
お忙しいとは思いますが、見てください！！
こんにちわ。
meromeroparkを2ﾊﾟﾀｰﾝ作ったのですが、うまく表示できません。どこがいけないのでしょうか？？
お忙しいとは思いますが、見てください！！
＞ぼぅママさん
こんにちは。
以下の点を修正してください。
1.既存のメロコードを削除して、その代わりに<div id="bpcl_mero"></div>のタグを入れてください。
2.Blog Parts Changer Light forメロのスクリプトが入っていないようです。
1.のdivタグの後に、スクリプトを貼り付けてください。
こんばんは。
壱さんの手順でやってみたのですが、やっぱり表示できませんです･･･
どこがいけないのでしょうか？
＞ぼぅママさん
こんばんは。
以下の2箇所を修正してください。
1.メロのkeyを指定する行で、最後の「);」の前に余分な「,」が入っていますので、それを削除してください。
2.メロの切り替えのリンクを表示する部分を、以下のようにしてください。
<div style="background:url(http://www.geocities.jp/syuuyu222/sozai/m_bg02.gif) no-repeat center;width:140px;height:45px;padding:9px 0px 5px;margin:5px auto;text-align:center;">
<a href="javascript:show_mero_main(0);"><img src="http://www.geocities.jp/syuuyu222/sozai/merolin10.gif" onmouseover="this.src='http://www.geocities.jp/syuuyu222/sozai/merolin11.gif'" onmouseout="this.src='http://www.geocities.jp/syuuyu222/sozai/merolin12.gif'" width="40" height="31" alt="メロリン" border="0"></a><a href="javascript:show_mero_main(1);"><img src="http://www.geocities.jp/syuuyu222/sozai/mofmof10.gif" onmouseover="this.src='http://www.geocities.jp/syuuyu222/sozai/mofmof11.gif'" onmouseout="this.src='http://www.geocities.jp/syuuyu222/sozai/mofmof12.gif'" width="40" height="31" alt="モフモフ" border="0"></a></div>
初めまして☆
今回この記事を参考にさせてもらいました♪
最初読んだときは難しくてきっとできないなぁって思っていたんですが、やってみたらとっても親切に書いてあるのでわかりやすくすぐにできましたぁ！
質問なのですが、今のところメロ画面の下にある名前をクリックするとメロが切り替えになるんですがこの名前の部分を画像にする場合は手順７のメロの名前の部分を画像のＵＲＬにすればいいんでしょうか？
画像の貼り付け方がいまいちわからないのですが…
お時間があれば教えてください。お願いします。
＞さやかさん
こんにちは。
メロの名前の部分を画像にするには、名前の代わりに以下のようなものを入れてください。
<img src="画像のURL" border="0">
お早いお返事ありがとうございます☆
頑張ってやってみます!!
何度もスミマセン。
初歩的な質問なんですが、
画像のＵＲＬってどうやって調べれば良いのですか？
コメントありがとうございます☆
せっかく教えていただいたのに結局わからずあきらめました…。
でもいい勉強になりました！
ありがとうございます。
新コードになったんで、ぇ━(*´･д･)━!!!どーする？と思ったんです。
でも壱さんの対応が早いので助かりました。
早速、使ってます。
ありがとうございました！
以前もBlogpetの切り替えでお世話になった者です。
メロも３匹飼い、切り替えをやってみたのですが
どうもうまく動かないようです。
どこが悪いのかわからず、
申し訳ありませんがお時間がある時でかまわないので教えていただけないでしょうか？
＞ちひろさん
こんにちは。
そちらのページを拝見しましたが、左サイドバーの最後の方に以下の行がありました。
<div id="bpcl_mero" align="center">
この行を削除すれば、正しく表示できると思います。
わー、素早いレスありがとうございます。
なんでしょ、いつの間に入れちゃったんでしょう。
削除したら設置できました。
何から何までありがとうございました。
記事にさせてもらい、ＴＢを送ろうとしてるのですが
うまくいかないようです。
申し訳ありません。
ブログでＵＲＬを貼り、紹介させていただきました。
ありがとうございました。
初めまして。
メロが２パターンのを作ったんですが、うまく表示されません。
どこがダメなのでしょうか？
申し訳ありませんが、教えていただけませんか？
お忙しいのに、すいません。
＞瞳さん
こんにちは。
ご質問の件についてメールをお送りしました。
すいません。
届きません。
申し訳ございませんが、
ここでおねがいします。
＞瞳さん
こんにちは。
現在貼り付けられているスクリプトの中で、「function show_mero_sub(id) { ・・・return html; }」の部分をいったん削除してください。
そして、以下のアドレスを開いて、「function show_mero_sub(id) { ・・・return html; }」の部分をコピーし、先程削除したものの代わりに貼り付けてください。
http://www.h-fj.com/scripts/bpcl_mero_new.html
スクリプトお借りします(o*｡_｡)oペコッ
〃⌒ー⌒〃 ｳﾚｼｲ～☆・:.;*
すみません。
書き込み遅れました。
変換しました。
大変丁寧に教えていただきありがとうございました。
すみません。
書き込み遅れました。
変換しました。
大変丁寧に教えていただきありがとうございました。
すみません。
書き込み遅れました。
変換しました。
大変丁寧に教えていただきありがとうございました。
↑すいません。
パソコン調子が悪くて・・・。
アメブロでのメロ切替についての記事での紹介と、TBさせていただきましたので、ご報告させていただきます。
それと質問ですが、このスクリプトを改造して自ブログに公開することは可能でしょうか？（元のスクリプトはこちらで配布されている旨は記載します）
ご検討の程よろしくお願いします。
メロ切り替えをしたくて、昨日１日がんばってみましたが、設定をすると、ページでエラーが発生しました！が出て、メロパは表示されず、３匹の名前だけが出ます。それらをクリックしてもやはり、ページでエラーが・・・と出ます。たぶん何かが間違っているのでしょうが、素人なので、どこがどう間違っているのかわかりません。今はなにも変更せずに、前のままになっています。なんとか他の２匹も、切り替えで見られるようにしたいのですが、アドバイスお願い出来ますか？
＞みれママさん
こんにちは。
ページエラーになっている状態を見れば、どこが間違っているかを調べることができます。
お手数ですが、ページエラーが出る状態に戻して、もう一度ご連絡ください。
早速のお返事ありがとうございます。トップページに設定してみました。
こんな設定・・・と笑われちゃうかな？すいません、素人なんで、よろしくお願いします。
＞みれママさん
こんにちは。
トップページを拝見しました。
マウスオーバー時のタブ画像を設定する行に間違いがあります。
今の時点では以下のようになっています。
var mero_mouseover_img = new Array('http://mirea.seesaa.net/image/meropa04.gif'', 'http://mirea.seesaa.net/image/meropa04.gif'', 'http://mirea.seesaa.net/image/meropa04.gif'');
それぞれのURLの後に「''」がありますが、これを「'」に変えてください。
これで表示できるようになります。
ありがとうございました！
無事表示されるようになりました♪
思い切って聞いてよかったです。
はじめまして。
突然ですが、質問があります。
雑日記さんのFLASH看板（メロパタブ）を
使用して、メロ切り替えをしたいのですが、
どこを手直しすれば切り替えできるようになるのでしょうか？
自分でいろいろ試してみたが、うまくいきませんでした。
教えて下さい。
よろしくお願いします。
＞EMAさん
こんにちは。
現状のBlog Parts Changer Light for メロでは、Flash形式のタブには対応していません。
対応版は後日公開したいと思います。
そうでしたか。
ＦＬＡＳＨ対応版が公開されることを
楽しみにしています。
頑張ってください。
先日こちらのスクリプトをお借りし楽しくメロライフを過ごしてます♪（間違ってコメントを別の所に書いてしまいましたけど…汗）質問なんですが、、バナーは自作でも構いませんでしょうか？もし不都合でしたら外しますので、よろしくお願いします。
先日こちらのスクリプトをお借りし楽しくメロライフを過ごしてます♪（間違ってコメントを別の所に書いてしまいましたけど…汗）質問なんですが、、バナーは自作でも構いませんでしょうか？もし不都合でしたら外しますので、よろしくお願いします。
また、すいません。
お忙しいのに。
テンプレートを改造していたら
保存してあった、メロのコード
が消えてしまいました。
また、お時間あったら教えていただけませんか？
はじめまして。
こちらの記事を参考にさせていただいたお陰で
メロの３匹飼いが実現しました。
ありがとうございました♪
初めまして。
今日こちらの記事を発見してさっそくやってみたのですが、
何故か肝心のメロの部分が表示されないのです。
何故でしょうか？？
間違っている所がありましたら教えて下さると光栄です。
お忙しいかと思いますが、宜しくお願い致します。
先日書き込みしたものです。
今日見てみたらきちんと表示されていました。
大変お騒がせしました。
そして素敵なブログをありがとうございます！！
これからも頑張ってください♪
メロ切り替えをお借りしているのですが､上部メロメロパークへのリンクタブとメロ表示部分に隙間が出来てしまいます。どうすれば、隙間を解消できるでしょうか？
お返事ありがとうございます。
あれから、テンプレを作り直し無事隙間対策できました。
ご迷惑掛けてしまって誠に済みませんでした。
本当にありがとうございました。
初めましておはようございます。
トーコさんから教えていただいてこちらに参りました。
メロを２匹飼いたくメロチェンジが出来るようにしたいと色々勉強しました。とりあえず、アイコン＋背景をお借りし、設置しましたが、そこにメロを切り替える為の仕方が分からず、こちらに参りました。
しかし、初心者ゆえあまり理解できずに解らないことがありまして・・・
もしよろしければ教えていただきたくコメントさせていただきました。
まず一つ目・・・
「メロを表示する先のテンプレートを開き・・・」
という文章ですが、やり方がさっぱり解らず・・・テンプレートを調べたのですが、何のことかちょっとわからなかったんです。
メロパを設置しているブログのテンプレートですよね？テンプレートってどうやってみればいいんでしょうか？教えていただけませんでしょうか？
２つ目・・・
「メロのタブを自分の好きなものに変えたい場合は・・・」
これは一体どのことを言っているのでしょうか？
メロを切り替えるアイコンのことですか？
私がお借りしているアイコンは動くようになってて、３つの画像からなっているんです。なので、どのアイコンのURLを入れればいいのか解らないんですが、どうすればいいでしょうか？
まずは、この２点がわかりません。ご迷惑とは思いますが、教えていただいてもよろしいでしょうか？
どうぞよろしくお願いします。
＞ぱんだこさん
こんにちは。
まず「テンプレート」ですが、ヤプログでは「機能追加」に該当します。
そちらのBlogでは、機能追加でメロコードを2つ貼り付けていらっしゃいますが、それらのメロコードを削除して、代わりにBlog Parts Changerのスクリプトを貼り付けてください。
また、「タブ」とは、メロの一番上に表示される「meromero park」の文字の部分のことです。
それでは、がんばって設置してください。
はじめまして。
こんばんわ。
設置をしてみたのですが、
うまく表示されていません。
どうすれば良いのでしょうか。
＞アカネさん
こんにちは。
以下の３箇所で「'」が抜けています。
1.メロのキーを指定する行(var mero_id = ・・・）で、2つ目のメロのキーの前
2.通常時のタブ画像を指定する行（var mero_mouseout_img = ・・・）で、1つ目のタブ画像の前
3.マウスオーバー時のタブ画像を指定する行（var mero_mouseover_img = ・・・）で、1つ目のタブ画像の後
ありがとうございます！！
なおりました！！
本当にありがとうございます。
こんにちは。
以前こちらに質問＆コメントしたものです。
どういうわけか、前にこちらでコメントして以来、
誰かがこの記事にコメントする度に私のﾒｱﾄﾞに
メールが届くようになってしまいました。
メールが送られないようにするにはどうしたら良いでしょうか？
ご迷惑おかけして申し訳ありません。
よろしくお願い致します。
はじめまして！本日
メロチェン参考にして設置させていただきました！！
メロチェンは無事に設置できたのですが設置したせいかテンプレートが右にずれてしまいどうしたものかと悩んでおります。
やはり設置したせいで崩れてしまったのでしょうか？
お時間があったらご指導よろしくお願い致します！
＞pikaりんこさん
こんにちは。
そちらのページを拝見しましたが、Blog Parts Changer以外の部分で、タグが正しくないところが多数あるようです。
申し訳ありませんが、大掛かりに修正しないと直りそうにありません。
壱さんさっそくのレスありがとうございました。
そうですかそんなに沢山･･･
なんせド素人なもんで･･･
Blog Parts Changerは大丈夫なのですよね？？
はじめまして☆メロ切り替えをお借り致します。分かり易いご説明だったので自分でもなんとか設置することが出来ました☆しかも、今こちらで「白い花のタネ」もゲット出来ましたｗ嬉しいです。ありがとうございました＾＾
はじめまして。
メロを２匹育てたくて色々調べていましたら、こちらの記事に出会いました。
早速試してみたのですが、どうしてもメロの名前だけがでて
画像が×印になってしまします。
どこがおかしいのかもわからなくて・・・良かったら対応策を教えていただけませんか？？
お忙しいのにすみません・・・。
＞リックンママさん
こんにちは。
メロのキーを指定するところで、1つ目のメロのキーの後の「'」が抜けています。
すごく早い対応でありがとうございました！！
いつのまにか「’」を消してしまっていたみたいです・・・
お手数おかけしました。
はじめまして。
トラバを遅らせて頂いたcocoと申します。
色々なものへ対応したBlog Parts Changerがあり迷いましたが、今回はこちらのスクリプトをお借りしました。
ありがとうございます
初めまして。
Changerをお借りしたので、TBさせていただきました。
お借りする以前に自分で何とかメロの切り替えをしようとしたのですが、無理でした
そのため、貴ブログからChangerを借りて無事に設置できたときには、本当に嬉しかったです。
ありがとうございます
はじめまして。
このたび2匹目のメロを飼うことになったので、
こちらのBlog Parts Changerをお借りしました。
あまりPCに詳しいほうではなく、理解するのに時間がかかりましたが、
何とか設置することができました。
ありがとうございました。
＞Mayumi♪さん
こんにちは。スクリプトご利用ありがとうございます。
なお、現在はこのスクリプトに代わって「Mero Changer」を出しています。
http://www.h-fj.com/blog/archives/2005/12/03-005100.php
Webページ上で設定を行うと、スクリプトが自動で出力されるようになっています。
今後はMero Changerをお使いください。
ﾒﾛを2匹にしたので、スクリプトいただきました♪
先のコメントで紹介していただいてある自動出力のほうは、
私には、ちゃんと設定できているのか判断できなかったので、こちらを利用させていただきました。
また何かあったときは、利用させていただきますので、よろしくお願いします
＞さやかさん
こんにちは。
スクリプトご利用ありがとうございました。
こんばんわ (*^^)
やっとランダム表示出来るようになりました
どうもありがとうこざいます。
初めまして
メロメロの切り替えについて質問させてください。
1つ目のメロの名前
~~~と３個のメロまで続くんですけど。。。
表示はされているんですが、another HTMLでチェックしたところ、a herf="～"のアンカー名が不明ですと出ます。
アンカー名。。。すみません。。。分からず。。。
教えていたでけますか？
すみませんがよろしくお願いいたします。
同一ページ内の他の箇所にリンクする際に、リンク先の箇所に名前（アンカー名）をつけておき、リンク元のaタグで「href="アドレス#アンカー名"」のようにすることで、その箇所にリンクすることができます。
Mero Changerでは、メロを切り替えて表示するために、リンク先として「#」だけを指定しています。
そのため、Another HTML Lintがエラーだと判断しています。
ありがとうございます。
http://～
のあとに、そのままＢＬＯＧのアドレスを貼り付けました。そしたら、エラーはでなくなりました。