BETA

【WordPress】Google map APIを取得する方法

投稿日:2019-01-26
最終更新:2019-01-26
※この記事は外部サイト(https://hk-ryukyu.club/hideto/archives/182)からのクロス投稿です

【やりたいこと】Google map APIを取得したい

Google map APIの取得、めんどくさいですよね~、

ということで、

Google map APIを取得する方法を一番シンプルな記事を目指して書きました!

【10分でできる!】一番シンプルなAPIの取得方法

※ダウンロード時間は10分の中に含まれていません。

1.使用したもの

・ロリポップレンタルサーバー スタンダードプラン

https://lolipop.jp/

・WordPress 4.9.8

※WordPressはロリポップユーザー専用ページからインストールしました。

・テーマ Hueman

https://ja.wordpress.org/themes/hueman/

2.手順

※Googleのアカウントをお持ちでない方は、はじめにGoogleアカウントを作成してください。

①Google Maps PlatformでAPIの取得

こちらがGoogle Maps PlatformのURLとなります。

https://cloud.google.com/maps-platform/?hl=ja

右上の「使ってみる」をクリックします。

Mapsにチェックをつけます。

Project名を記入します。どんな名前でもかまいません。

後は、指示通りに進みます。

上記のように、APIが表示されていれば成功です。

②キーの制限

取得したAPIを指定のサイトのみで使用できるように、キーの制限を行います。

認証情報の保護をクリックします。

アプリケーションの制限でHTTPリファラー(ウェブサイト)を選択します。

下の方で、APIを使用するサイトのURLを記入します。


一言メモ

APIを使用するサイトのURL記入が、ただコピペするだけではうまくいきません。

私のサイトのトップページURLが「http://hk-underwater.club/kakinohana/」になります。これをAPIを使用するサイトに指定する場合は、

hk-underwater.club/*

と記入します。


③編集方法

後にキー制限を改めて編集する場合は、

認証情報を選択し、編集するAPIキーの右側にある鉛筆マークをクリックします。

すると、②のキー制限を設定したページに移動します。

詳細

画像が見づらい場合は、以下のリンク先に移動することをおすすめします。

https://hk-ryukyu.club/hideto/archives/182

技術ブログをはじめよう Qrunch(クランチ)は、プログラマの技術アプトプットに特化したブログサービスです
駆け出しエンジニアからエキスパートまで全ての方々のアウトプットを歓迎しております!
or 外部アカウントで 登録 / ログイン する
クランチについてもっと詳しく

この記事が掲載されているブログ

パソコン関連で役に立った情報を発信します

よく一緒に読まれる記事

0件のコメント

ブログ開設 or ログイン してコメントを送ってみよう
目次をみる
技術ブログをはじめよう Qrunch(クランチ)は、プログラマの技術アプトプットに特化したブログサービスです
or 外部アカウントではじめる
10秒で技術ブログが作れます!