Lompat ke konten Lompat ke sidebar Lompat ke footer
Beranda / Blogger

5 Cara Menciptakan Haman Form Kontak ( Contact Us , Contact Me ) Di Blogger



Tutorial Cara Membuat Halaman Contact Us / Contact Me di Blogger


Halo sahabat blogger,seperti yang kita tahu bahwa halaman navigasi khususnya halaman kontak sangatlah penting. Selain berfungsi untuk memudahkan pengunjung atau orang lain yang mungkin ingin menghubungi kita untuk menanyakan sesuatu,bisnis/kerja sama menyerupai content placement atau endorse dll. Juga sebagai salah stau syarat untuk memudahkan blog kita lolos dalam tahap review adsense.

Karena memang tidak dipungkiri bahwa dominan blogger ketika ini membuat sebuah situs blog dengan tujuan untuk mencari pendapatan melalui kegiatan kolaborasi Google Adsense. Memang tidak sanggup dipungkiri bahwa daya tarik Google Adsense sangatlah mahir sehingga sekarang banyak orang yang mencoba untuk mempelajarinya.

Baca Juga : Cara Membuat Tanda Centang/Ceklis (√) di Samping Judul Postingan Blog

Mungkin beberapa situs lain mempunyai penyebutan berbeda untuk halaman kontak misal Contact Me , Contact Us , Contact , Hubungi Kami atau Form Kontak . Namun pada pada dasarnya semua itu sama,karena yang dimaksud dengen Halaman Kontak pada Blogger yakni sebuah laman statis yang menampilkan daftar kontak dari admin/tim redaksi sebuah blog berupa nomor telphone,akun sosial media,email atau sebuah form kontak yang akan mengirim pesan secara otomatis ke email admin.


Manfaat Memiliki Halaman Kontak di Blogger :


Di dunia ini tidak ada satu hal pun yang tidak mempunyai manfaat,termasuk halaman contact pada suatu blog / website. Berikut ini manfaat yang akan kau dapatkan dengan adanya Form Kontak di Blogger :

1. Memudahkan Untuk Berinteraksi Dengan Pengunjung Setia


Dengan mempunyai halaman kontak blogger kita akan lebih gampang berinteraksi dengan pengunjung,misal menjawab apa yang di tanyakan oleh pengunjung,menerima dan menjawab request artikel yang di inginkan pengunjung dan fasilitas lainnya.

2. Memudahkan Calon Rekan Bisnis Untuk Menghubungi Kita


Seperti yang kita tahu bahwa ketika ini sudah berbagai perusahaan atau produk-produk ternama yang menghubungi admin/author blog untuk memperlihatkan bisnis timbal balik berupa content placement atau endorsement. Dimana nanti kita selaku blogger akan di minta untuk mengulas,membuat atau menerbitkan artikel yang membahas perusahaan mereka atau produk yang mereka punya ( dominan artikel sudah di sediakan ) kemudian nanti kita akan mendapat bayaran berupa sejumlah uang atau penawaran menarik lainnya yang sudah mereka tawarkan sebelumnya.

Dengan mempunyai halaman kontak blogger tentu akan memudahkan calon rekan bisnis menghubungi kita,sehingga kita tidak akan melewatkan kesempatan berharga menyerupai ini.

3. Memudahkan Untuk Lolos Review Adsense


Apapun alasan seseorang membuat situs web / blog niscaya suatu ketika akan ada masa dimana mereka tertarik atau berkeinginan mendaftarkan website yang mereka miliki ke Google Adsense untuk sanggup mendapat penghasilan walau sekedar untuk membeli kuota atau justru hingga menjadi honor bulanan mereka.

 Baca Juga : Cara Mendaftarkan Blog / Situs Web ke Google News semoga Praktis Diterima dan Meningkatkan Visitor

Dan salah satu syaratnya yakni kelengkapan navigasi suatu blog menyerupai halaman About,Contact,Disclaimer dan Privercy Policy. Beberapa orang juga menambahkan halaman lain menyerupai Sitemap dan Term Of Service.

