• Our Partners:

Cara Membuat Link Email di HTML

Link di HTML biasanya berupa URL yang akan mengarahkan Anda ke halaman website atau ke bagian website tertentu. Tapi ternyata link di HTML bukan hanya itu saja, Anda juga bisa membuat link yang langsung mengarahkan Anda ke email tertentu.

Cara Membuat Link Email di HTML

Link email di HTML merupakan sebuah link yang berisi alamat email saat Anda mengkliknya. Aplikasi untuk mengirim email di perangkat Anda akan otomatis terbuka dan tujuan atau alamat email tujuan akan secara otomatis terisi dengan alamat yang sudah ditentukan sebelumnya.

Untuk membuat link tersebut tentulah sangat mudah dan sederhana. Anda tidak membutuhkan banyak code atau script, Anda hanya membutuhkan satu baris script saja. Langsung saja, silakan simak penjelasannya berikut ini.

[ez-toc]

1. Membuat Link Email di HTML

Link email di HTML bertujuan untuk mempermudah user atau pengguna saat akan mengirimkan sebuah email. Membuat link email di HTML tentu sangatlah mudah. Anda tidak membutuhkan sebuah script CSS ataupun javascript atau lain sebagainya. Bahkan Anda tidak membutuhkan sebuah plugin apapun. Anda hanya cukup menggunakan tag <a href> saja, sama seperti saat Anda membuat link menuju ke halaman tertentu. Langsung saja, berikut ini contoh script yang bisa Anda gunakan.

<body>
<a href = "mailto:contoh10@gmail.com">Send Email</a>

</body>

Mungkin biasanya saat Anda membuat link menuju halaman website tertentu menggunakan protokol http:// atau https://. Berbeda dengan link email kali ini menggunakan mailto: . Dengan begitu sistem akan mengetahui link tersebut adalah alamat email sehingga akan secara otomatis terbuka di email client yang Anda gunakan.

Seperti contoh script di atas, alamat email tujuan ditulis setelah mailto: . Tampilannya akan seperti gambar di bawah ini.

Cara Membuat Link Email di HTML

Saat Anda atau pengguna mengklik link tersebut, maka email client akan terbuka seperti outlook, gmail, dan lain sebagainya sesuai dengan apa yang sudah terinstal di perangkat pengguna. Anda tentunya juga bisa menambahkan script CSS untuk mengubah tampilannya menjadi lebih indah. Selamat mencoba!

2. Menambahkan Subject dan Body Email

Lalu, bagaimana jika ingin membuat sebuah link email yang otomatis subject dan body nya secara default muncul di alamat email yang akan dituju? Apakah bisa?

Tentu bisa dong. Di HTML bukan hanya bisa membuat link yang langsung tertuju ke alamat email saja, tapi Anda juga bisa mengatur subject dan body email itu sendiri. Lalu, bagaimanakah caranya? Caranya cukup sederhana, Anda tetap tidak membutuhkan script CSS ataupun javascript. Langsung saja, simak contoh script di bawah ini.

<body>

<a href="mailto:contoh10@gmail.com?subject=Ini%20adalah%20judul%20email%20default&body=Pesan%20ini%20akan%20secara%20otomatis%20muncul%20lho%21">email@domain.com</a>

</body>

Sebenarnya caranya sama seperti membuat link email biasa, tapi ada tambahan code sedikit yaitu:

  1. Tambahkan parameter ?subject= setelah email yang dituju.
  2. Setelah subject tulis pesan yang Anda inginkan. Untuk spasi gunakan %20. Seperti script di atas.
  3. Lalu, diakhir tulisan tambahkan parameter &body= . Ini untuk memasukkan pesan di body email.
  4. Setelah itu, silakan masukkan pesan yang Anda inginkan dan jangan lupa untuk spasi gunakan %20.

Silakan ikuti langkah-langkah di atas untuk hasil yang sesuai. Selamat mencoba!

Sekian artikel kali ini yang membahas tentang bagaimana caranya membuat link email di HTML dengan mudah. Link tersebut bukan hanya bisa menuju ke email saja, tapi juga bisa sekaligus langsung membuat subject besert body email. Semoga artikel ini dapat membantu dan bermanfaat bagi Anda. Terimakasih 🙂

Editor: Muchammad Zakaria

Download berbagai jenis aplikasi terbaru, mulai dari aplikasi windows, android, driver dan sistem operasi secara gratis hanya di Nesabamedia.com:

Download Software Windows

Download Aplikasi Android

Download Driver Printer

Download Sistem Operasi

Zuhroh Nilakandi Nesabamedia

Si pecinta hujan dan penikmat kopi yang suka duduk dalam lamunan sambil menghayal mimpi – mimpinya yang akan menjadi kenyataan.

Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments