質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.51%
WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

Google マップ

Google Mapは、Google社がオンラインで提供している地図・ローカル検索サービスです。GIS(Geographic Information System:地理情報システム)の中の「WebGIS」に該当します。地図・航空写真・地形の表示方式があり、それぞれユーザーが縮尺を調整して表示させることができます。地域の情報サービスを検索する機能やルート検索の機能も搭載されています。

Q&A

解決済

1回答

3097閲覧

カスタムフィールドに入力された座標の値からgooglemapを表示したい

sweeetlife

総合スコア15

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

Google マップ

Google Mapは、Google社がオンラインで提供している地図・ローカル検索サービスです。GIS(Geographic Information System:地理情報システム)の中の「WebGIS」に該当します。地図・航空写真・地形の表示方式があり、それぞれユーザーが縮尺を調整して表示させることができます。地域の情報サービスを検索する機能やルート検索の機能も搭載されています。

0グッド

1クリップ

投稿2018/03/26 05:19

編集2018/03/26 09:32

フロントエンドでgooglemapで表示された場所の情報を座標に変えて
値をカスタムフィールドに入力されています。

googlemapの欄に住所を入れると
イメージ説明

カスタムフィールドの欄には座標が入力されます
イメージ説明

この座標の値を使ってsingle.phpにコードを記入しgooglemapを表示したいと考えています。

プラグインなしでできれば行いたいです。
google APIコードは入手済みです。

私はまだ素人で紹介された情報をコピペして実装ことしかできません。
調べたところ、
http://xn--o9jo4t9b8csgsa8h.com/2012/01/23/technical_522/
こちらで紹介されている座標から表示ということを試してみましたが
表示したら真っ白になってしまいました。
紹介されているコードに、追加として、
入力があった場合に表示されるようにifを付け足しています。
カスタムフィールド名はmapです。

<?php if ( post_custom('map') ) : ?> <img alt="" src="http://maps.google.com/staticmap?center=<?php echo post_custom(" />&markers=<!--?php echo post_custom("map"); ?-->,redc&zoom=17&size=400x300&key=【Google Maps API Key】" width="270" height="270" class="imageframe" alt="" /> <?php endif; ?>

Advanced Custom Fieldsのプラグインを使用してみましたが
googlemapのみうまくリンクされず、地図のさしている地点は
変化されずに初めの設定されている場所で表示されたままです。

フロントエンドのgooglemapから情報を入手する方法をあきらめてほかの方法を探すことも考えたのですが、
マイナーな、住所にない細かい場所を表示したい場合などは
やはり現在座標までは取得できているので、
是非googlemapを表示したいと考えております。
上記のコードでどこか違うところがあるのでしょうか。
どうかご教授をお願いいたします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

参考サイトのコードが単純に間違っています。

PHP

1<?php if ( post_custom('map') ) : ?> 2<img alt="" src="http://maps.google.com/staticmap?center=<?php echo post_custom('map'); ?>&markers=<?php echo post_custom('map'); ?>,redc&zoom=17&size=400x300&key=【Google Maps API Key】" width="270" height="270" class="imageframe" alt="" /> 3<?php endif; ?>

ジェネレーターなどで緯度経度がどこに入るかを確認してみてはいかがでしょう。

【Google Static Map Maker | a static map API helper】
https://staticmapmaker.com/google/

【Google Static Mapsをブログに貼るためのコードジェネレーター(ストリートビュー対応) |勝手にライトニング!】
http://lightning2014.ensyutsubu.com/blog/static-googlemap-generator/

投稿2018/03/30 15:10

kei344

総合スコア69357

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

sweeetlife

2018/04/02 17:35

経験が浅く質問の仕方も指摘があったにも関わらず、 丁寧な回答を本当にどうもありがとうございます。 添付していただいたゼネレーターもとても参考になり今後の勉強にも役立ちました。 また、コードの間違いの指摘に感謝いたします。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.51%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問