Cara Membuat About us di Blog dengan Mudah

Buat kalian yang ingin membuat halaman About us di blog atau yang disebut dengan contact form dengan mudah dan gampang, berikut ini kami akan sedikit memberikan tips yang bisa berguna untuk kalian Cara Membuat About us di Blog dengan Mudah pada bagian halaman statis.

Pada umumnya Contact us ini sangat dianjurkan bagi siapapun yang ingin bermain blog atau website, karena dengan adanya contact form ini seolah-olah website kita terlihat profesional. Tidak hanya itu saja, kini membuat about us di blogger merupakan salah satu syarat yang harus dipenuhi oleh para pemilih blogger ataupun website agar iklannya bisa diterima oleh adsense.

Keuntungan Memasang About Us di Blog ini tidak lain adalah memudahkan para pengunjung baik itu pembeli, sponsor ataupun sesama blogger bisa menghubungi anda untuk membeli, melakukan sponsor dan bisa jadi ingin berkolaborasi dengan anda. Oleh karena itu Segeralah pasang Contact Form di blog anda.

Untuk membuat contact form di blogger ini ada 2 cara yang bisa kamu gunakan, cara pertama adalah dengan menggunakan bantuan third party seperti foxyform, jotform dan 123contactform.

Dan untuk cara keduanya adalah kamu bisa membuat sendiri dengan mudah, yakni dengan menambahkan sebuah widger di blogger dan menambahkan kode css pada halaman formulir kontak jika ingin membuat tampilan contact us atau about us menjadi menarik.

Untuk tutorial kali ini saya akan sedikit membagikan tips Cara Membuat About us di Blog dengan Mudah dengan widget yang sudah disediakan blogger.

Langkah pertama kalian bisa mengunjungi blogger.com dan melakukan login terlebih dahulu jika sudah memiliki ID dan buat yang belom memiliki akun kalian bisa langsung melakukan pendaftaran.

Jika sudah memasuki blogger kalian bisa memilih menu tata letak dan tambahkan gadget di menu bagian widget sidebar

Cara Membuat About Us di Blogger

Setelah itu akan muncul pop up menu untuk melakukan konfigurasi widget, scroll kebawah sampai anda menemukan formulir kontak seperti gambar dibawah ini, klik tombol tambah disamping dan klik tombol simpan. Jangan lupa untuk tidak menampilkan formulir kontak tersebut, karena kita akan memasang contact form di dalam halaman About us.

Langkah selanjutnya yang perlu kalian lakukan adalah menambahkan halaman About Us di blogger anda, klik menu halaman pada blogger dan pilih halaman baru

Cara Buat Halaman di Blogger

Setelah itu kalian bisa mengisi judul halaman sesuai yang anda inginkan seperti Contact Us ataupun About Us. Setelah itu klik menu Opsi utnuk memilih jangan izinkan, sembunyikan yang telah ada dan masukin kode yang akan kami kasih dibawah setelah itu klik tombol publikasikan.

Buat Page About Us di Blogger

Tadaaa Jadilah sebuah halaman Contact Us di blogger anda. Gimana? mudah bukan, jadi buat kawan yang ingin menampilkan about us ataupun contact us di blog kalian bisa mengikuti cara diatas ya.. Sekian dan terima kasih

<style type=”text/css”>
.contact-form-widget{margin-left:auto;margin-right:auto;width:600px;max-width:100%;padding:40px 0}.contactf-name,.contactf-email{float:left;width:48.25%}.contactf-name{margin-right:3.5%}.contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-name:hover,.contact-form-name:focus,.contact-form-email:hover,.contact-form-email:focus,.contact-form-email-message:hover,.contact-form-email-message:focus{width:100%;max-width:100%;margin:0 0 20px;padding:10px 15px;font-size:12px;letter-spacing:1px;color:#444;background:#F3F3F3;border:medium none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.contact-form-name,.contact-form-email{height:37px}.contact-form-email-message{height:170px}.contact-form-button-submit,.contact-form-button-submit:hover{width:13%;height:30px;font:normal 12px Arial;letter-spacing:1px;color:#444;display:block;outline:none;margin-bottom:20px;text-align:center;background:#E6E6E6;border:0;cursor:pointer}.contact-form-button-submit:active{outline:none;-webkit-box-shadow:none;box-shadow:none}.contact-form-cross{border:medium none!important;box-shadow:none!important;padding:0!important;height:11px !important;width:11px !important;}
</style>

<div class=”widget ContactForm” id=”ContactForm22″><div class=”contact-form-widget”><div class=”form”><form name=”contact-form”><div class=”contactf-name”><input class=”contact-form-name” id=”ContactForm1_contact-form-name” name=”name” size=”30″ type=”text” value=”NAME” onblur=’if (this.value == “”) {this.value = “NAME”;}’ onfocus=’if (this.value == “NAME”) {this.value = “”;}’ /></div><div class=”contactf-email”><input class=”contact-form-email” id=”ContactForm1_contact-form-email” name=”email” size=”30″ type=”text” value=”EMAIL” onblur=’if (this.value == “”) {this.value = “EMAIL”;}’ onfocus=’if (this.value == “EMAIL”) {this.value = “”;}’/></div><div style=”clear:both”></div><div class=”contactf-message”><textarea class=”contact-form-email-message” cols=”25″ id=”ContactForm1_contact-form-email-message” name=”email-message” rows=”5″ value=”MESSAGE” onblur=’if (this.value == “”) {this.value = “MESSAGE”;}’ onfocus=’if (this.value == “MESSAGE”) {this.value = “”;}’></textarea></div><input class=”contact-form-button contact-form-button-submit” id=”ContactForm1_contact-form-submit” type=”button” value=”SEND” /><div class=”contact-form-error-message” id=”ContactForm1_contact-form-error-message”></div><div class=”contact-form-success-message” id=”ContactForm1_contact-form-success-message”></div></form></div></div></div>