Cara Membuat Halaman Kontak Blogger


Ada banyak cara untk membuat halaman kontak di blogger,berikut ini tutorial memasang kontak blogger yang sudah rangkum dan merupakan metode yang banyak dipakai oleh blogger-blogger lain :

1. Halaman Kontak Blogger Sederhana


Seperti pada Gambar diatas Halaman Kontak Blogger Sederhana yang saya maksud yakni laman statis yang tidak memunculkan fitur-fitur tertentu yang membuat anda harus memakai script/kode tertentu. Anda cukup menuliskan kata-kata yang menyatakan bahwa apabila mempunyai kepentingan sanggup menghubungi daftar kontak yang tersedia. Contoh blogger yang memakai metode ini yakni Timon Adiyoso admin dari mastimon.com ,anda sanggup melihat demonya di => Halaman Kontak Mastimon

a. Berikut kelebihan yang sanggup kau dapatkan jika memakai metode Halaman Kontak Blogger Sederhana :


  • Lebih Mudah


Ya tentu saja,karena tidak perlu memakai isyarat atau script tertentu anda tidak akan dibentuk pusing untuk melaksanakan pengeditan,hanya menulis menyerupai biasa dengan diawali beberapa kalimat sebagai klarifikasi kemudian menuliskan setiap kontak anda yang sanggup orang lain hubungi jika mempunyai suatu kepentingan.


  • Lebih Ringan


Karena yang halam hanya akan berisi teks maka akan lebih ringan diakses,berbeda jika anda memakai script menyerupai CSS,JS dan HTML. Akan berat untuk dibuka jika anda sendiri belum terlalu paham bagaimana cara mengatur coding semoga ringan diakses.

b. Berikut ini kekurangan dari halaman kontak blogger yang sederhana :


  • Kurang Keren


Sesuai namanya " SEDERHANA " ,tentu saja tampilan yang dimiliki oleh halaman form kontak ini sangatlah standar sebab hanya berupa tulisan-tulisan saja. Namun sebetulnya ini bukanlah persoalan besar. Lagipula yang terpenting itu fungsi dan manfaatnya.

Berikut ini cara membuat Halamaan Kontak sederhana di Blog



  • Buka Blogger.com
  • Sign in dengan akun Anda
  • Masuk ke Dashboard Blogger
  • Pilih Menu Halaman
  • Klik Halaman Baru
  • Beri Judul " Hubungi Saya " , " Form Kontak " , " Contact Us " , " Contact Me " atau lainnya sesuka anda
  • Lalu tuliskan kata-katanya dan daftar kontak anda.
  • Bila anda resah bagaimana cara menulis pada halaman kontak semoga menarik anda sanggup memakai goresan pena berikut :


Halo.. selamat tiba di ( url situs anda).
(Nama Situs Anda) yakni sebuah website/blog yang berisi perihal (sebutkan deskripsi blog anda menyerupai niche/tema dan lain-lain)
Disini saya selaku admin menyediakan daftar kontak apabila anda ingin terhubung kepada saya untuk suatu keperluan menyerupai content placement,guest post,request artikel atau ada pertanyaan penting.
Email :
Facebook :
Instagram :
Twitter :
Telp/SMS/WA :
Harap sertakan nama anda semoga kita sanggup saling mengenal dan lebih gampang untuk saling menghubungi di lain waktu. Terimakasih


  • Silahkan anda sesuaikan dengan kebutuhan anda. Atau anda juga sanggup menyesukaian dengan kata-kata lain yang anda mau.
  • Bila sudah klik Publikasikan


Itulah cara membuat halaman Form Kontak Sederhana di Blogger,tentu ini cukup gampang khususnya untuk pemula sebab tida perlu melaksanakan edit HTML atau script lainnya. Cukup menulis biasa menyerupai ketika anda sedang membuat artikel.

