みなさん、こんにちは!!
管理人のピーディー( @PD_bloger ) です。
旅行や飲食店の紹介をするブログ記事に地図(Googleマップ)が埋め込まれていることありますよね?
「じぶんもブログに地図を入れたいなぁ~~。でも難しそうだからスクショを使っておこう...」
みたいな妥協することありませんか??
じつは、ブログに地図を埋め込む方法は超簡単です。
WordPressには地図を埋め込むプラグインもあるの・で・す・が、不要です。
むしろ、プラグイン使わない方が簡単で確実です。いや、本当に簡単です。まじで。
さくっと解説しちゃいますので、すぐにためしてみてください!!!
サンプルです(地図:秋葉原)。↓ ↓
スポンサーリンク
全体の流れ
① Googleマップで希望の住所を検索する
② Googleマップの「共有」機能からコードをコピーする
③ ブログ投稿の「テキスト」画面にコードを貼り付ける
「コード」という単語だけで拒否反応を起こさないでください!!w
表示されている英数字をコピペするだけなので安心してください!!
慣れると、さまざまなところで応用が利きます。例えば youtube 動画を同じ方法でブログにアップできるようになりますので!
Googleマップを開く
Googleマップを開きましょう ⇒ https://www.google.co.jp/maps/
どこでもいいです。てきとうに住所・駅を入力検索しましょう。
地図が表示されると、住所情報の中に「共有」がありますので、クリックします。
地図を「共有」する画面が表示されます。次に「地図を埋め込む」をクリックしましょう。
「リンクを送信する」
共有リンクをコピーしてあげれば、今表示されている地図をまた開くことができます。
では、「共有」設定のつづきです。
「地図を埋め込む」をクリックすると画面中央に『サイズ』『HTML』『地図(プレビュー)』が表示されます。
『中』サイズの地図がプレビュー(実際に表示される大きさ)で確認できます。
サイズは『大』『中』『小』『カスタマイズ』の 4 つです。
「『中』だとちょっと大き過ぎるな・・・」という方は『カスタマイズ』を選択することをおすすめ。
『カスタマイズ』〇〇(横) × 〇〇(縦) と記載されています。
ブログにしっくりくるサイズをいろいろ試しました。
個人的には「横:500~600」「縦:400~450」くらいの比率がちょうどよいと思います。
『実サイズでプレビュー』をクリックするとどのくらいの大きさか確認できるので、そのつど調整してみてください。
サイズが決まれば、『HTML をコピー』クリックします。とくに英数字のところを選択する必要はないです。ただ『HTML をコピー』をクリックするだけでよいです。
WordPressの投稿画面へ
ダッシュボード画面、ブログ記事の投稿画面に移ります。
通常は『ビジュアル』を選択した状態で、記事を書いているかと思います。
HTML を入力(コピペ)するので『テキスト』を開きましょう。
(慣れないと見つけにくいですが)地図を入れたい個所を探し、貼り付けます。
「 <br /> 」が文章を改行するコードです。
こいつのすぐ下に貼り付けてあげると綺麗に収まります。
地図を貼り付けた後でも、ビジュアル画面から地図を一段改行する修正ができます。
簡単な作業ならプラグインは使わず、Google が用意してくれている機能を活用する方が後々便利です。
投稿画面で住所入力すると自動で地図が埋まるといった便利なプラグインもありますが、作業量は両方ともそれほど変わらないかと個人的に思います。
以上、「ブログに地図を貼り付ける」作業の流れでした。
YouTube も同じ要領で貼り付けることができます!!