Membuat Form Contact dari Blogger di Halaman Statis

7/10/2013

Membuat Form Contact dari Blogger di Halaman Statis - Jika sebelumnya Tukang toko online sudah  membagikan tutorial membuat widget contact form resmi dari Blogger, maka saat ini akan berbagi lagi tutorial cara memindahkan widget contact form ke halaman statis (static page).

Ikuti panduan berkut ini untuk memindahkan widget Contact Form ke halaman yang terpisah/tersendiri
  1. Pertama kali, tambahkan Blogger Contact Form Widget ke sidebar anda seperti yang sudah pernah ditulis dalam posting sebelumnya. (Nantinya widget ini akan kita sembunyikan) . 
  2. Kemudian buat sebuah laman baru di blog anda.
    create-new-page-in-blogger
  3. Copy kode contact form di bawah ini :
    Kode contact form:
    <form name='contact-form'>
    <div>Your Name : </div>
    <input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' type='text' value=''/>
    <div>Your Email: <em>(required)</em></div>
    <input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' type='text' value=''/>
    <div>Your Message: <em>(required)</em></div>
    <textarea class='contact-form-email-message' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea>
    <p></p>
    <input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Send'/>
    <div style='text-align: center; max-width: 450px; width: 100%'>
    <p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
    <p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
    </div>
    </form>
    
    Saat membuat laman ini, anda harus mengganti kode dalam mode HTML seperti gambar di bawah. Kemudian paste kode di atas ke dalam bagian post editor, disable komentar dan publish laman anda.
    blogger-comment-form-on-separate-page
  4. Selanjutnya menuju ke Template > Edit HTML
    blogger-edit-html

    dan langsung lompat ke kode widget contact form, lalu expand kode widgetnya
    jump-to-contact-form-widget
    expand-contact-form-widget
    dan kemudian expand tag b:includable
    expand-contact-form-widget-main-includable
    selanjutnya delete kode seperti di bawah ini
    delete-bincludable-of-contact-form
    sehingga hasil akhirnya seperti ini
    contact-form-widget-should-look-like
    Sekarang kita sudah mencegah munculnya contact form di sidebar halaman manapun
    . Pastikan bahwa anda tidak membuang widget tsb dari halaman tata letak / Layout.
  5. Save Template dan berhasil. Anda sudah memiliki halaman kontak yang resmi dai Blogger widget yang akan menuju ke gmail anda
Semoga bermanfaat

Sumber  : bloggerplugins.org

All posts here about online store, tips, tricks, SEO, Store Service, store builder with Blogspot, Wordpress or Opencart.
Contact me if You need help or more question about service. Enjoy reading.....

Artikel Terkait

Previous
Next Post »

5 komentar

Write komentar
22 Juli 2014 00.03 delete

Kontak form memang sangat penting ya, salah satu urgensinya adalah untuk menghubungi pemilik blog sebagai saran atau kritik yang ingin disampaikan. :D salam hangat dari www.terwujud.com

Reply
avatar
Eleven Toko
AUTHOR
27 Desember 2014 15.53 delete Komentar ini telah dihapus oleh administrator blog.
avatar
28 Januari 2015 14.45 delete

Untuk nambahin satu baris untuk form kontak, misal kode pos, itu gimana min?

Reply
avatar
Eris Risno
AUTHOR
29 Juni 2015 00.24 delete

Yes berhasil bos ,terima kasih izin sedoot

http://www.jhangsoen.my.id

Reply
avatar
hafiz
AUTHOR
2 Juni 2016 12.38 delete Komentar ini telah dihapus oleh pengarang.
avatar

#/ Dilarang melakukan SPAM.
#/ Dilarang Komentar mengandung Link/URL di kolom komentar
#/ Dilarang Komentar SARA dan Makian
#/ Dilarang ngiklan
Melanggar ketentuan di atas, komentar langsung dihapus..!!!
Emoticon