Baca Juga : Cara Membuat Warna Address Bar Berubah Mengikuti Warna Blog di Browser Mobile

2. Membuat Halaman Kontak di Blogger VioMagz


Ada kabar baik untuk kalian pra pengguna template VioMagz,bahwa untuk membuat halaman form kontak itu sangatlah gampang sebab Mas Sugeng sudah berbagi fiturnya di dalam template. Kita hanya memerlukan isyarat pemanggil untuk memunculkan form kontak di halaman statis blogger.

Seperti yang sudah anda ketahui bahwa template buatan Mas Sugeng selain mempunyai tampilan yang keren juga mempunyai fitur-fitur yang canggih dan sudah di optimalkan sebaik mungkin. Sehingga kita sebagai pelanggan sanggup dengan gampang menggunakannya.

a. Kelebihan Halaman Form Kontak VioMagz


  • Simple, Keren dan Elegan


Tentu saja,seperti konsep utama yang Mas Sugeng terapkan pada template VioMagz yaitu Simple, Keren dan Elegan. Begitu juga dengan form konak bawaan khusus VioMagz ini,Mas Sugeng sudah mendesainnya semoga sesuai dengan tampilan tema.


  • Ringan / Fast Load


Karena kode-kode penyusun form kontak VioMagz ini sebetulnya sudah terpasang di dalam struktur template dan secara fitur ini merupakan modifikasi dari form kontak blogger sendiri,sehingga tidak akan membuat loading blog anda menjadi berat. Karena setiap isyarat yang dipakai akan di load dari template dan blogger langsung,bukan dari sumber eksternal.


  • Responsive


Responsive merupakan sebuah fitur yang paling penting dalam perkembangan internet ketika ini,selain untuk membuat situs kita lolos dalam seleksi algoritma Google,fitur Responsive yang akan membuat tampilan blog berubah mengikuti ukuran layar dari perangkat yang mengaksesnya akan membuat pengunjung lebih merasa nyaman. Sehingga meningkatkan skor UI dan UX blog kita.

b. Kekurangan Halaman Form Kontak VioMagz


  • Tampilan Sederhana


Sebenarnya saya sendiri resah apa yang harus saya tuliskan untuk kekurangan dari form kontak blogger VioMagz,karena secara fitur ini sudah cukup manis dan berfungsi baik. Mungkin satu-satunya kekurangan dari form kontak ini hanyalah dari tampilannya saja yang sederhana. Namun walau sederhana tetaplah terlihat Simple, Keren dan Elegan. Lagipula yang terpenting bukanlah dari segi tampilannya tapi fungsionalitas. Dan sejauh ini belum ada kesalahan fungsi apapun.

Cara Membuat Halaman Form Kontak di VioMagz :


Saya sudah pernah membahas perihal tutorial ini,bila anda tertarik untuk membacanya silahkan cek tutorial saya perihal => Cara membuat halaman form kontak blogger di VioMagz ,anda juga sanggup membaca tutorial aslinya dari Mas Sugeng di =. Cara Memasang Form Kontak di Halaman Statis Template VioMagz & VioToko .

Namun jika anda ingin tahu tutorialnya secara singkat maka saya akan menjelaskan caranya,berikut ini tutorial membuat halaman kontak blogger viomagz :


  • Buka Blogger.com
  • Sign in dengan Akun Anda
  • Masuk ke Dashboard Blogger
  • Masuk ke sajian Halaman
  • Klik Halaman Baru
  • Beri Judul " Form Kontak " " Kontak Saya " " Hubungi Saya " atau yang lainnya
  • Lalu ubah sajian editor dari Compose menjadi HTML
  • Dan Masukkan Kode Berikut :


