Google Mapの制作に便利!サササッとGoogleMapの地図を埋め込む「0円のマップ屋さん」が素敵

googlemap

Web制作などしていると交通やアクセスの説明ページで地図を入れることが当たり前になっているぐらいGoogle Mapって便利ですよね。

ただGoogle Mapのカスタマイズってなかなか敷居が高くて難しいんですよね。

ただこのサイトでは3つのステップに沿って進めていくだけで簡単にGoogleマップのタグを生成してくれるんです。

「0円のマップ屋さん」でできること

Googleマップ作成

0円のマップ屋さんでできることは以下の通り。

  • 地図の横幅と高さの指定
  • マウスホイールで拡大縮小の有無
  • ふき出しの表示可否
  • 表示位置アイコンの変更
  • 会社名や店名・住所・電話番号・サイトURL・メールアドレス・画像の表示

生成されたGoogleマップ

実際に生成されたソースをファイルに書き込むだけで下記のような素敵なGoogleマップが表示できます。


本当に簡単でよく活用してます。

他にこんな便利なサイトあるよ?っていう情報あれば是非教えてくださいね~。

  • Pocket
  • LINEで送る
  • このエントリーをはてなブックマークに追加

コメントを残す




関連記事

WEB制作で無料写真素材を探すならPixabay!高品質で素敵な画像が役立ち過ぎる!
CSSのみで作られたシンプルなアイコンセットを公開している「icono」
プログラミング等を3分動画で初心者向けに動画で解説してくれる「ドットインストール」
Web制作のグラデーションに便利なCSS3ジェネレーターまとめ ※随時更新
プレビューを見ながら簡単にスタイリッシュなグラデーションを作成できるCSS3ジェネレーター「Ultimate CSS Gradient Generator」
顔バレを防げてSNSのアイコンにも使えるBrickapic。簡単にレゴ風自画像が作れて便利!
Webデザインの参考になるイケてるサイトを集めたギャラリーサイト「イケサイ」
無料で使えるロゴをダウンロードできる素材集サイト「LogoInstant」
好きな色や大きさにカスタマイズしたアイコンを無料でダウンロードできる「PNGify Me」が便利!
Webデザインをする時に参考にしたいウェブデザインのまとめサイト ※国産サイト
横並びのカラム計算に便利!ビジュアルで確認できるグリッドシステム計算ツールGridpx
Webデザインに関連するテクニックやツール人気の役立つネタだけを厳選して紹介している「デザインフィードデータベース」
角丸・グラデーション・影・透過を表現するCSS3コードを自動生成してくれるジェネレータ「CSS3 Generator」
デザインのためのインスピレーションの助けになるSNS風コミュニティサイト「Dribbble」
ソースのストックするならこの中から!ソースコード管理・整理に便利なオンラインのスニペットツール7選

Menu

HOME

 TOP