Membuat halaman kontak pada blogspot

Gambar 147. ID: Pada blog yang di buat menggunakan blogspot, formulir kontak dapat ditambahkan melalui penambahan gadget. Jika teman-teman ingin melakukanya, silahkan pergi ke dashboard blog yang ingin ditambahkan halaman kontak, pilih menu tata letak, klik tambah ga

Membuat halaman kontak pada blogspot

Terimakasih teman-teman datang untuk membaca tutorial ini, dan mudah-mudahan tutorial ini akan berguna bagi teman-teman para pembaca blog.

Kita semua tau akan pentingnya halaman kontak untuk sebuah blog atau website, dimana melalui halaman kontak ini kita dapat berinteraksi dengan para pengunjung bllog atau website kita.

Pada blog yang di buat menggunakan blogspot, formulir kontak dapat ditambahkan melalui penambahan gadget. Jika teman-teman ingin melakukanya, silahkan pergi ke dashboard blog yang ingin ditambahkan halaman kontak, pilih menu tata letak, klik tambah gadget pada posisi yang di kehendaki, klik pada tab gadget lainya, klik icon plus di samping formulir kontak, tentukan nama atau judul formulir kontak tersebut, klik simpan. Selanjutnya teman-teman bisa lakukan uji coba.

Akan tetapi pada tutorial kali ini, kita akan "Membuat halaman kontak pada blogspot", bukan melalui penambahan gadget. Sebagai contoh silahkan kunjungi Halaman kontak blog Kerabat Digital Marketing di https://developmentmultibisnisindo.blogspot.co.id/p/kontak.html.

Baca Juga:

Langkah-langkah pembuatan halaman kontak:

Pada dashboard blog teman-teman, silahkan klik menu TEMPLATE, klik tombol EDIT HTML. Carilah kode berikut:

]]></b:template-skin>

Caranya silahkan copy kode tersebut, klik pada bidang kode html, lalu klik ctrl+f setelah itu di sudut kanan atas akan muncul bidang teks, silahkan tempel di sana kodenya lalu klik enter.
Setelah teman-teman menemukan kode tersebut, copy kode css dibawah ini lalu tempel di atas kode yang tadi teman-teman cari, jika sudah silahkan klik save, lihat gambar berikut:

/*contact form by www.multibisnisindo.com*/
.contact-form-respond {
 padding-left: 20px;
}

.contact-form-respond:before {
 font-family: 'rt-icons';
 content: "e600";
 padding-right: 10px;
}

.mycontact{
 background-image: url(../example/parallax/services.jpg);
}
/*forms*/


.form-control{
 margin: 8px;
}

.form-control {
 height: 42px;
 border-color: #e4e4e4;
 border-radius: 1px;
 color: #1D1D1D;
}

.form-control, .form-control:focus {
 -webkit-box-shadow: none;
 box-shadow: none;
}

.form-control.invalid {
 -webkit-box-shadow: 0 0 0 2px #4bb8e7;
 box-shadow: 0 0 0 2px #4bb8e7;
}

.form-control:focus {
 border-color: #7f7f7f;
 color: #7f7f7f;
}

.form-control:-moz-placeholder {
 color: #7f7f7f;
 opacity: 1;
}

.form-control::-moz-placeholder {
 color: #7f7f7f;
 opacity: 1;
}

.form-control:-ms-input-placeholder {
 color: #7f7f7f;
}

.form-control::-webkit-input-placeholder {
 color: #7f7f7f;
}

.form-control:focus:-moz-placeholder {
 color: transparent;
 opacity: 1;
}

.form-control:focus::-moz-placeholder {
 color: transparent;
 opacity: 1;
}

.form-control:focus:-ms-input-placeholder {
 color: transparent;
}

.form-control:focus::-webkit-input-placeholder {
 color: transparent;
}

.darkgrey_section .form-control {
 color: #ffffff;
 border-color: #4e4e4e;
 background-color: #3c3c3c;
}

.dark_section .form-control {
 color: #ffffff;
 border-color: #373737;
 background-color: #252525;
}

.color_section .form-control {
 color: #ffffff;
 border-color: #78caed;
 background-color: #58bde9;
}

.color_section .form-control:-moz-placeholder {
 color: #d2edf9;
}
.color_section .form-control::-moz-placeholder {
 color: #d2edf9;
}
.color_section .form-control:-ms-input-placeholder {
 color: #d2edf9;
}
.color_section .form-control::-webkit-input-placeholder {
 color: #d2edf9;
}
.color_section .form-control:focus:-moz-placeholder {
 color: transparent;
 opacity: 1;
}
.color_section .form-control:focus::-moz-placeholder {
 color: transparent;
 opacity: 1;
}
.color_section .form-control:focus:-ms-input-placeholder {
 color: transparent;
}
.color_section .form-control:focus::-webkit-input-placeholder {
 color: transparent;
}

.shop-filter .form-control,
.single-product-description .form-group,
.single-product-description .form-control {
 display: inline-block;
 width: auto;
}