<div class="contact-form-widget">
<form name="contact-form">
<span class="ctitles">Nama :</span>
<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" type="text" value="" />
<span class="ctitles">Alamat Email <span class="swajib">*</span> :</span>
<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" type="text" value="" />
<span class="ctitles">Isi Pesan <span class="swajib">*</span> :</span>
<textarea class="contact-form-email-message" id="ContactForm1_contact-form-email-message" name="email-message" rows="10"></textarea>
<input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Kirim" />
<br />
<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>
<script src="https://www.blogger.com/static/v1/widgets/2271878333-widgets.js" type="text/javascript"></script>


  • Bila sudah anda klik Publikasikan


Itulah cara membuat halaman kontak Blogger di template VioMagz,anda cukup memasang isyarat pemanggil di halaman statis saja. Tidak perlu mengedit HTML dari template anda yang mungkin akan merusak struktur template anda atau membuatnya menjadi error,loadingnya berat dan kemungkinan lainnya. Dengan memakai Form Kontak VioMagz di halaman statis blogger akan membuat anda mempunyai tampilan kontak yang keren dan tetap menjaga kecepatan loading blog.

3. Membuat Halaman Contact Us menyerupai Form Kontak milik VioMagz


Sebelumnya kita sudah membahas perihal cara membuat form konta viomagz,dan sebagian dari anda mungkin tetarik untuk memakai form kontak yang sama menyerupai VioMagz namun template yang anda gunakan berbeda. Tenang saja sebab saya akan mengatakan solusinya,yaitu dengan membuat halaman kontak blogger menyerupai viomagz.

Baca Juga : Cara Instal Ulang Windows 7 Tanpa Menggunakan Flashdisk atau CD

Berikut ini tutorial Membuat Widget Form Kontak Blogger Mirip Punya VioMagz :


  • Masuk ke Blogger.com
  • Sign in dengan Akun Anda
  • Masuk ke Dashboard Blogger
  • Pilih Menu Tata Letak
  • Pilih Tambahkan Gadget ( dimana saja )




  • Lalu pilih Widget Formulir Kontak, klik pada tanda +




  • Lalu anda akan di bawa ke jendela berikut untuk memberi Judul Widget




  • Lalu klik Simpan,bila sudah muncul Panel Widget Formulir Kontak pada kawasan anda mengeklik Tambahkan Gadget maka anda sudah berhasil memasangnya,berikut misalnya :




  • Setelah itu anda pindahkan panel widgetnya ke bawah Posting Blog menyerupai berikut :




  • Setelah itu masuk ke sajian Tema > Edit HTML
  • Cari Kode berikut :


]]></b:skin>


  • Bila ketemu,tempelkan script berikut ini sempurna di atasnya isyarat tadi


.widget.ContactForm {
display: none;
}


  • Setelah itu klik Simpan Tema
  • Masuk ke sajian Halaman
  • Klik Halaman Baru
  • Beri Judul " Form Kontak " " Hubungi Saya " atau yang lainnya
  • Ubah mode Editor dari Compose menjadi HTML
  • Lalu Masukkan isyarat berikut ini


<style type="text/css">
.widget.ContactForm {
display: block;
}
.post-footer {
display: none;
}
#blog-pager {
display: none;
}
.blog-feeds {
display: none;
}
.widget.ContactForm .title {
display: none;
}
.widget.ContactForm * {
max-width: 100%;
}
</style>


  • Setelah itu klik Publikasikan

Anda sudah simpulan memasang form kontak menyerupai punya VioMagz di template blogger anda

Itulah cara membuat widget formulir kontak di halaman statis blogger menyerupai dengan VioMagz,memang cukup ribet jika anda belum terbiasa melaksanakan edit HTML pada blogger. Namun yang terpenting kau sanggup berhasil membuat form kontak yang simple , keren dan elegan walau tidak memakai Template VioMagz .

4. Cara Membuat Widget Kontak di Halaman Statis Blogger memakai Foxy Form


Bila anda tidak terlalu paham dengan coding atau ingin membuat halaman contact us memakai formulir kontak yang sanggup anda custom isi dan warna-warnanya,maka foxy form yakni pilihan yang terbaik untuk anda.

