スマートフォンサイト制作時の自動リンク無効化と電話番号等をアプリを使って立ち上げる方法

スマートフォンサイト制作時の自動リンク無効化と電話番号等をアプリを使って立ち上げる方法

スマートフォンサイトを制作する際にメールや電話、Googlemapなどのリンクをそれぞれのアプリで立ち上げる事ができます。その際の記入方法のメモです。

また、Mobile Safari や AndroidのWebView では場合連続した数字列や文字列を自動的に電話番号やメールアドレス等と認識してリンクを貼ってしまいます。以下のようにmetaタグで自動リンクを無効化することが可能です。

自動リンクをmetaタグで無効化する

電話番号、メールアドレスを自動リンクしないようにするには以下のようにヘッド内へ記入します。

<meta name="format-detection" content="telephone=no,email=no">

リンク先をアプリケーションを使って立ち上げる

電話を起動する

<a href="tel:電話番号">

電話が立ち上がりポップアップで確認後そのまますぐ電話がかけれる。

メーラーを起動する

<a href="mailto:メールアドレス"> 

メーラーが立ち上がりメールアドレスが自動で入る。

下記のようにメールアドレスの後にパラメータをつけるとメーラーが起動した時に自動的に件名が入るので便利です。

<a href="mailto:メールアドレス?subject=お問い合わせ">

SMSを起動する

<a href="sms:電話番号">

SMSが立ち上がりSMSメールの宛先にすぐに送信できる

mapを起動する

<a href="http://maps.google.com/maps?q=住所+名称">

mapアプリが立ち上がり入力の住所が表示される。
※mobile safariではmapが立ち上がりましたが、ブラウザによってはアプリではなくブラウザ内でGooglemapが表示されるだけでした。

Related Article

No Comments & Tracbacks

Leave a Comment

Emailは公開されません。*は必須項目です。


*


Categorys

Tags

CSS3 ダッシュボード ヘッダー トラブル コードサンプル スライドショー コンテンツ 素材 jQueryプラグイン Facebook php 引っ越し お知らせ JavaScript CSS カテゴリー Shareボタン IE 投稿タイプ seo Photoshop レスポンシブ Macアプリ ナビゲーション タクソノミー HTML5 WPセキュリティ Git カスタムメニュー サイドバー PHPリファレンス SVG query_posts API WP使い方 iTunes データベース コメント function RSS 条件分岐 get_posts() スマートフォン Sass/Compass マルチサイト機能