a > [class*="rt-icon-"],
.theme_button > [class*="rt-icon-"] {
 font-size: 1.5em;
 line-height: 0;
 position: relative;
 top: 3px;
 padding-right: 4px;
}

.theme_button > [class*="glyphicon"],
.theme_button > [class*="fa-"] {
 padding-right: 7px;
}

.theme_button > [class*="rt-icon-"],
.theme_button > [class*="glyphicon"],
.theme_button > [class*="fa-"] {
 margin-left: -7px;
}

/* 
**buttons 
*/
.theme_button {
 font-size: inherit;
 padding: 20px 20px;
 line-height: 1;
 display: inline-block;
 background-color: transparent;
 color: #ffffff;
 text-transform: uppercase;
 border: 1px solid #4bb8e7;
 background-color: #4bb8e7;
 -webkit-border-radius: 2px;
 border-radius: 2px;
 position: relative;
 -webkit-transition: all 0.4s linear 0s;
 -moz-transition: all 0.4s linear 0s;
 -o-transition: all 0.4s linear 0s;
 -ms-transition: all 0.4s linear 0s;
 transition: all 0.4s linear 0s;
}

.theme_button:active,
.theme_button:hover,
.theme_button:focus {
 color: #ffffff;
 background-color: #343434;
 border-color: #343434;
 opacity: 1;
 text-decoration: none;
 outline: none;
 -webkit-transition: all 0.1s linear 0s;
 -moz-transition: all 0.1s linear 0s;
 -o-transition: all 0.1s linear 0s;
 -ms-transition: all 0.1s linear 0s;
 transition: all 0.1s linear 0s;
}

.theme_button:active {
 top: 1px;
}

.theme_button.border {
 background-color: transparent;
 border: 2px solid #4bb8e7;
 padding-top: 13px;
 padding-bottom: 13px;
}

.block_button {
 display: block;
 text-align: center;
}


/*dividers*/
.divider20 {
 margin: 20px 0;
 border: 0;
 color: transparent;
}

.divider40 {
 margin: 40px 0;
 border: 0;
 color: transparent;
}

Selanjutnya silahkan klik menu halaman, lalu buat halaman baru dengan judul kontak. Copy dan tempel script di bawah ini pada bidang entri atau konten dengan menggunakan mode HTML.

Ambil Script Formulir Kontak

Perhatikan pada baris ke enam, disitu terdapat baris berikut:
var blogId = 'Ganti ini dengan blog id kamu';//this number should be mandatorily edited.
Kalimat dalam tanda petik yang berbunyi(Ganti ini dengan blog id), silahkan ganti dengan blog id teman-teman. Cara mendapatkan blog id silahkan lihat address bar dan lihat gambar address bar.

Baca Juga: Belajar Struktur HTML Dasar

Setelah itu kembali lagi gunakan mode COMPOSE untuk merubah teks atau kontak yang ada(phone dan alamat), selanjutnya silahkan klik PUBLIKASIKAN. Setelah di publikasikan, arahkan mouse pada bagian bawah judul halaman kontak yang baru saja di buat dan klik LIHAT untuk mendapatkan URL halaman kontak yang baru saja di publikasikan. Silahkan copy url halaman kontak pada address bar untuk pembuatan atau penambahan menu kontak.
Silahkan teman-teman sesuaikan menu blognya, tambahkan menu kontak!

Sekarang kunjungi blog teman-teman dan kLik menu kontak, apakah disitu terdapat formulir kontak? Jika benar, sekarang teman-teman sudah memiliki halaman kontak. Untuk yang terakhir silahkan lakukan uji coba dengan mengirimkan pesan kontak melalui formulir tersebut.

Post Terkait
Author

Administrator

28 November 2016

Hey..... Apa kabar? Semua artikel dan layanan yang kami sediakan di sini semata-mata untuk kepentingan pengguna dan klien. Jadi jika Anda merasa membutuhkan pelayanan kami silahkan jangan ragu untuk menghubungi. Kami juga bersedia untuk melayani konsultasi online melalui media sosial, melalui komentar dan melalui halaman testimonial yang telah kami sediakan. Selain itu Anda juga dapat menggunakan kontak form yang tersedia.

Jika apa yang anda dapatkan dari situs ini bermanfaat, silahkan dukung dengan like dan share . Terimakasih telah berkunjung, silahkan kembali kapanpun anda merasa membutuhkan layanan yang kami sediakan.

Status Akun Iklan 11 Juni 2024

Saya sampaikan bahwa status akun iklan sudah saya cek dan saya kelola. Sehingga pagi ini siap untuk di jalankan.

Abaikan notifikasi/tanda yang ada; Dibatasi anggaran, merah, kuning, apapun itu mohon di abaikan. Saya sudah pertimbangkan dan sesuaikan di masing-masing akun. Pagi ini, pukul 04.45 WIB saya baru selesai periksa dan setting semua akun. Sehingga tidak ada lagi yang perlu di tanyakan. Silahkan jalankan iklan.
Ingin berbagi dengan multibisnisindo dan memberikan kontribusi....? Tulis pengalamanmu Di Sini

Terimakasih
JOPanda

Tidak ada komentar terkait posting ini, Ingin memberi komentar?