Anda sanggup dengan gampang menentukan kontak apa saja yang akan ada di form kontak kalian,entah itu nama,email,alamat atau yang lainnya,selain itu anda juga sanggup dengan gampang mengatur warna dari setiap elemen yang ada di formulir kontak.

a. Kelebihan Contact Form Blogger dari Foxy Form


  • Mudah di Buat


Kamu tidak perlu merancang script atau code sendiri,kamu hanya perlu menentukan akan menyerupai apa tampilan formulir kontakmu dan nanti ada script yang sudah jadi dari hasil foxy form buatan anda.


  • Bisa Di Kustom


Bila formulir kontak yang sebelumnya mungkin tidak sanggup anda kustomisasi menyerupai mengganti warnanya,menentukan font dan menambah atau mengurangi jumlah field yang akan muncul di formulir kontak.

Baca Juga : 3 Penyebab Baterai Laptop Drop/Rusak Sehingga Tidak Mau Menyimpan Daya

b. Kekurangan Form Contact dari Foxy Form


  • Loading Berat


Walaupun mungkin dari segi fasilitas pembuatan dan tampilan foxy form mempunyai beberapa keunggulan,namun dari segi loading cukup berat. Sehingga faktor ini merupakan kekurangan yang perlu anda ketahui.

Hal ini sebab ada file-file dan script yang harus di load oleh blog kita dari sumber eksternal alias server miliki Foxy Form. Sehingga menambah jumlah request ke external source yang akan membuat loading blog menjadi lebih berat.

Berikut ini tutorial lengkap cara membuat form kontak di halaman statis blogger dengan Foxy Form



  • Buka situs FoxyForm
  • Nanti kita akan masuk ke halaman kawasan kita setting template dari formulir kontaknya
  • Di sini/ kepingan pertama yaitu kolom Setting ,anda pilih Field apa saja yang akan tampil di Contact Form,ada Nama,email dll




  • Setting Field untuk Formulir Kontak dari Foxy Form
  • Lalu di bawahnya yaitu Advance Setting anda akan diberi pengaturan untuk menentukan warna background,lalu warna dan ukuran serta jenis font yang akan anda gunakan.




  • Lalu di sini yakni kolom Target e-mail address,anda isikan email yang anda gunakan untuk nantinya mendapatkan email yang di kirim melalui foxy form




  • Lalu anda isi juga kepingan Antispam Protection berupa check captcha sebagai verifikasi




  • Klik Create Formular
  • Nanti akan muncul isyarat HTML menyerupai berikut




  • Anda copy semua script codenya
  • Lalu anda buka Blogger.com
  • Sign in dengan akun anda
  • Masuk ke Menu Dashboard Blogger
  • Pilih Menu Halaman
  • Klilk Halaman Baru
  • Ubah mode editor dari Compose menjadi HTML
  • Dan tempelkan script code yang sudah anda dapatkan dari foxy form tadi
  • Setelah itu klik Publikasikan


Anda sudah simpulan membuat widget form kontak di halaman statis blogger memakai foxy form,cukup gampang bukan? anda tidak perlu menyusun rangkaian code sendiri. Hanya perlu klik dan klik nanti hasil dari desain formulir kontak yang anda buat sudah menjadi isyarat HTML. Dan anda sanggup memasangnya di halaman statis blogger anda.


5.Cara Membuat Widget Contact Us di Halaman Statis Blogger dengan 123ContactForm




Untuk membuar formulir kontak hubungi saya di halaman statis memakai 123FormBuilder kurang lebihnya sama menyerupai saaat anda membuat dengan FoxyForm,anda cukup klik dan klik untuk menentukan setiap pengaturan dan Nanti akan ada isyarat HTML yang merupakan hasil dari formulir kontak desain anda.

a.Kelebihan Formulir Contact Us/Contact Me dari 123FormBuilder


  •  Mudah di Buat


Anda tidak perlu menyusun coding sendiri dari awal sehingga membuat anda pusing dan bingung,atau justru script yang sudah anda buat tidak sanggup bekerja.


  • Mudah di Modif


