無料ホームページテンプレート Template Party

会員登録型

一覧ページにGoogleMap出力

※重要。マップオプションを導入するには「キー」が必要です。
取得方法は、Googleや他のサイトで取得方法の説明がありますので、「GoogleMap キー取得」などで検索してください。
キー取得に関するサポートは弊社では行う事ができませんので、予めご了承下さい。

一覧ページ上にGoogle Mapを出力し、該当する情報(物件など)上にピンを立てられる有償オプションです。
販売価格:マップオプション費用22,000円(税込)
※CMS本体も必須です。既に本体だけご購入済みのお客様で導入を希望の場合、当ページ最下部をお読み下さい。

以下の画像クリックで実際のデモページが開きます。
「情報を表示するには、地図を拡大してください。」といったメッセージが出る場合は、マップを拡大して下さい。段階に応じてマーカーが変化していきます。

管理画面も見てみたい、操作してみたい場合は、「管理画面体験ページ」をご覧下さい。
実際にご自身のサイトで動作確認をしたい場合は以下の試用版をお試し下さい。

試用版を試してみる

試用版は、新規登録・コピー機能・CSVアップ機能などは制限されていますがデータの入れ替えなどが可能です。
新規登録・コピー機能・CSVアップ機能を試したい場合は「管理画面体験ページ」をご覧下さい。

まず最初に、本体の試用版をDLしてきて下さい。

マップ用の試用版だけでは動作しませんので、先に本体の試用版をDLしておいて下さい。

ポータルテーマ本体 試用版

マップ試用版のダウンロード

上でDLした本体フォルダに移動(または上書き)して下さい。

マップ試用版(ポータルテーマ)のダウンロード

setup.phpに取得済みのキーを設定する

キーの取得方法は、「GoogleMap キー取得」などでGoogle検索してください。
キー取得に関するサポートは弊社では行う事ができませんので、予めご了承下さい。

setup.php

ファイル一式をアップロードし、試用版のサイトを見てみる

ファイル一式をアップロードし、試用版の一覧ページにアクセスしてみます。
「不動産情報(売買物件)」と「不動産情報(賃貸物件)」にマップの設定がされています。
ここでは「不動産情報(売買物件)」をみてみましょう。

売買物件 http://(※あなたのサイトのurl)/?act=list&kind=1

「売」のアイコンをクリックするとその物件のポップアップウィンドウが開きます。
マップの下にはピンが立っている物件の一覧も表示されます。

もし以下のようなメッセージが出る場合は、メッセージが消えるまでマップを拡大してみて下さい。

補足:以下のような表示になる場合。
キーの設定ができていない状態なので、キーに間違いないか、setup.phpにちゃんと貼り付けられているかご確認下さい。

マップを使用する際の管理画面の設定について

管理ページにアクセスします。
http://(※あなたのサイトのurl)/?act=setup
ID:admin
パスワード:1234

ログインしたら、「項目設定」メニューからこの機能を使いたいカテゴリーの「編集」ボタンを押し、ページ冒頭にある「一覧用HTML」にmap_list.htmlと入力します。
マップ試用版の「不動産情報(売買物件)」と「不動産情報(賃貸物件)」にはこの設定が既に入っています。

一番下までスクロールし、以下の赤枠にチェックを入れます。
マップ試用版の「不動産情報(売買物件)」と「不動産情報(賃貸物件)」にはこの設定が既に入っています。

実際にマップを指定してみる

管理画面の「登録情報」メニュー内から、上で設定したカテゴリーをクリックして編集画面を開くと、以下のようにGoogleMapが表示されます。

マップを設定する方法は、地図画面上のアイコンをドラッグして目的の場所に移動するか、地図下に住所を入力して、「緯度経度を得る」を押します。
最終的に、ページ一番下にある「保存」ボタンを押さないと緯度経度は記録されませんので、ご注意ください。
「Map用緯度」「Map用経度」に直接値を書き込んで保存することも可能です。

詳細解説

マップ試用版の梱包ファイルについて

  • index.php、setup.php、data/cmsdb.sqlite
    マップ試用版専用のCMSプログラムです。
  • map_filesフォルダ
    マップに使う画像やcss、マップ用テンプレートのパーツ(.tpl)など様々なファイルが梱包されています。
  • map_files/iconフォルダ
    マップ上のピンやクラスター表示のアイコンが梱包されています。制作土台の.aiファイルも入っていますので必要があればご利用下さい。

情報アイコン

setup.phpで、情報の種類ごとに設定します。
以下は不動産テーマ試用版の例ですが、求人テーマも同じように設定できます。
アイコン画像はmap_filesのiconフォルダに梱包してあります。制作ファイル(icon_●.ai)も入れていますので、ご活用下さい。

