メインコンテンツへ移動

My Maps location:場所とカテゴリ

1. Google Maps APIキーを取得する

Google Maps API をご利用になる際、ドメインが2016年6月22日以降に作成された場合は、リクエストを検証するためにキーを含める必要があります。
キーを取得して API を有効にするには、 https://developers.google.com/maps/documentation/javascript/get-api-key を

詳細情報: https://developers.google.com/maps/documentation/javascript/usage?hl=en

最初のステップは、プロジェクトを作成し、プロジェクトの名前を入力することです。.

 

APIキーの作成

 

mydomain からのすべてのリクエストを許可したい場合、従うべきパターンは *.joomunited.com/* です
。mydomain.com などの単一のドメインのみを許可したい場合、パターンは joomunited.com/* になります。


ローカルホスト環境では、有効なキーを任意に入力でき、ドメインを参照せずに動作します。.

 

ドメインAPIパターン


次に API キーが生成されます。これは、 My Maps locationに追加するためにコピーする必要があるキーです。.

 

API作成

 

My Maps Locationにキーを追加します。.

コンポーネント >My Maps Location> オプション ビューから、構成にキーを追加できます。

 

マップ構成

 

キーを貼り付けます。.

 

APIキーの追加

 

ステップバイステップの履歴書:


私が従う手順は

  • Google APIコンソールへアクセス
  • プロジェクトを作成または選択する
  • 「続行」をクリックして、 APIと関連サービスを有効にします。
  • 認証情報ページでブラウザキー、API認証情報を設定します。
  • ベストプラクティスに従ってAPIキーを保護してください。

2. 場所のカテゴリを管理する

場所はカテゴリに分類されています。これらのカテゴリは、フロントエンドでフィルターとして表示したり、メニュー項目の定義済みパラメータとして使用して、分類された場所を読み込むことができます。.
 

カテゴリフィルターフロントエンド

 

場所が多数ある場合は、カテゴリの使用をお勧めします。カテゴリとサブカテゴリを作成できます。
カテゴリを作成するには、My Maps location >「カテゴリ」に移動し、「新規」をクリックして

 

カテゴリ-場所

 

次に、カテゴリ画面から、サブカテゴリを作成する場合に備えて、タイトルと親カテゴリを追加する必要があります。

 

カテゴリ親

 

マーカー選択タブを使用して、カテゴリ内の場所のデフォルトのマーカーを定義することもできます。

 

マーカーカテゴリ

 

「マイカテゴリ」という名前のカテゴリが作成され、インストール後すぐに場所を追加できるようになります。

3. 場所を作成する

場所を作成するには、My Maps location> 場所 > 新規

必須フィールドは 3 つあります。

  • 場所の名前
  • 場所のカテゴリ
  • 場所の詳細(住所)      

 

アドレスを追加するには、次の 3 つの解決策があります。

  • 検索フィールドを使用する(推奨)
  • 地図上でカーソルを使って場所を指定します
  • 住所を入力してください(Google マップで有効な住所である必要があります)

 

検索エンジンで場所を追加するには、追加する場所の名前を入力します。.

 

場所を追加

 

選択すると、緯度と経度のフィールドが自動的に入力されます。My MapsはGoogleプレイスとも連携しています。つまり、Googleマップに登録されているお店やその他の場所を検索する際に、My Mapsコンポーネントがすべての場所情報を取得します。.

 

Googleプレイス

 

 

地図上を移動して直接マーカーを置くこともできます。結果は同じで、緯度と経度が自動的に入力されます。.

 

マップポイント

 

住所フィールドと郵便番号を手動で入力する場合は、Google マップの既知の住所と一致する必要があるので注意してください。.

 

住所フィールド

 

場所のその他の情報 (説明、営業時間など) はすべて、場所の詳細ビューに表示されます。.

ロケーション詳細編集の連絡先リンクでは、ロケーションごとに連絡先リンク、mailto、またはURLを追加できます。フロントエンドでは、URLを開くかmailtoアクションを実行する連絡ボタンが表示されます。.

 

9

 

4. その他の位置情報

それぞれの場所に画像とマーカーを追加できます。. 

  • 場所の画像:画像は、場所のツールチップにサムネイルとして表示され、場所の詳細ページでは大きなサイズで表示されます。
  • カテゴリアイコンを使用する:マップの場所のカテゴリフィールドに入力したアイコンを使用します
  • マーカーの背景:背景マーカーの色を選択します
  • マーカーは地図上に位置マーカーアイコンとして表示されます。また、 My Maps Location拡張機能には、位置情報用の便利なマーカーセットも含まれています。
  • カスタム リンクを使用すると、場所の詳細へのリンクがカスタム URL によって上書きされます。

 

マーカー画像の位置

 

My Maps location 、Joomlaネイティブの多言語機能を使用しています。ロケーションのカテゴリとロケーションごとに言語を定義できます。言語を切り替えると、他のJoomlaコンテンツと同様に、ロケーションはフィルタリングされ、承認された言語のコンテンツが表示されます。.

 

言語

 

場所の説明欄は最も重要な項目の一つです。
場所の詳細ページに表示されるほか、テーマによっては検索結果で場所の紹介文として表示されます。さらに重要なのは、説明欄がWYSIWYGエディターで、プラグインがすべて読み込まれているため、画像や動画など、あらゆる情報(画像、動画など)を自由に配置できることです。

 

場所の説明

 

場所の検索結果に表示される紹介テキストは次のとおりです。.

 

場所の結果内のテキスト

 

タグフィールドはJoomlaと同じタグシステムです。タグとサブタグを追加し、フロントエンドでフィルターとして読み込むことができます。すべてのタグを管理するには、Joomlaタグコンポーネントを読み込むだけです:メニューコンポーネント > タグ
フロントエンドでは、設定に応じて、タグはチェックボックス(下図参照)またはドロップダウンリストとして表示されます。

 

タグフィルター

 

My Maps Location 、メタ情報(検索エンジン用)を入力するためのフィールドが追加されました。これらのフィールドは、位置情報の詳細ページに読み込まれます。.

 

メタ情報

 

5. フロントエンドに場所を表示する

フロントエンドに場所を表示するには、以下を使用できます。

  • 場所検索エンジン、単一の場所、または場所のカテゴリを表示するメニュー
  • 検索フィールドを表示したり、場所のセットを選択したりするためのモジュール
  • 任意のエディターで単一または複数の場所を表示するためのエディター ボタン

メニューから場所を読み込む

Joomlaメニューマネージャーから要素を追加し、タイプとして「場所の検索と表示」を選択します。これにより、フィルター付きの場所検索エンジンが表示されます。
「場所の詳細表示」を選択すると、定義済みの場所が1つ表示されます。

 

場所メニュー

 

「場所の検索と表示」を選択した場合、いくつかの表示パラメータが表示されます。一部のパラメータは、デフォルトのコンポーネントパラメータを上書きする場合があります。

 

メインメニュー設定

 

メニューのメインタブから、次の設定を行うことができます。

  • 住所を入力:ページの読み込み時にデフォルトの住所が表示されるように設定できます。空白のままにすることもできます。
  • 距離:上記のアドレスを参照してロックサーチまでの距離。-1(デフォルト)のままでも構いません。
  • カテゴリ:特定のカテゴリの場所を読み込みます
  • 検索制限:検索結果の数を制限します。10 を指定すると、場所検索で最初の 10 件の結果のみが返されます。
  • 並べ替え:検索結果を日付、タイトル、距離で並べ替える (デフォルト)

 

mmlメニュー詳細

 

次に、My Maps Locationメニュータブ、次の設定を行うことができます。

  • コンポーネントを選択: My Maps Locationまたは K2、 Jomsocial...
  • デフォルト カテゴリ ID (サードパーティ拡張機能): K2、Hikashop、Adsmanager などのサードパーティ拡張機能が使用されている場合に読み込むデフォルト カテゴリ、コミュニティ ビルダーの CB リスト ID
  • 子カテゴリの場所:上記で選択したカテゴリだけでなく、サブカテゴリの場所も検索結果として表示します。
  • テーマ:メニュー項目に使用できる検索と結果の表示テーマのデフォルト、フル幅、サイドバーの 3 つのテーマから 1 つを選択します。
  • マッププロバイダ: Google マップ、Bing マップ、Mapbox、OpenStreetMap、Baidu、または Mapquest を選択してマップのスタイルを設定します
  • 検索タグを有効にする: 場所タグ名を使用して検索クエリを実行できるようにします
  • デザイン:マップソースに応じて、いくつかのマップタイプと色があります
  • マップレイヤー:マップにデータ(レイヤー)を追加します。KMLレイヤー、交通情報レイヤー、公共交通機関レイヤー、自転車レイヤーがあります。
  • Google マップ レイヤー URL:データ レイヤーを使用してカスタム データを保存したり、Google マップに GeoJSON データを表示したりできます。
  • Bing Mapsの種類: Bing Mapsが地図プロバ​​イダーである場合は、Bing Mapsの外観とデータを選択します。
  • OpenStreetMapタイプ: OpenStreetMapがマッププロバイダである場合、マップにデータ(レイヤー)を追加できます。
  • 場所ツールチップ:マップの読み込み時に、場所の検索後に場所ツールチップを自動的に開きます
  • マップのズーム:マップのデフォルトのズームレベルを定義します
  • 地図と検索結果の幅と高さのオプション

 

テーマに基づいたフロントエンド表示

 

マップ検索テーマ

 

単一の場所の検索の結果が表示されます:

ブリッジウォーターの場所


モジュールを使用して場所を表示する

My maps location ネイティブロケーション用の 2 つのモジュールと、サードパーティ統合用のモジュール (K2 アイテムのロケーションを表示するモジュールなど) が付属しています。

マップモジュールを使用すると、メニューと同じフィルターを使用して、モジュールの位置に場所を表示できます。場所はマップまたはリストで表示されます。場所のセットを選択したり、場所のカテゴリを選択したりできます。

 

マップモジュール

 

My Maps Locationマップ - 検索モジュールには、マップの幅や場所を検索するコンポーネント (例として K2 の場所のみを検索) などのオプションとしていくつかのフィルターを備えた検索エンジンが表示されます。

 

検索モジュール

 

フロントエンドの表示モジュール:

 

検索マップフロントエンドモジュール

 

 

エディターボタンを使用して場所を表示する


エディターボタンはJoomlaエディター(通常は記事またはHTMLカスタムモジュール内)に読み込まれます。エディターの下部にボタンが表示されます。
クリックするとライトボックスが表示され、以前に追加した場所を1つまたは複数選択できます。

 

マップエディターボタン

 

場所を1つまたは複数選択し、ボタンを押して記事に追加します。ズームレベルを指定しない場合は、選択した場所のエリアに合わせて自動的に読み込まれます。WYSIWYG
{mymaplocations mapid width height}のようになります。

例: {mymaplocation id=1 width=58% height=400px zoom=10 type=google} このコードは、場所ID=1、幅58%、高さ400px、ズーム10倍、Googleタイプで地図を表示します。地図に複数の場所を追加するには、カンマを使用します。例: {mymaplocation id=1 width=58% height=400px zoom=10 type=google} 場所ID = 1、2、3.