Bisa menentukan warna,jenis dan ukuran font yang akan kita gunakan di form contact sehingga kita gampang untuk memodifikasi tampilannya sesuai impian kita.


  • Tampilan Keren


Dengan fasilitas modifikasi tampilan tentu akan lebih memudahkan kita untuk membuat tampilan yang keren.

b.Kekurangan Widget Contact Blogger dari 123FormBuilder


  • Berat


Sama menyerupai Foxy Form. Karena ada file dan data yang harus di load oleh blog dari sumber eksternal,sehingga mengakibatkan loading blog bertambah berat.

Cara Membuat Widget Contact Us dengan 123FormBuilder di Blogger



  • Pertama anda buka terlebih dahulu situs resminya 123FormBuilder
  • Lalu klik Sign Up




  • Anda sanggup menentukan untuk membuat akun 123FormBuilder atau bergabung dengan menggunakana akun Gmail,Yahoo,Facebook atau Microsoft




  • Lalu anda akan diberi pilihan harga dan metode pembayaran,pilih saja Basic Plan yang Free

  • Anda akan dibawa ke halaman menyerupai berikut,klik saja Template Gallery




  • Bila anda sudah di halaman Template Gallery,silahkan pilih Contact Form




  • Disini anda sanggup melaksanakan kustomisasi menyerupai penggantian warna,jenis dan ukuran font,jumlah field dll. Bila Sudah anda klik Publish




  • Disini anda pilih Platform > Blogger ,akan muncul isyarat javascript anda pilih Copy Code



  • Lalu anda buka Bloger.com
  • Sign Up dengan akun anda
  • Masuk ke Dashboard Blogger
  • Pilih sajian Halaman
  • Klik Halaman Baru
  • Ubah mode editor dari Compose menjadi HTML
  • Lali tempelkan isyarat dari 123FormBuilder yang sudah anda copy tadi
  • Setelah itu klik Publikasikan
  • Selesai


Itulah cara membuat widget contact us di halaman statis blogger memakai 123FormBuilder ,cukup gampang bukan? anda hanya perlu melaksanakan klik dan klik untuk mendesain dan mengubah tampilan dari formulir kontak anda dan nantinya sudah tersusun menjadi rangkaian script code. Anda tidak perlu dipusingkan untuk merancang isyarat HTML untuk membuat sebuah formulir kontak.

Penutup


Itulah 5Cara Membuat Halaman Form Kontak ( Contact Us , Contact Me ) di Blogger dengan Mudah,dari ke 5 cara diatas yang paling saya suka yakni halaman kontak sederhana ala mastimon sebab membuatnya mudah,hanya perlu menulis menyerupai biasa. Tidak perlu memakai script code apapun sehingga tidak akan memberatkan loading blog anda ataupun menghipnotis skor seo.

Selain itu form kontak viomagz dan ala viomagz juga merupakan favorit saya,karena tampilannya yang simple,keren dan elegan. Selain itu fitur yang dipakai pada widget contact form ini merupakan gadget orisinil dari blogger sendiri. Dimana kita tidak perlu mengambil file apapun dari situs eksternal dan tidak akan menghipnotis loading pada blog kita.

Baca Juga : Cara Daftar Baru dan Registrasi Ulang Kartu Prabayar Melalui Online atau SMS Semua Operator 2019

Sedangkan untuk Foxy Form dan 123FormBuilde saya kurang tertarik,walau mungkin kita sanggup kustom tampilannya semoga sesuai impian kita dan menghasilkan desain yang keren,namun jika kita menggunakannya maka akan membuat loading berat dan jumlah request yang dilakukan blog kita semakin banyak.

Baiklah cukup sekian tutorial membuat halaman kontak di blogger,silahkan anda pilih yang sesuai dengan minat anda dan yang paling cocok dengan situs anda. Selamat Mencoba.
Sumber https://www.dirga.id/

Anda mungkin menyukai postingan ini :