setup.php

クラスターアイコン

地図上に多くの情報が存在すると、情報アイコン(マーカー)が多く表示されて見にくくなります。
これを防止するために、クラスター化の機能があります。
実際に見てみたい場合は「管理画面体験ページ(デモページ)」をご覧下さい。

setup.phpで、クラスターの設定をします。
アイコン画像はmap_filesのiconフォルダに梱包してあります。制作ファイル(icon1-9.ai、icon10-90.ai、icon100.ai)も入れていますので、ご活用下さい。

setup.php

地図上に"cluster_num"で設定した数以上の情報が存在する場合、クラスター化されます。
その場合、"cluster_div"で設定した数で、地図が縦横に分割され、その区画ごとの情報数を表示する"cluster_icon"で設定したアイコンが表示されます。
上記の設定(マップ試用版)の場合、10以上は10単位で同じアイコンが使用されます。11などの新たな設定をすれば、その数の場合にそのアイコンが使用されます。

検索条件の設定

map_list.html

地図検索時に条件を指定する場合は、map_list.htmlを修正します。
試用版の場合、「こだわり検索」「地名で検索」が入っていますので、必要により追加、修正をしてご利用ください。
検索条件の設定方法については、マニュアル内の「一覧ページ」ブロックにある「検索テーブル」関連をご覧下さい。

情報の種類(例:不動産情報(売買物件)、不動産情報(賃貸物件)…)ごとに条件を変えたい場合は、map_list.htmlをコピーしてください。(例えば、map_list2.htmlなど)
そして、そのファイル名を管理画面の「項目設定」の「一覧用html」に設定してください。
※地図検索で使用するファイルの先頭は、必ず「map_」で始まるようにしてください。

その他の設定や修正

  • 地図上の吹き出しの表示内容

    情報のアイコンをクリックした場合に表示されるふきだしのレイアウトが設定可能です。
    map_files/map.tplを修正します。この表示は、同じディレクトリ内のstyle.css/style_map.cssが適用されますので、必要があれば、これらのファイルも修正してください。
    その際は、地図の表示が崩れないようご確認ください。
    また、同じ緯度経度に複数の情報が存在する場合は、map_files/map_s.tplが使用されます。こちらも同様に修正が可能です。
  • 地図下の情報一覧の表示内容

    地図上の該当情報の詳細内容が、地図下に表示されます。その内容を変更可能です。
    map_files/map_item.tplを修正します。

    通常の一覧ページタイプのようなソート機能はありません。
    マップページの検索結果は、緯度経度でまとめたり、クラスター化するために緯度経度準固定の順番になります。

  • 広域表示のZOOM倍率変更

    地図が広域表示の場合、「情報を表示するには、地図を拡大してください。」と中央に表示しますが、この判定の倍率を変更することができます。
    map_files/map.jsの215行目付近の、
    if (map.getZoom() < 12) {
    この12を変更してください。数字を小さくするとより広範囲、大きくするとより狭い範囲でメッセージが表示されます。
    また、地図の全画面表示を行った場合は、このメッセージが表示できませんので、アラートポップアップで表示されます。この場合全画面表示は終了します。
    GoogleMapの全画面表示を禁止する場合は、map_list.htmlの161行目付近の、
    var fullScreen = true; // falseにするとフルスクリーン表示ボタンを出しません
    を、
    var fullScreen = false; // falseにするとフルスクリーン表示ボタンを出しません
    と変更してください。
    GoogleMap右上の、全画面表示ボタンが非表示になります。

うまく動作しない場合

マニュアルFAQなどをご参照下さい。マップ版の解説は当ページのみですが、その他CMS本体に関する問題に関連する場合に解決できる可能性があります。
それでも解決しない場合、サポート掲示板からご質問をお願い致します。

尚、GoogleMapキーの取得は、利用者自身のGoogleアカウントでのログインが必要になるため、具体的なサポートができません。Google検索などで、取得方法を調べて、ご自身でお願い致します。

会員登録版(ポータル)を既にご購入済みで、マップオプションを導入したい場合

当ページ冒頭の注意書きにあるように、Google Mapを使用する為の「キー」が必須です。
既に会員登録版を導入中の場合でも、試用版を使ってマップが正常に出力できるかを事前にご確認下さい。この際あやまって利用中のCMSに上書きしないようご注意下さい。

動作に問題なければお問い合わせフォームより以下を明記の上でご注文下さい。

1. 現在ご利用中のCMSの「ご購入時期」と「ご名義」。
2. 「会員登録版(ポータル)のマップオプション希望」との記載。

1つ前のページに戻る