Cara Membuat Halaman Contact Us-Sampai disini untuk sobat blogger yang baru selesai membuat blog maka langkah selanjutnya adalah melengkapi halaman webnya, salah satunya yaitu memasang halaman contact us.
Contact us atau halaman kontak adalah sebagian dari perlengkapan sebuah web atau blog. Lihat saja di berbagai website yang ada pasti akan disediakan halaman ini.
Salah satu tujuan menyediakan halaman kontak yaitu untuk mempermudah pengunjung atau siapapun yang ingin terhubung langsung dengan admin blog tersebut.
Dengan memasang contact us admin bisa memberikan informasi bagaimana cara orang lain dapat terhubung dengannya, baik melalui akun sosialmedia ataupun melalui email dan lainnya.
Selain itu, saat kita ingin memonetisasi blog kita nanti maka membuat halaman kontak kami ini sangat berperan penting dalam mencari perhatian google adsense.
Dalam kata “mencari perhatian google” adalah dimana google adsense menyukai sebuah web dengan halaman yang lengkap.
Tentu saja tidak hanya halaman contact us, melainkan ada halamanhalaman yang lainnya seperti sitemap, disclaimer, privacy policy dan about me. Namun, di dalam artikel ini hanya akan admin bagikan tentang cara membuat halaman contact us.
Insya Allah akan sobat temui tutorial cara membuat halaman-halaman yang di maksud di artikel yang lainnya yang ada di web ini. Silahkan saja di cari ya.
Baiklah, tanpa panjang lebar lagi, akan saya bagikan bagaimana cara membikin halaman kontak us di blogger dengan mudah dan cepat.
Dalam hal ini tentu saja ada banyak pilihan untuk membuat sebuah halaman formulir, namun disini akan saya berikan yang termudah dan terbaik untuk sobat blogger sekailian.
Hanya tinggal copas dan ganti id saja sudah terbuat halaman hubungi kami sederhana dan simpel tanpa harus registrasi atau membuat sendiri dengan mencoding ini itu.
Cara Membuat Halaman Contact Us Sederhana di Blogger
1. Buka Dasboard blogger.com
2. Pilih menu Halaman/Page
3. Klik Halaman Baru
4. Beri judul halaman dengan nama “Contact Us” (tanpa tanda kutip)
5. Pilih tampilan HTML
6. Copy script dibawah ini
<form name="contact-form">
<span face="Open Sans,Arial,Helvetica,sans-serif" style="font-weight: 700;"> Name </span>
<input id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />
<span face="Open Sans,Arial,Helvetica,sans-serif" style="font-weight: 700;"> 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 face="Open Sans,Arial,Helvetica,sans-serif" style="font-weight: 700;"> 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,.post_meta,#blog-pager {display:none;}
#ContactForm1_contact-form-name, #ContactForm1_contact-form-email{
height:auto;margin:5px auto;padding:10px;background:#fafafa;color:#444;border:1px solid #ccc;border-radius:3px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;transition:all 0.5s ease-out;}
#ContactForm1_contact-form-email-message{width:100%;height:175px;margin:5px 0;padding:10px;background:#fafafa;color:#444;border:1px solid #ccc;border-radius:3px;transition:all 0.5s ease-out;}
#ContactForm1_contact-form-name:focus, #ContactForm1_contact-form-email:focus, #ContactForm1_contact-form-email-message:focus{outline:none;background:#fff;color:#444;border-color:rgba(81,203,238,1);box-shadow:0 0 5px rgba(81,203,238,0.7);}
#ContactForm1_contact-form-submit{float:left;background:#cf4d35;color:#fff;margin:10px auto;vertical-align:middle;cursor:pointer;padding:10px 18px!important;font-weight:700;font-size:14px;text-align:center;text-transform:uppercase;letter-spacing:.5px;border-radius:4px;border:0;transition:all .8s ease}
#ContactForm1_contact-form-submit:hover {background:#e45a40;color:#fff;}
#ContactForm1_contact-form-error-message, #ContactForm1_contact-form-success-message{width:100%;margin-top:35px;}
.contact-form-error-message-with-border {background:#f6f6f6;border:none;box-shadow:none;color:#444;padding:5px 0;}
.contact-form-success-message {background:#4fc3f7;border:none;box-shadow:none;color:#fff;}
img.contact-form-cross {line-height:40px;margin-left:5px;}
.post-body input {width:initial;}
@media only screen and (max-width:640px){
#ContactForm1_contact-form-name, #ContactForm1_contact-form-email,#ContactForm1_contact-form-submit{width:100%;}}
</style>
7. Paste di kolom halaman tadi
8. Jika sudah selesai maka klik Publikasikan
9. Selesai
Dengan mengikuti langkah diatas tentu saja sobat sudah berhasil memiliki halaman kontak dan siap untuk memasangnya di navigasi yang ada didalam blog.
Hanya sekedar tambahan saja, sobat blogger yang baik dan budiman juga bisa menambahkan informasi kontak yang lainnya seperti menambahkan kontak WhatsApp, Halaman Facebook, Akun Instagram, atau yang lainnya yang dapat terhubung dengan sobat sekalian.
Baiklah terimakasih telah setia berkunjung dihalaman ini untuk sementara waktu ini, silahkan berkunjung kembali dilain kesempatan untuk mencari tutorial-tutorial blogger sederhana untuk membantu dan menemukan solusi sobat.
Semoga artikel cara membuat halaman contact us sederhana diatas dapat membantu sobat sekalian, selamat mencoba dan salam sukses selalu.
Posting Komentar