aタグでメールを送信するmailto:の使い方【HTML】

最終更新日:

公開日:2024-07-26

記事内に広告が含まれています。
aタグでメールを送信するmailto:の使い方【HTML】

最近ではスパム等のセキュリティ対策も含め使用される頻度も減りましたが、まだ一定数の需要があるaタグからメールを送信するmailto:。改めてmailto:の使い方や設定の仕方を解説していきます。

aタグからメールを送信するmailto:の使い方

aタグからメールを送信するにはhref属性の値にmailto:メールアドレスという形式で記述します。
基本的にはこれだけでメールを送信できますが、mailto:メールアドレス?項目名という形式にする事で、件名や本文などの設定をする事も可能です。

<a href="mailto:info@cdg-blog.jp">メールを送信する</a>

件名と本文の設定

メール送信時に件名や本文を設定するには以下のように記述します。

件名(subject)

mailto:メールアドレス?subject=件名という形式で記述します。

<a href="mailto:info@cdg-blog.jp?subject=件名">メールを送信する</a>

本文(body)

mailto:メールアドレス?body=本文という形式で記述します。

<a href="mailto:info@cdg-blog.jp?body=本文">メールを送信する</a>

件名と本文を一緒に記述する場合

項目同士は「&」で繋いで記述します。

<!-- 件名+本文 -->
<a href="mailto:info@cdg-blog.jp?subject=件名&body=本文">メールを送信する</a>

CC・BCCの設定

メールを複数のメールアドレスに送信する場合は以下のように記述します。

CC(複数のメールアドレスを送信先に設定する)

mailto:メールアドレス?cc=メールアドレスという形式で記述します。複数のメールアドレスに送信したい場合はカンマで繋ぎます。

<!-- ccの宛先が1つ -->
<a href="mailto:info@cdg-blog.jp?cc=送信先メールアドレス">メールを送信する</a>

<!-- ccの宛先が複数 -->
<a href="mailto:info@cdg-blog.jp?cc=送信先メールアドレス,送信先メールアドレス">メールを送信する</a>

BCC(宛先を伏せて複数の送信先を設定する)

mailto:メールアドレス?bcc=メールアドレスという形式で記述します。複数のメールアドレスに送信したい場合はカンマで繋ぎます。

<!-- bccの宛先が1つ -->
<a href="mailto:info@cdg-blog.jp?bcc=送信先メールアドレス">メールを送信する</a>

<!-- bccの宛先が複数 -->
<a href="mailto:info@cdg-blog.jp?bcc=送信先メールアドレス,送信先メールアドレス">メールを送信する</a>

先程の件名、本文と同じく複数の項目を一緒に記述する場合には、項目同士を「&」で繋いで記述します。

本文の文字化け対策としてエンコードする方法

本文をそのまま日本語で入力すると、ユーザーの環境た文字種によっては文字化けする可能性があります。
文字化けを避ける為に、件名・本文をエンコードした方が確実です。

私はエンコードをする際はURLエンコード・デコード|Tech-Unlimited様をよく利用させてもらっています。

使用例

件名、本文をエンコードし、CCを2つ設定した場合以下のようになります。

<!-- 件名+本文+CC2つを設定したエンコード前 -->
<a href="mailto:info@cdg-blog.jp?subject=メールでのお問い合わせ&body=お問い合わせ内容を記入してください&cc=info@cdg-blog.jp,info@cdg-blog.jp">メールを送信する</a>

<!-- 件名+本文+CC2つを設定したエンコード後 -->
<a href="mailto:info@cdg-blog.jp?subject=%E3%83%A1%E3%83%BC%E3%83%AB%E3%81%A7%E3%81%AE%E3%81%8A%E5%95%8F%E3%81%84%E5%90%88%E3%82%8F%E3%81%9B&body=%E3%81%8A%E5%95%8F%E3%81%84%E5%90%88%E3%82%8F%E3%81%9B%E5%86%85%E5%AE%B9%E3%82%92%E8%A8%98%E5%85%A5%E3%81%97%E3%81%A6%E3%81%8F%E3%81%A0%E3%81%95%E3%81%84&cc=info@cdg-blog.jp,info@cdg-blog.jp">メールを送信する</a>

さいごに

いかがでしたでしょうか。
mailto:でのメール送信は非推奨ではありますが、まだ使用する事もあるかと思います。
そんな時にきちんと設定できるように覚えておいてください。

おすすめ記事

当ブログ運営者 ヒデ

北海道札幌市在住のフリーランスでWeb制作を行っているヒデです。Webコーディング(HTML・CSS・JSなど)やWordpressのカスタマイズ等のテクニック、困った時に確認できる分かりやすい解説を目標にして情報を発信していければと思っています。

当サイトに関するご意見・ご感想・ご要望または仕事のご依頼は以下のフォームよりお願い致します。

お問い合わせ お仕事のご依頼
PAGE TOP