• >top
  • >

    ブログパーツ

     
  • はじめに

    ブログパーツ地震速報について
    東北・関東地方を襲った東日本大震災はいまだ予断を許さず、強い余震が続いています。
    yahooその他のメジャーなサイトでは地震速報が報じられますが、個人サイトではなかなか作成が難しいようです。
    このような状況を何とか改善したいと思い、当サイトでも『ご利用の方々に出来るだけ早く情報をお伝えする方法は無いか』とブログパーツを探し回りましたが納得の行くものが見当たらず、最終的に自力で当サイト内での「地震速報」を作成し、とりあえずの完成を見ました。
    さらに、この「地震速報」を当サイトだけのものとせず、皆様のサイトでもご利用頂けるようブログパーツ化を試みました。
     
    拙い技術で作成しておりますため至らない点が多々あるかと存じますが、取り急ぎ公開させて頂きます。(2011/03/25 草の根ネット事務局)
    追記
    新バージョンのブログパーツを公開しました。速報性と表示の自由度を高めました。(2012/04/14)
    不具合を修正したVerを公開(2012/04/22)
    1.上部帯表示タイプ Ver2.3
    テレビの地震速報表示のように、画面上部に自動的に表示されます。
    表示する地震の震度を選択できます。初期値は震度1から表示になっています。
    表示は一時的に通常画面の上に表示され、一定時間経過で自動消去します。
    邪魔な場合、Xボタンで消去できます。(違う地震が発生すれば再表示されます)
    対応できないブラウザの場合、下記の旧バージョンの地震速報が表示されます。
    cookieを使用しますが、ブラウザを閉じるとcookieは削除されます。
    javascriptで自動更新していますが、非対応ブラウザの場合は自動更新しません。
    2.横幅468ピクセルタイプ Ver1.9
    横幅468ピクセル、縦幅は地震情報のレコード数により可変です。
    yahooのようにページタイトルの下などに表示する場合にご利用下さい。
    3.縦長表示タイプ Ver1.9
    横幅指定可能、縦幅も地震情報のレコード数により可変です。
    150~200ピクセルの幅に最適化してあります。
    一般的なブログパーツ表示部分に表示する場合にご利用下さい。
    4.更新履歴
    5.特記事項(使用上の注意)
    詳細は、各ブログバーツの説明を御覧ください。
    基本情報(よくお読みください)
    ※ie7以前のブラウザにも対応しました
    Ver2.2からの変更点
    ・ie7以前のieは旧Verの『横長』『縦長』を選択して表示します。
    ・ie8以上、Firefox、Chrome、Safari、Opera、スマートフォンは自動更新型の地震速報が表示されます。
    ・上記の変更に伴い、Javascriptの設置場所が限定されます。
    1.ブラウザ画面に帯のように高さ36ピクセルの地震速報が表示されます。
    ブラウザを自動判別しスマホの場合は、54ピクセルとなります。
    画面内の固定位置で表示され、スクロールしても表示位置は変わりません。
    ie7以前のieは旧来のリロード更新型の地震速報が表示されます。
    設定時に『横長』『縦長』を選択して下さい。
    →サンプル画面(ie7以前のブラウザで見ると表示が変わります)
    2.地震情報が無い場合は非表示です。地震が発生した時だけ20分表示されます。
    3.リロード無しで自動表示・自動消去されます。
    ie7以前のブラウザでは自動表示・自動消去されません。更新はリロード時になります。
    4.最新の地震が1行だけ表示されます。
    ie7以前のブラウザでは20分以内の地震が複数行表示されます。
    5.表示右端の×ボタンで表示を閉じることができますが、新しい地震が発生すると再度表示されます。
    ie7以前のブラウザでは×ボタンで表示を閉じることは出来ません。
    6.閉じるボタンをクリックしても追加情報があった場合には、同じ地震が再表示されます。(気象庁の発表通り表示します)
    7.貼り付ける場所は旧Verを表示したい所に貼り付けて下さい。
    推奨する設置場所
    横長の場合、ページタイトル部分の下
    縦長の場合、サイドバーの上部のページが開かれた時に表示される所
    8.パラメータを設定することで旧Verの縦長横長の選択・横長の表示幅・新Verの画面上部からの表示位置・表示震度・文字コードの変更が可能です。
    ブログパーツを貼り付けてから、以下の説明をよく読み設定変更して下さい。
    プログパーツの貼り付け
    以下の情報をコピーし、あなたのサイトの該当ページに貼り付けて下さい。
    ★設定方法★
    1.スクリプトの貼り付け
    地震速報を表示したいページの<body>~</body>の間の表示したい部分に、上記スクリプトを貼り付けて下さい。
    推奨貼付場所は下記の通りです。
    横長の場合、ページタイトル部分の下
    縦長の場合、サイドバーの上部のページが開かれた時に表示される所
    2.順番通りにパラメータを設定して下さい。
    (スクリプトファイル名の"?"以降、パラメータ名=赤字の部分)
    初期値 <script 略~.js?&code=UTF-8&width=150&oldDisp=on&sindo=1&position=0&test=on" charset="utf-8">
    文字コード:code
    初期値はUTF-8 文字化けするときは、ページの文字コードに合わせて変更して下さい。
    ※変更するときはcharsetのutf-8と間違えないよう注意して下さい。
    文字コードの表記が間違っていると正しく認識されません。以下からコピペをお勧めします。
    確認済み文字コード UTF-8・SJIS・SJIS-win・以下未確認 EUC-JP・eucJP-win・JIS・ASCII
    その他のおそらく対応しているであろう文字コード→
    横長・縦長と横幅(縦長の場合のみ):width
    初期値は150(縦長)、0に設定すると横長になります。0以外の数値で自動的に縦長となり入力された数値のピクセル幅となります。
    縦長表示の場合150~200がオススメです。
    旧バージョン表示:oldDisp
    初期値はon(テスト表示)、旧Verの表示位置確認のため初期値はonになっています。
    onの時は、ie7以前のブラウザでどのように表示されるか確認できます。
    文字コード・設置位置の確認が済んだら必ずoffに変更して下さい。
    情報表示する震度:sindo
    初期値は1(震度1以上)、設定可能値は1~4 設定数値以上の地震が表示されます。
    ie7以前のブラウザでは設定にかかわらず震度1から表示します。
    表示位置変更:position
    初期値は0 画面最上部から下に表示位置をピクセル単位で変更できます。
    FC2ブログなど画面上部に他の表示が出て表示が重なる場合に使用します。
    テスト表示スイッチ:test
    初期値はon(テスト表示)、画面上部からの表示位置を確認後は必ずoffに変更して下さい。
    offにすると、地震が発生しない限り非表示となります。
    3.DOCTYPE宣言の確認
    DOCTYPE宣言によってはie8で表示がされない場合があります。
    下記の動作一覧を確認しDOCTYPE宣言を修正して下さい。
    これで設定は終わりです。
    再設定したい時はパラメータ”test”をonに戻して下さい。
    その他 FC2ブログをお使いの方へ
    FC2ブログだけテストしましたのでご報告します。
    設定画面右側下にある「環境設定」の「プラグインの設定」→「フリーエリアを選択」→「プラグインの改造」「HTML編集~(上級や向け)」に記載すれば表示されました。
    注意点は、「フリーエリア内容の変更」ではなぜか機能しないので、「HTML編集~(上級や向け)」で編集することです。
    その他のブログはテストしておりませんので、ご連絡お待ちしております。
    動作が確認されたサイト
    FC2BLOG livedoor.blog Ameba biglobe jugem
    ie8(インターネットエクスプローラー8)使用時における『地震速報Ver2.3』のDOCTYPE宣言の違いによる動作確認一覧表
    HTML 1.0 DTD
    HTML 1.0用のDOCTYPEなし
    HTML 2.0 DTD (RFC1866) [1994年に標準化]
    <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
    <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">
    HTML 2.x DTD (RFC2070)
    <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML i18n//EN">
    HTML 3.0 DTD
    <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 3.0//EN">
    HTML 3.2 DTD [1996年のW3C勧告]
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
    HTML 3.2 DTD [1997年1月のW3C勧告]
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
    HTML 4.01 Strict DTD (厳密な) [1999年12月のW3C勧告]
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    HTML 4.01 Transitional DTD (移行期)
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    HTML 4.01 Frameset DTD (フレームセット用)
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
    ISO-HTML
    <!DOCTYPE HTML PUBLIC "ISO/IEC 15445:2000//DTD HTML//EN">
    <!DOCTYPE HTML PUBLIC "ISO/IEC 15445:2000//DTD HyperText Markup Language//EN">
    XHTML 1.0 Strict DTD [2000年1月26日のW3C勧告]
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    XHTML 1.0 Transitional DTD [2000年1月26日のW3C勧告]
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    XHTML 1.0 Frameset DTD [2000年1月26日のW3C勧告]
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
    XHTML 1.1 Strict DTD
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    XHTML Basic 1.0 DTD [2000年11月19日のW3C勧告]
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN" "http://www.w3.org/TR/xhtml-basic/xhtml-basic10.dtd">
    XHTML Mobile Profile1.0 DTD
    <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
    WML1.3 DTD
    <!DOCTYPE wml PUBLIC "-//OPENWAVE.COM//DTD WML 1.3//EN" "http://www.openwave.com/dtd/wml13.dtd">
    WML2.0 DTD [2001年9月11日のW3C勧告]
    <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD WML 2.0//EN" "http://www.wapforum.org/DTD/wml20.dtd">
    「どうしても上手くいかない」「デザインが変わってしまう」場合
    草の根ネット事務局へご連絡下さい。善処させて頂きます。
    (トラブル報告フォームへ→)
    ご利用の方へ
    今後の参考のため、ブログパーツを貼り付けたサイトのURLをお知らせ頂ければ嬉しいです。
    (設置お知らせフォームへ→)
    ▲目次へ戻る
    基本情報
    1.横幅468ピクセル、縦幅は地震情報のレコード数により可変です
      (横幅はAmazon/Googleバナーと同じサイズです)
    2.地震情報が無い場合は非表示です
    3.右下に当サイトプログパーツページがリンク表示されます
    4.貼り付ける場所は任意ですが、ページ上部が望ましいと考えます
    5.貼り付けた場所の左右のセンター、上下は各1emのマージンで表示されます
    6.表示される時間は、地震発生時間から過去20分です
    7.時間内の地震がすべて表示されますので、複数行の場合もあります
    8.気象庁の発表から1分以内に表示されます
    9.同じ地震が複数表示される場合があります
      (気象庁の発表通り表示します)
    10.表示タイミングはブログパーツを貼り付けたページの更新時です
      自動では表示されません(yahooも同様)
    11.震度1から表示されます。
    12.実際には、以下のように表示されます
      サンプル・本番用両方記述していますが本番用は、地震がない場合表示されません。

    ↓サンプル

    1.プログパーツの貼り付け
    以下の情報をコピーし、あなたのサイトの該当ページに貼り付けて
    サイズや位置の確認を行ってから、表示用サンプルを削除してください。
    2.「どうしても上手くいかない」「デザインが変わってしまう」場合
    草の根ネット事務局へご連絡下さい。善処させて頂きます。(トラブル報告フォームへ→)
    3.ご利用の方へ
    今後の参考のため、ブログパーツを貼り付けたサイトのURLをお知らせ頂ければ嬉しいです。(設置お知らせフォームへ→)
    ▲目次へ戻る
    基本情報
    1.横幅可変、縦幅も地震情報のレコード数により可変です
      150~200ピクセルの幅に最適化してあります
      (FC2サイドバナーの表示はテスト済)
    2.地震情報が無い場合は非表示です
    3.右下に当サイトプログパーツページがリンク表示されます
    4.貼り付ける場所は任意ですが、ページ上部が望ましいと考えます
    5.貼り付けた場所の左右上下はマージンなしで表示されます
    6.表示される時間は、地震発生時間から過去20分です
    7.時間内の地震がすべて表示されますので、複数行の場合もあります
    8.気象庁の発表から1分以内に表示されます
    9.同じ地震が複数表示される場合があります
      (気象庁の発表通り表示します)
    10.表示タイミングはブログパーツを貼り付けたページの更新時です
      自動では表示されません(yahooも同様)
    11.震度1から表示されます。
    12.実際には、以下のように表示されます
      サンプル・本番用両方記述していますが本番用は、地震がない場合表示されません。
    ↓サンプル表示

    <div>記述例:width 数値は任意

    <div style="width: 150px;">

    ブログパーツ

    </div>

    1.プログパーツの貼り付け
    以下の情報をコピーし、あなたのサイトの該当ページに貼り付けて
    サイズや位置の確認を行ってから、表示用サンプルを削除してください。
    2.「どうしても上手くいかない」「デザインが変わってしまう」場合
    草の根ネット事務局へご連絡下さい。善処させて頂きます。(トラブル報告フォームへ→)
    3.ご利用の方へ
    今後の参考のため、ブログパーツを貼り付けたサイトのURLをお知らせ頂ければ嬉しいです。(設置お知らせフォームへ→)
    ▲目次へ戻る
    動作確認出来ているブログ
    2011/04/07現在 FC2/seesaa/JUGEM/livedoor/yahoo/xrea/so-net/kct
    動作確認させて頂いたサイト様
    FC2 BLOG 「ラファエルブログ」
    seesaa BLOG 「喜劇は終演間近だ、さあ拍手の準備を。」
    seesaa BLOG 「mono's(30代、40代男のおもちゃ箱)」
    JUGEM BLOG 「emab」
    倉敷ケーブルテレビ 「沸茶の庵」
    livedoor BLOG 「今日を知るNEWS」
    省略しておりますが他多数のサイト様(商用・個人)
    ありがとうございましたm(_ _)m
    Ver 2.3(2012/04/22)
    ・Ver2.2の不具合とJavascriptの関係でie7以前のブラウザで表示できない問題の対応
     どうにもならないのでie7以前のブラウザで開かれたときは旧バージョンを表示する
     それに伴う各種変更とパラメータの追加。
     簡単に言えばVer2.2とver1.8のミックス版です。
     webチラシを優先するためバージョンアップはちょっとおやすみします。
    Ver 2.2(2012/04/14)
    ・上部帯表示タイプ公開しました。長い戦いだった…
     クロスドメインの問題が解決できないのでprototype.js不使用タイプです。
     バグ修正報告 即座に不具合が出ました(泣)。
     緊急対応でie7以下は動作しないようにしました。(2012/4/14 18:20)
     まだまだ勉強が足りないようです…(T T)
    Ver 2.1(2012/04/06)
    ・上部帯表示タイプ(当サイト専用)公開しました。
     prototype.jsを利用しています。
    Ver 1.8(2011/07/02)
    ・気象庁の発表時間異常の際に表示され続ける障害の修正
     結果として7/2 0:00から2:00にかけて地震速報が表示され続けました。
     謹んでお詫び申し上げます。(7/2 AM3:51)
     障害の理由としましては、気象庁が6月30日の地震を7月2日に発表したためのようです。
     ブログパーツを公開してから異常発表は今回で2回目です。
     思うところは色々とありますが、気象庁さんには頑張って欲しいと思います。
    Ver 1.7(2011/05/12)
    ・気象庁の発表時間異常の際に表示され続ける障害の修正
     結果として5/11 11:00から13:58にかけて地震速報が表示され続けました。
     謹んでお詫び申し上げます。(5/12 AM6:00)
    Ver 1.6(2011/04/01)
    ・月をまたいだ日付処理のバグを修正
     結果として4/1 2:26から3:30にかけて地震速報が表示され続けました。
     謹んでお詫び申し上げます。(4/1 AM4:00)
    Ver 1.5(2011/03/29)
    ・さらにデータ取得速度を高速化しました
    ・誠に勝手ながら、ブログパーツをご利用のサイトを参考に修正させて頂きました
    ・デザインの微変更に伴いcssを修正
    ・縦長型のテキストを中央揃えに変更
    Ver 1.4(2011/03/28)
    ・同じ地震が時間ズレで表示されるバグを修正
    ・震源地が取得できないバグを修正(再修正)
    テスト表示用のブログパーツのcssがlocalになっておりました
     申し訳ございませんでした m(_ _)m
    Ver 1.3(2011/03/28)
    ・地震発生時のみデータ取得速度を倍速化
    ・震源地が取得できないバグを修正
    ・cssの修正
    Ver 1.2(2011/03/27)
    ・誠に勝手ながら、ブログパーツをご利用のサイトを参考に修正させて頂きました
    ・seesaaで表示が乱れるバグを修正
    ・fc2で表示が乱れるバグを修正
    Ver 1.1(2011/03/26)
    ・表示時間を30分→20分に変更
    ・地震情報(24H)へのリンクを追加
    ・表示が乱れるバグを修正
    ・地震データを取得する速度を向上
    ・同じ時間に発生した地震の重複表示を改善(最新情報に更新)
    ▲目次へ戻る
    【ブログパーツご利用の際の注意】
    ・ソースコードのはりつけ方など、設定については、ご利用のブログサービスやサイト作成サービスの動作環境などをご参照ください。
    ・ブログパーツは、仕様などを予告なく変更させていただく場合がありますので、あらかじめご了承ください。
    ・ブログパーツで提供するプログラムが安全であること、正確に動作し、エラーや不具合を生じないまたは生じさせないことについては万全を期しておりますが、これらを保証するものではありません。また、お客様の要求に適合すること、エラーや不具合が修正されることを保証するものではありません。
    ・ブログパーツのご利用はお客様ご自身の判断と責任において行っていただきます。
    ・ブログパーツのご利用に基づくいかなる損害に対しても草の根ネット事務局および情報提供元は責任を負いかねますのでご了承ください。
    ・ブログパーツは、JavaScriptがオンになっているブラウザでないと表示されません。
    サイト内ニュース検索:

    訃報

    【訃報】『プレデター』人気キャラ俳優、死去 76歳
    芸スポ+ 2017-08-19 17:28

    ブログパーツ設置のご連絡を頂いたサイト