ふじまるシステム

WEB制作のフリーランスで頑張っていこうとしている者のブログです。趣味や役立つ知識などあれば発信していきます。ポートフォリオは自己紹介ページからご覧ください。

パソコン関連

【簡単!】iPhoneでもできるワードプレスでGoogleマップの埋め込み方法

投稿日:

こんにちは。

今回はiPhoneのワードプレスのアプリでもGoogleマップの埋め込み地図を出す方法をご紹介します。

埋め込み地図とは?

こういう記事内に地図を埋め込めるものです。自分で動かすことが可能です。

例、スカイツリーの地図

ワードプレス のアプリで埋め込み地図を追加する方法

このアプリを使って新規投稿で記事を書きます。

ここにGoogleマップのリンクを追加したら良いかと思いますが、それでは埋め込み地図になりません。

それでは順番に説明します。

①まずは埋め込みたい地図を探します。

iPhoneで検索したい場所(例、スカイツリー)と検索します。

②次に画面左上の【あぁ】の部分をタップして、【デスクトップ用Webサイトを表示】を選択します。

③すると画面がパソコンで開いたようなイメージに変わります。

④画面右上の地図の部分をタップするとGoogleマップが開きますので、右の【共有】をタップします。

⑤共有ページが開くので【地図を埋め込む】をタップします。

⑥地図を埋め込む為のリンクが表示されるので長押しして全てコピーしてください。

⑦コピー出来たら準備完了です。ワードプレス のアプリで記事を書きます。

⑧画面右上の3点リーダー(…)をタップし、【HTMLモードに切り替え】をタップします。

⑨するとこのような画面になります。コーディングの画面が出てきますが大丈夫です。

⑩下記のようにPタグ(<p></p>)で囲まれた所が一つの段落になるので追加したい段落のPタグの間をタップし、ペーストを選択してください。

11.貼り付けるとこのような形になります。

12.再度右上の3点リーダーをタップして【ビジュアルモードに切り替え】を選択してください。

これで元の画面に戻ります。

ただしアプリ版ではIFRAMEというように表示され見えません。

13.確認する方法は再度右上の3点リーダーをタップし、【プレビュー】を選択します。

14.これで埋め込み地図が表示されていたらオッケーです。

はい!以上で終わりです。慣れればアプリでも記事は投稿できますので便利ですね。

それでは!

-パソコン関連

執筆者:


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

関連記事

【Adobe PDF】IEでPDFが開けない時に試す方法!!

こんにちは、ふじまるです! 仕事で「パソコンでPDFが開け無い!」と問い合わせがあったので備忘録を残します。 環境はwindows7、WEBブラウザ上でPDFを表示させるページを開くとPDF表示の部分 …

マイクロソフトOfficeのライセンス認証が大変だった話

こんにちは、ふじまるです。 先日仕事で他部署の方が使っているノートパソコンが起動せず、ブルースクリーンになるので修理して欲しいと頼まれました。 何かしたかを問うと、Windowsアップデート中に電源が …

【解決】GoogleChromeが起動しない エラー「このアプリケーションのサイドバイサイド構成は正しくないため、アプリケーションを開始できませんでした。詳細については、アプリケーションのイベントログを参照するか、コマンドラインツールsxstrace.exeを使用してください。」

今日の朝テレワークをしようとパソコンを起動してグーグルクロームを起動すると、下記エラーが出て起動来ませんでした。 このアプリケーションのサイドバイサイド構成は正しくないため、アプリケーションを開始でき …

【IME】文字変換がおかしい!?そんな時に試すこと【辞書修復】

先日会社で「IMEの文字変換がおかしいのでなんとかしてくれ!」と問い合わせがありました。 話を聞くと「きく」と入力して変換しても「聞く」が出ない、「いそがしい」と入力して変換しても「忙しい」と変換され …

Android 手動のシステムアップデートの無効化について

会社でアンドロイドのタブレットをセットアップして使用者に配っているのですが、アンドロイドのOSをアップデートさせたくないのでいろいろ試してみました。 自動アップデートの禁止 これは調べたらすぐ出てきま …