Cara Memindahkan Contact Form Blogger Ke Static Page

Terdapat penyedia dan pembuat Contact Form berbayar. Pembuat Contact Form ini menyediakan sebuah Static Page khusus Contact dengan script yang cukup kompleks dengan banyak sekali fitur ataupun element-element yang umumnya sudah menjadi sebuah standar untuk blog professional.
Diluar itu, blogger juga menyedikan sebuah Contact Form official yang sanggup dipakai oleh para pemilik blog secara cuma-cuma. Sayangnya penggunaannya relatif terbatas, terutama pada lokasi penempatannya dan form yang disediakan. Contact form official yang telah disediakan berbentuk Widget yang hanya sanggup diletakan Sidebar pada sebuah blog. Dan mungkin beberapa orang akan beropini bahwa lokasi Contact Form di Sidebar kurang lezat dipandang, alasannya yakni akan berhimpitan dengan Widget lainnya. Sehingga tampilan blog terlihat semakin sesak.
Alternatif pertama bagi pemilik blog, mungkin mereka akan membuat Static Page yang berisikan Script Contact Form yang telah didapatkan dari source lain (selain blogger). Namun ternyata kita sanggup memindahkan Contact Form yang telah disediakan blogger ini, dari Sidebar ke sebuah Static Page, hanya dengan sedikit mengakalinya. Kaprikornus kita tidak perlu lagi repot mencari script contact form dari banyak sekali source lain.
Cara Memindahkan Contact Form Blogger Ke Static Page
Ikuti langkah-langkah berikut. Untuk Demo, kau sanggup melihat Contact page milik Akira di Blog ini. Atau pribadi klik di sini.. Contact Me
1. Pasang widget Contact Form yang telah disedikan blogger. Pasang di Sidebar pada blog.
2. Temukan dan salin BlogID milik kalian. BlogID dibutuhkan untuk memunculkan code yang nantinya berfungsi untuk membuat Contact Form baru. BlogID sanggup kau temukan di address kafe pada browser dikala kau sedang membuka blog milik kamu. Contoh BlogID pada screenshot dibawah ini.
3. Buat page baru. Dan salin Script di bawah ini. Paste pada page tersebut dalam mode HTML. Ubah juga bab BlogID, gunakan BlogID kalian masing-masing, yang sudah kau dapatkan dari step 2 tadi.
<script>
var blogId = '8694494030520005341';//this number should be mandatorily edited.
//The below message 5 Strings can also be edited
var contactFormMessageSendingMsg ='Sending...';
var contactFormMessageSentMsg = 'Your message has been sent.';
var contactFormMessageNotSentMsg = 'Message could not be sent. Please try again later.';
var contactFormEmptyMessageMsg ='Message field cannot be empty.';
var contactFormInvalidEmailMsg = 'A valid email is required.'
var widgetLoaded=false;
function sendEmailMsg() {
if(widgetLoaded== false) {
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'sidebar', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': contactFormMessageSendingMsg , 'contactFormMessageSentMsg': contactFormMessageSentMsg , 'contactFormMessageNotSentMsg': contactFormMessageNotSentMsg , 'contactFormInvalidEmailMsg': contactFormInvalidEmailMsg , 'contactFormEmptyMessageMsg': contactFormEmptyMessageMsg , 'title': 'Contact Form', 'blogId': blogId, 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull'));
widgetLoaded=true;
document.getElementById('ContactForm1_contact-form-submit').click();
}
return true;
}
</script>
<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' onclick="sendEmailMsg()"/>
<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>
var blogId = '8694494030520005341';//this number should be mandatorily edited.
//The below message 5 Strings can also be edited
var contactFormMessageSendingMsg ='Sending...';
var contactFormMessageSentMsg = 'Your message has been sent.';
var contactFormMessageNotSentMsg = 'Message could not be sent. Please try again later.';
var contactFormEmptyMessageMsg ='Message field cannot be empty.';
var contactFormInvalidEmailMsg = 'A valid email is required.'
var widgetLoaded=false;
function sendEmailMsg() {
if(widgetLoaded== false) {
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'sidebar', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': contactFormMessageSendingMsg , 'contactFormMessageSentMsg': contactFormMessageSentMsg , 'contactFormMessageNotSentMsg': contactFormMessageNotSentMsg , 'contactFormInvalidEmailMsg': contactFormInvalidEmailMsg , 'contactFormEmptyMessageMsg': contactFormEmptyMessageMsg , 'title': 'Contact Form', 'blogId': blogId, 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull'));
widgetLoaded=true;
document.getElementById('ContactForm1_contact-form-submit').click();
}
return true;
}
</script>
<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' onclick="sendEmailMsg()"/>
<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>
5. Setelah Script sudah terpasang tepat dan memakai BlogID milikmu, pastikan kau telah men-disable comment untuk page yang sudah kau buat ini sebelum nantinya kau publish.
6. Masuk ke blogger. Template > Customize > Advanced > Add CSS. Masukan CSS di bawah ini, kemudian klik Apply to Blog. CSS ini berfungsi untuk menyembunyikan Contact Form yang berada di Sidebar tadi.
#ContactForm1 {display:none;}
FAQ: Frequently Asked Question
Pertanyaan #1: Kenapa kita harus menambahkan Comtact Form pada Blog?
Contact Form akan memudahkan para pengunjung blog untuk menghubungi pemilik ataupun para admin blog. Dengan ini para pembaca tidak perlu lagi susah-susah mengirim pesan via e-mail. Para pengunjung sanggup mengirim pesan secara langsung, disertai mengisi form e-mail miliknya. Nantinya jikalau pemilik blog ingin membalas atau membahas percakapan lebih lanjut, maka pemilik blog sanggup menghubungi pengunjung tadi melalui e-mail yang telah disertakan tadi. Dengan Contact Form, pemilik atau admin blog pun tidak perlu mencantumkan e-mail secara pribadi pada blog, yang berdasarkan sebagian orang hal ini sensitif, alasannya yakni e-mail sanggup dilihat oleh semua pengunjung, dan mungkin saja menjadi sasaran para spammer.
Pertanyaan #2: Kenapa harus memisahkan Contact Form ke Static Page? Kenapa tidak di Sidebar saja?
Hal ini yakni selera masing-masing dari para pemilik blog. Beberapa pemilik blog ingin tampilan blog yang lebih simpel dan rapih, dengan membatasi penggunaan widget. Berhubung Contact Form yakni syarat di-approve-nya Google AdSense, beberapa pemilik blog ini lebih menentukan memisahkan Contact Form ke Static Page-nya sendiri,sehingga blog tetap mempunyai Contact Form namun tidak mengganggu tampilan halaman utama blog.
Pertanyaan #3: Apa kita sanggup menambah form perhiasan di Contact Form ini?
Bila kita lihat memang Contact Form official ini sangat simpel dan termasuk basic-nya contact form. Form yang ada hanyalah Nama, e-mail, serta Pesan. Berbeda dengan contact form lain yang cenderung lebih kompleks. Sampai sekarang, sangat sulit menemukan tutorilal wacana penambahan form ini. Tapi, jikalau kau seorang ahli dalam Javascript dan HTML, menambah form bukanlah hal mustahil.
Pertanyaan #4: Apa Contact Form Blogger akan mempunyai dapak positif atau negatif?
Tidak
Pertanyaan #5: Apa Contact Form kondusif dari SPAM?
Iya. Blogger sendiri sudah mempunyai perlindungan yang akan mencegah masuknya komentar spam otomatis yang bersasal dari mesin. Tapi, tidak dengan spammer manusia.
Perntanyaan #6: Kemana pesan yang berasal dari Contact Form akan terkirim?
Pesan akan hingga ke semua admin blog. Pesan yang terkirim bukanlah pesan yang berasal dari e-mail para pengunjung blog.
Pertanyaan #7: Contact Form menyatakan "Pesan Teririm" tapi saya tidak menerimanya?
Memang ada beberapa blog yang mengalami ini, menyerupai yang telah di laporkan oleh Google. Jika kau mengalaminya, solusi terbaik yakni menghubungi pribadi official Blogger Support. Atau kau juga sanggup mencari solusi di komunitas blogger yang ada.
source:https://rumahsolved.blogspot.com/search?q=
Translated & Improved by Akira Asayami
Post a Comment for "Cara Memindahkan Contact Form Blogger Ke Static Page"