Javaスクリプトの設置に関して、よくある質問やトラブル事例を載せています。
よくある質問
目次
■使える環境について■
■レイアウトについて■
■カスタマイズについて■
- ■犬猫年齢（人間に換算すると何歳）を表示するには。
- ■年齢表示で、月までは表示したいのですが、日にちまでは表示したくありません
- ■「生まれて100日目」など、日数の表示を付け加えたい。
- ■文字のサイズや色を直したい
- ■最後についてるリンク(script by KT)を消して、違うところに書いてはいけないでしょうか？
- ■誕生日以外のカウントダウンに使いたいのですが…
■表示の不具合について■
関係者以外は非公開のサイト・ブログですが、確認できないとまずいですか？
非公開ページでも問題ありません。基本的にスクリプトの使用にあたって、こちらで確認を求めることはありませんので、お気兼ねなくお使いください。ご連絡も不要です。
利用規約に反しない限り、ご自由にしてくださってＯＫです。
もし利用規約に違反していないかご心配でしたら、気になる点をメールフォームなどからご連絡ください。
携帯電話で表示できますか？
携帯電話はよくわからないので、以下は話半分でお願いします…（ごめんなさい）
- 携帯サイトでは基本的に使用できないようです。
- パソコン用サイトを表示できる携帯電話の場合、各携帯電話に搭載されているブラウザの種類によって、JavaScriptが動作するかどうか違うようです（フルブラウザでもJavaアプリ系では動作しないとか…）
⇒wikipedia - 携帯での表示は保証できませんが、一応SoftBank3G（810T)では表示されました。
- FC2ブログには、携帯で閲覧するときに表示するプラグインを設定できる「モバイルプラグイン」という機能があり、JavaScriptを使用できます。ただし2000文字程度の文字制限がかかっているので、設置できるのは2000文字以下のスクリプトになります。
（2008/12/5記）
横に２つ（３つ）並べて表示するには？
テーブルタグか、cssで行います。
- ★２つ並べる（テーブルタグ）
- <table border="0" cellspacing="5">
<tbody><tr><td>
■ここにスクリプトを入れる（左側）■
</td><td>
■ここにスクリプトを入れる（右側）■
</td></tr></tbody></table>
- ★３つ並べる（テーブルタグ）
- <table border="0" cellspacing="5">
<tbody><tr><td>
■ここにスクリプトを入れる（左側）■
</td><td>
■ここにスクリプトを入れる（中央）■
</td><td>
■ここにスクリプトを入れる（右側）■
</td></tr></tbody></table>
- <td>〜</td>を</tr>の前に貼り付ければもっと増やせます。
- ★２つ並べる（CSSのフロートを使う）
- <div style="width:400px;">
<div style="width:50%;float:left;">■ここにスクリプトを入れる（左側）■</div>
<div style="width:50%;float:right;">■ここにスクリプトを入れる（右側）■</div>
<div style="clear:both;"></div>
</div>
- ★３つ並べる（CSSのフロートを使う）
- <div style="width:600px;">
<div style="width:200px;float:left;">■ここにスクリプトを入れる（左側）■</div>
<div style="width:200px;float:right;">■ここにスクリプトを入れる（右側）■</div>
<div>■ここにスクリプトを入れる（中央）</div>
<div style="clear:both;"></div>
</div>
センタリング（中央揃え）したいのですが。
「いくつになったの」「誕生日カウントダウン」「WeddingAnniversary」「My baby comes」は、スクリプト内に設定があるので、そこで調整してください。
その他のスクリプトの場合、ホームページ作成ソフトであれば、スクリプト全体を選択後、普通のテキストをセンタリングするのと同じように設定してください。
ブログなどは、スクリプトをスタイルコンテナで囲みます。
<SCRIPT type="text/JavaScript">
…
</SCRIPT>
</div>
横に並べたスクリプト全体をセンタリング（中央揃え）したい。
横にスクリプトを並べた場合、tableやdivなどで作った「枠」に対してセンタリングの設定をしないといけません。
枠（ブロック要素といいます）に対するセンタリングは、文字（インライン要素）のセンタリングよりちょっとややこしくなります。
まずtableタグに
style="margin-left:auto;margin-right:auto;"
と追加します。（左右のマージンを自動調整する設定です。）
ただ、ブラウザがIEの場合はこれではセンタリングされません。そこで更に、枠を
<div style="text-align:center;">と</div>で囲みます。
- 具体的には、このようになります。↓
- ★テーブルタグの場合
- <div style="text-align:center;">
<table border="0" cellspacing="5" style="margin-left:auto;margin-right:auto;">
<tr><td>
■ここにスクリプトを入れる（左側）■
</td><td>
■ここにスクリプトを入れる（右側）■
</td></tr></table>
</div>
- ★CSSの場合
- <div style="text-align:center;">
<div style="width:400px; margin-left:auto;margin-right:auto;">
<div style="width:50%;float:left;">■ここにスクリプトを入れる（左側）■</div>
<div style="width:50%;float:right;">■ここにスクリプトを入れる（右側）■</div>
<div style="clear:both;"></div>
</div>
</div>
犬猫年齢（人間に換算すると何歳）を表示するには。
ブチ様のブログ「駒とチャイ」様にて、「いくつになったの」に挿入する追加スクリプトが配布されています。
「いくつになったの」の表示に加え、人間だったら何歳くらい…と表示されます。猫もOK♪
年齢表示で、月までは表示したいのですが、日にちまでは表示したくありません。
いくつになったの？ECの場合
var age0=namae+"は";
var age1=ysf+"歳";
var age2=msf+"ヶ月";
var age3=dsf+"日";
…
var age7="ちょうど"; /* 0日のときage3の代わりに表示 */
var age7="";
「生まれて100日目」など、日数の表示を付け加えたい。
「いくつになったの」などの３行目に、何日目かの表示を付け加える方法です。
お名前は2歳6ヶ月30日♪
●3歳の誕生日まで154日●
●生まれて943日目●
いくつになったのEC「追加スクリプトの挿入」欄に、下記をコピーして貼り付けてください。
var countup=Math.ceil((tday.getTime()-new Date(by,bm-1,bd).getTime())/(24*60*60*1000));
countup=""+countup;countup=countup.fontcolor(ac);
if (bold>0) countup=countup.bold();
var days=pre0+"生まれて"+countup+"日目"+pre0;
var output=output+kai+Sc1+days.fontcolor(bc)+Sc0;
webサイト/ブログに貼り付けた後のスクリプトに挿入するのであれば、
【注】生まれた当日は、１日目と数えます。
生後の経過日数にする場合（生まれた当日は0日目とする場合）は、ceilをfloorと書き変えてください。
文字のサイズや色を直したい
他のスクリプトは下記を参考にしてください。
ホームページビルダーの場合
ページ編集画面で、{S} と表示されるのがJavaスクリプトです。これを選択して、普通の文字と同じようにフォント設定またはスタイル設定をします。
ブログの場合
スクリプトをスタイルコンテナで囲みます。
<script type="text/javascript">
…
</script>
</div>
※divタグは前後で改行されます。スクリプトの前後で改行したくない場合、「div」の代わりに「span」と書いてください。
※#666666はフォントの色、12pxがフォントのサイズです。どちらも適宜書き換えてください。
最後についてるリンク(script by KT)を消して、違うところに書いてはいけないでしょうか？
- ブログの場合
- ご遠慮ください。
テキストリンクは、スクリプトと同一の入力欄内に貼り付けてくださるようお願いします。ただし、同一欄内であれば位置の移動はＯＫです。（スクリプトから離して欄の一番下に表示するなど） - ひとつの欄に複数のスクリプトを表示する場合、表示するテキストリンクは１つだけで構いません。
- ブログ以外のwebサイトの場合
- 同一のページ（ファイル）内であれば移動して構いません。フレームを使用している場合、別ページや別フレームではなく、必ず同じページに貼り付けること、できるだけスクリプトと同時に表示されるようにお願いします。
誕生日以外のカウントダウンに使いたいのですが…
スクリプトの使い道は、ご自由にどうぞ。
誕生日用のカウントダウンは、「毎年巡ってくる、年に一度の記念日」用に作成しているものなので、それに準じた使い方であれば機能的に問題はありません。ただ、イベント・入試・挙式など、未来の日付へのカウントダウンにはその機能上、使用すると表示がおかしくなる場合がありますのでオススメしません。
表示されないとき
お問い合わせで最も多いのが、
「貼り付けたのに、何も表示されません」
「テキストリンク(script by KT）だけが表示されます」
というものです。
よくある原因と対処法を載せましたので、当てはまるものが無いかチェックしてみてくださいね。
[5.]の辺りまでが多いケースです。
[1.] ご利用のホームページ/ブログでは、JavaScriptが使用できますか？
大前提として、JavaScriptの使用が制限されているホームページやブログでは、使用できません。
（ブログの場合は、ブログパーツが自由に貼れるなら多分大丈夫です。）
■どんなHP・ブログにも設置できますか？を参考にご確認ください。
[2.] プロフィール欄など、改行が反映される入力欄に貼り付けていませんか？
ブログに表示されない原因で、最も多いのがこのケースです。
プロフィール専用の入力欄に貼り付けると、自動改行によってエラーが生じます。
プロフィール欄に限らず、HTMLタグ使用可の入力欄で「改行は反映されます」「改行を改行タグ<BR>に自動変換する」など書かれていれば同様です。
詳しくは■ブログのプロフィール欄に貼り付けたけれど表示されません をご覧ください。
[3.] プレビュー画面だけで確認していませんか？
ブログのプレビュー画面では反映されないこともありますので、設定後、実際の画面を確認してください。
[4.] 設定項目の書き換え方は合っていますか？
FC2ブログの共有プラグインで設置するときに最も多い間違いです。
- 生年月日の区切り記号まで削除してしまって、コンマ( , )ではなくピリオド( . )に書き変えてしまっていませんか。
- 色コードの指定方式は正しいですか。#が２つあったり、数字が7桁だったりしていませんか。（正しくは#は1個、数字は6桁です）
- 半角英数字で、と指定されている文字を全角英数字で書いていませんか。
●半角→abcdefg123456789
●全角→ａｂｃｄｅｆｇ１２３４５６７８９０
[5.] メッセージ設定の書き換え方は合っていますか？
- メッセージ設定で、「"」「,」「+」「;」などの制御記号まで削除していませんか。
動作に影響しない範囲で書き変えたり削除したりできるのは、説明の赤い文字列の部分だけです。 - メッセージ中に半角の「"」（ダブルクォーテーション）を使用していませんか。
スクリプト内で半角「"」は文字列の開始と終了を表す記号ですので、メッセージ中で使用する場合は全角「”」にするか、エスケープ記号をつけて「\"」(\は表示されません）としてください。 - 制御記号は１文字欠けただけで動作しませんので、書き変えは慎重に。
[6.] スクリプトの一部が欠損したり、余分な部分が加わっていませんか？
- コピーするとき、ソースが全部選択されていますか。「<」や「>」を取りこぼしていませんか。
- 貼り付けをやり直すとき、前のスクリプトはきちんと削除しましたか。スクリプトを完全に削除しないまま、また貼り付けると、動作しません。
[7.] 貼り付けた時、ソースの一部が書き変わっていませんか？
- ソースを書き換える（編集する）時にテキストエディタを使用して、そこからコピーしてHTMLやブログ入力欄に貼り付けたとき、スクリプト中の記号が削除されたり別の記号に置き換わることがあります。（場合によってはメモ帳でも起こることがあるらしいです。）
もしこのような症状に気付いたら、名前や生年月日などを書き換えるとき、テキストエディタを使用せずに、入力欄やHTML中に直接貼り付けて編集してみてください。 - AutoPage（TeaCupブログ）では、設定保存時に半角アポストロフィ「'」が抜けてしまいます。スクリプト中で「'」は使用していませんが、カスタマイズする時はご注意ください。
[8.] MacOSをお使いですか？
- Macではコピー＆ペーストの際に「\」が「?」に書き換わることがあります。スクリプト中に「\"」が使用されている場合は「'」に置換してください。
- スクリプト中で改行タグを使用する際、文字列として記入した"<BR>"が、そのままタグとして認識され改行されてしまうことがあります。
スクリプト中では、var kai="<B"+"R />"; として回避しています。
[9.] ブラウザはJavaScriptに対応していますか？
対応していないと、当サイトのものはおろかほとんどのブログパーツが表示されないので、これは無い気がしますが一応(^^;)
閲覧側ブラウザの設定でJavaをオフ（無効）にしていたり、ウィンドウズXPでJavaVMが導入されていなかったり、JavaScriptに対応していないブラウザではスクリプトは表示されません。
当方ではWindows版のIE6.0、NN7.1、Opera9.0にて表示・動作を確認しています。
JavaScriptを有効にする設定方法は、「園部研」様で紹介されています。
【注意】ブラウザのセキュリティレベルの変更を伴いますので、自己責任でお願いいたします。
テキストリンク（*script by KT*）が無いのですが…
配布しているスクリプトには、テキストリンクが付いているもの（リンクウェア）と付いていないものがあります。
リンクウェアにつきましてはテキストリンクの表示を必須とさせていただいています。
表示されていないと規約違反となりますのでご注意ください。
リンクウェア「いくつになったの」「Wedding Anniversary」「My baby comes」の場合
表示されない原因としては、
スクリプトをコピーするときのコピー漏れで貼り付けられていない。
タグは貼り付けられているが、設定した色が設置したページで設定されている「テキスト（文字）リンクの色（a:link）」が、設置した場所の「背景色（background)」と同じ色であったり、よく似た色であるために見えにくいと考えられます。
（ヤプログに設置する場合、スクリプトをサイドバー用のHTMLソースに入れないと、背景色と同化することがあります。⇒こちらを参考に設置してください）
リンクが見えにくい場合、テキストリンク部分のソースを、下のソースと差し替えてご使用下さい。（テキストリンクの色やサイズは、ページのデザインに合わせて変更していただいて構いませんが、わざと見えにくくする行為はご遠慮下さいね。）
*script by KT*
*script by KT*
リンクウェア以外の場合
上記以外のスクリプトは、リンクウェアではありませんので、テキストリンクを付けて使う必要がありません。そのままお使いくださって構いません。
設置したらブログのレイアウトが崩れてしまいました。
スクリプトの横幅はサイズを指定していませんので、貼り付けた場所の枠内に自動的に収まるようになっています。しかし貼り付けたページのスタイルシート(CSS)の設定によっては、ブログのカラムに設定された幅をオーバーし、カラムごと下にずれる（カラム落ちする）ことがあります。
（スクリプトはDIVタグで表示されるようになっているので、ブログのCSS側でclassやidではなく、DIV要素に対して余白のスタイル設定がされているためと考えられます。）
インラインCSSでmargin、paddingを指定してください。
<DIV style="margin:5px 0px;padding:0px;">「いくつになったの」の場合は、下記のようにします。
var Sa1="<div style=font-size:"+fs1+";text-align:"+ichi+";margin:5px 0px;padding:0px;>";他には、ブログで使われている他のJavaScriptの干渉を受け、レイアウト崩れを起こす場合があるようです。
こちらのスクリプト側で対処するのは困難ですので、ページの表示を書き換えるような、影響力の強いJavaScriptを組み込む場合は、影響を及ぼす範囲に注意して配置するようにしてください。
（例えばコメントURL短縮スクリプトをテンプレートHTMLに挿入するときは、スクリプトの実行範囲はコメント部に限定し、プラグインカテゴリーに及ばないようにする、など）
特にテンプレート作者様はご注意くださるようお願いします。
カウント数字が、実際数えるのとズレています。（または、マイナスになります）
表示は、ページを見ているパソコンの日付設定に左右されます。
お使いのパソコンの日付設定を確認してみてください。
また、ブラウザの種類によっては表示がおかしくなる場合があります。
確認はIE6.0、NN7.1、Opera8.0で行っていますが、その他のブラウザで見たときに表示がおかしい場合はご連絡ください。
日付が変わったのに表示が変化しない
ブラウザの「更新」ボタンを押して（リロードして）ください。
エラーがでて「不正なタグ」と表示される
ご利用になっているHPスペースやブログに於いて、JavaScriptの使用が許可されていないと考えられます。
当サイトで配布しているカウンタは、JavaScriptというプログラムですので、<script>タグが使用できないと設置することが出来ません。
念のためご利用になっているHPスペースやブログのオフィシャルページから、ヘルプやサポートのページで、許可されているHTMLタグをご確認ください。
もし、<script>タグが使用できるのに「不正なタグ」と表示される場合は、ご連絡ください。
年齢カウントの「生後○日」と、通算日数の「生まれて○日目」が一致しない
初期状態では、数え方の違いにより、通算日数「生まれて○日目」の方が１日多く表示されます。
年齢カウントは、経過した年月日数を表示するので、生まれた当日は0日です。
それに対して、通算日数は生まれた日を1日目と数えるので、1日多くなります。
例えば、赤ちゃんの「お食い初め」は生後100日目を目安にしますが、生まれた日を1日目と数えます。それで生まれて○日目もそのようにカウントしたいというご要望がありましたので、わざとそのようにしています。
日数が合わないのが気になる場合は、下記の変更方法のように、通算日数を１日減らして（端数を切り捨てて）お使いください。 （年齢カウントの方を1日増やすために式に+1すると、動作がおかしくなる場合があります。ご注意ください。）
■FC2共有プラグインの場合
http://coel.blog58.fc2.com/blog-entry-56.html
■いくつになったのECの場合
http://homepage2.nifty.com/coel/kid/js_help.html#34
