アースナビ
ミュージカル、歌劇からスポーツ、展覧会、伝統行事まで世界のイベント情報を徹底ガイド!
本日のイベント0件
今月のイベント0件
ホーム
Webサービス
シティインフォ
北アメリカヨーロッパヨーロッパヨーロッパヨーロッパアジア オセアニアオセアニアオセアニアオセアニア中東&北アフリカ アフリカ(サハラ以南) アフリカ(サハラ以南) アフリカ(サハラ以南) 中央・南アメリカ
ジャンル検索
カフェ
グローバルリンクス
カフェギャラリー
携帯で見る
携帯用のURLはhttp://mobi.earthnavi.com/info/webservices/index.html

アースナビWebサービスへようこそ

アースナビではWebサービス第一弾として、世界中のイベントの中から編集部おすすめのイベントをランダムにピックアップし、ユーザーのウェブサイトに検索表示させることのできるブログパーツ「Pickup Event!」をリリースしました。
あなたのホームページやブログなどの表示したい場所に簡単なコードを挿入するだけですぐお使いいただけます。
利用料は無料。ユーザー登録の必要はありません。この機会にぜひお試しください。

 ココログユーザーの方はこちら
 TypePadユーザー、TypePadファミリーユーザーの方はこちら

ブログパーツ「Pickup Event!」

このページの下部にある「Pickup Event! HTMLコード作成」からHTMLコードをコピー&ペーストしてお使いください。

「Pickup Event!」でできること

  • 世界中のイベントの中から編集部おすすめのイベントをランダムにピックアップし、検索表示させることができます (約15分ごとにランダムにイベントが表示されます)。
  • 写真付きのイベントは写真が自動で表示されます。
  • 弊社指定の30都市からお好きな都市を指定できます(デフォルトは全都市)。
  • タイトルバー、枠線の色を好みに応じて指定できます。

「Pickup Event!」使用方法

  • 簡単なコードを表示したい場所に挿入するだけで、すぐご使用いただけます。
  • このページの下部にある「Pickup Event! HTMLコード作成」からHTMLコードをコピー&ペーストしてお使いください。

「Pickup Event!」HTMLコード作成


都市を選択する
色を選択する

※下のコードをコピー&ペーストしてお使いください。都市や色を選択して「レビュー & コード作成」をクリックすると上記サンプル表示と下記コードに変更が反映されます。初期設定は「全都市」「slateblue」です。



ココログユーザーの方

  1. このページの上部にある「Pickup Event! HTMLコード作成」から都市と色を選択してください(選択しない場合、3へ。都市は全都市、色はslateblue)
  2. 「レビュー & コード作成」をクリックしてください(都市と色を選択しない場合、3へ)。
  3. 下の「このブログパーツをココログに設置!」ボタンをクリックしてください。

TypePadユーザー、TypePadファミリーユーザーの方

  1. このページの上部にある「Pickup Event! HTMLコード作成」から都市と色を選択してください(選択しない場合、3へ。都市は全都市、色はslateblue)
  2. 「レビュー & コード作成」をクリックしてください(都市と色を選択しない場合、3へ)。
  3. 下の「このウィジェットを登録する」ボタンをクリックしてください。


そのほかのオプション


応用編

  1. レイアウトは全てCSSで記述されていますので、ユーザー独自のスタイルを設定することもできます。
  2. http://www.earthnavi.com/js/services/style.jsに弊社指定のスタイルが記述してありますので、このファイルをリンクからはずします。
  3. ユーザー独自のCSSををご用意ください。
  4. 作成したCSSに以下のclassを記述し、スタイルをそれぞれ決定します。
    .En-box
    dl.En-Pickup  /* コンテナー */
    dt.En-Title  /* Pickup Event! タイトル */
    dd.En-Contents  /* イベント表示部分 */
    p.En-EventTitle  /* イベントタイトル部分 */
    p.En-Thumb  /* イベント画像部分 */
    p.En-Thumb img
    p.En-Location  /* 開催都市部分 */
    p.En-Date  /* 開催日部分 */
    p.En-Content  /* イベント本文部分 */
    p.En-ads  /* 広告枠(現在未使用)*/
    .En-copyright  /* コピーライト部分 */
    .En-copyright address  /* コピーライト部分 */
    .En-Pickup a:link, .En-Pickup a:visited
    .En-copyright a:link,.En-copyright a:visited
    ※上記はPickUp Eventで使用している全てのclassを記述した参考例。
  5. 以下、Pickup Event HTML Code 構造
    全てのタグにclass名を指定してあります。
    ユーザー作成のCSSに以下のclass名を指定し、スタイルを設定することでユーザー独自のCSSを適用できます。
    <!--Pickup Event Code-->
    <div class="En-box">
      <dl class="En-Pickup">
        <dt class="En-Title">PickUp Event!</dt>
          <dd class="En-Contents">
            <p class="En-EventTitle">イベント名</p>
            <p class="En-Location">開催都市</p>
            <p class="En-Date">開催日</p>
            <p class="En-Thumb">画像</p>
            <p class="En-Content">本文</p>
            <p class="En-ads">広告(現在未使用)</p>
          </dd>
      </dl>
      <div class="En-copyright">
        <address>Powered by <a href="http://www.earthnavi.com/" title="アースナビ">アースナビ</a></address>
      </div>
    </div>
    <!--End Earthnavi Code->
    ※copyrightは必ず表示させるように設定してください。
 アースナビサイト内検索
Powered by Google
ユーザーID 
パスワード 
アースナビからのお知らせ
2007年5月30日更新