Re: GoogleマップをHPへUPしたい
( No.1 ) |
- 日時: 2017/02/22 10:37
- 名前: 名無しさん
- 状況がちょっと理解できていませんが、Googleマップなど外部のサービスは
仕様変更などにより正しく埋め込めなくなる事があります。 例えばYoutubeなども仕様変更があり、新しいブラウザの場合、古い埋め込みタグだと 正常に表示できなかったりします。
なので、一度Google側の最新のソースで試してみてください。
Googleマップにアクセスし、埋め込みたいエリアを表示したあと、 左上メニューから地図を共有または埋め込む、地図を埋め込むタブをクリック、 iframeのソースが表示されるので、これをビルダーの「HTMLソース」画面で貼りつけます。
これで正常に表示できると思います。
|
Re: GoogleマップをHPへUPしたい
( No.2 ) |
- 日時: 2017/02/23 11:03
- 名前: 桃太郎U <tsunoda7@kmd.biglobe.ne.jp>
- 参照: http://www.toyo2915.sakura.ne.jp/
- 名無しさん 今日は 桃太郎Uです。
早速、ご指導を頂きましてありがとうございました。 ご指導の通りにGoogleマップの地図についてURLのコピーが出来ましてUPも 出来ましたが、肝心な私のHPへの挿入が出来なくて地図画像が一瞬出て消えて しまいます。 URL:http://www.toyo2915.sakura.ne.jp/moku/hp-5/3-1.html お恥ずかしいですが、私「タグ」が良く理解出来てなくて素人ホームページを 作って楽しんでる程度です。
お尋ねをします・・・・ 現在の状況は、PCではプレビューですべてのGoogleマップを画像を確認出来ていますが、上記のURLのHPからはエラーになっています。 教えて下さい・・・・ APIキーを取得しましたが、このAPIキーには「JSファイル」はないでしょうか? プロバイダーのサーバーへFTP転送する時にAPIキーが出来ていない、 "hpbmapscript1.js"このjsファイルは転送しています。
取得した「APIキー」は"AIzaSyCC8aHKhvJxWfLJutVGEM-pNnVvFRpeJZw"です。
大変失礼なお願いですがHTMLソースへの記述を分かりやすくご教授ください。 宜しくお願いします。
|
Re: GoogleマップをHPへUPしたい
( No.3 ) |
- 日時: 2017/02/23 12:08
- 名前: 名無しさん
- APIキーを取得されているのであれば、ひとまずそれを適用してどうなるか試してみてください。
ビルダーの上部からHTMLソースタブをクリックするとソースコードが表示されます。 この中に以下の部分があるので、末尾に &key=キー としてAPIキーを追加してみてください。
修正前 http://maps.google.com/maps/api/js?sensor=false
修正後 http://maps.google.com/maps/api/js?sensor=false&key=AIzaSyCC8aHKhvJxWfLJutVGEM-pNnVvFRpeJZw
ただ、ホームページビルダーはGoogleMapを少し特殊な方法?で埋め込んでいるのか、 公式のコードと違うようなので、上記でダメな場合は公式のコードを埋め込んでみてください。
Googleマップにアクセスし、埋め込みたいエリアを表示したあと、 左上メニューから地図を共有または埋め込む、地図を埋め込むタブをクリック、 左上にサイズ変更があるので調整します。 iframeのソースが表示されるのでコピーしてHTMLソースに貼りつけますが、 HTMLソースの編集が不慣れな場合は、ページ編集画面で貼りつけたい場所をクリックし、 編集 > 形式を指定して貼り付け > HTMLとして と貼りつけてください。
確認したところ対象のページではAPIキーが設定されていないエラーが出ていましたが、 私も試しに埋め込んでアップしてみましたがAPIキーの設定なしで表示できました。 このあたり、コードによってAPIキーが必要になるのか、表示回数の上限を超えると APIキーの設定が必要になるのか不明です。
|
Re: GoogleマップをHPへUPしたい
( No.4 ) |
- 日時: 2017/02/23 19:06
- 名前: 桃太郎U <tsunoda7@kmd.biglobe.ne.jp>
- 参照: http://www.toyo2915.sakura.ne.jp/
- 名無しさん,今晩は 桃太郎Uです。
ご親切にご指導メールを頂きましてありがとうございます。 ご指導頂きました記述を入力致しましたがエラーになります。 修正後のURL http://www.toyo2915.sakura.ne.jp/moku/hp-5/3-1.html
まだまだ未熟な為にご指導頂いた結果が出ていません、出来ましたら試しに作られたURLを勉強のためにご紹介頂けないでしょうか・・・・ソース記述を勉強させて頂きます。
宜しくお願いします
|