Cara Memasang Contact Us Keren Dan Responsive Di Blog

Memasang Contact Us ala Arlina

Lampiran Contact Us pada blog sangatlah penting. Selain salah satu syarat untuk mendaftar di Google Adsense juga berguna untuk berinteraksi dengan pengunjung blog. Nah, kali ini saya akan share kode Contact Us Keren dan Responsive di blog. Kelebihan Contact Us ini mampu loading cepat dengan desain yang simple dan menarik. Silahkan lihat gambar dibawah ini untuk melihat desainnya.

Apa itu Contact Us Form ?

Contact Us Form merupakan sebuah lampiran formulir pada blog yang berguna bagi pengunjung untuk menghubungi admin atau pemilik blog tersebut. Dengan demikian akan mempermudah pengunjung untuk berinteraksi atau menanyakan sesuatu kepada admin blog. Tentu saja dengan adanya interaksi antar pengunjung dan admin blog akan membawakan keuntungan besar bagi blognya, salah satunya bisa membuat pengunjung nyaman dan selalu mengunjungi blog kita.

Cara Pasang Contact Us

1. Masuk ke Blogger

2. Masuk ke Laman lalu klik Laman Baru

3. Ganti Compose menjadi HTML

4. Copy dan masukkan kode dibawah ini ke Laman tadi

<form name="contact-form">
<span style="color: #666666; font-family: Open Sans,Arial,Helvetica,sans-serif; font-weight: 700;"><i class="fa fa-user"></i> Name </span>
<input id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />  

<span style="color: #666666; font-family: Open Sans,Arial,Helvetica,sans-serif; font-weight: 700;"><i class="fa fa-envelope"></i> Email Address <span style="color: #f56954; font-size: x-small; font-weight: bold;">important</span></span> 
<input id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />  

<span style="color: #666666; font-family: Open Sans,Arial,Helvetica,sans-serif; font-weight: 700;"><i class="fa fa-pencil-square-o"></i> Content <span style="color: #f56954; font-size: x-small; font-weight: bold;">important</span></span>
<textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea> 
<input id="ContactForm1_contact-form-submit" type="button" value="Send" />  
<div style="max-width: 222px; text-align: center; width: 100%;">
<div id="ContactForm1_contact-form-error-message">
</div>
<div id="ContactForm1_contact-form-success-message">
</div>
</div>
</form>

<style scoped="" type="text/css">
#comments {display:none;}
</style>

5. Berikan Judul lalu Publikasikan

Selamat Contact Us yang keren dan responsive sudah berhasil dibuat, selanjutnya tinggal masukkan link contact us tersebut untuk dijadikan menu navigasi

Semoga artikel ini bermanfaat, untuk mendapatkan update artikel silahkan masukkan email kalian dibagian kanan postingan

 

Baca juga: