Share Cara Q Memasang Contact Us ke Laman

By Organik Share

2/04/2015

Share Cara Q - Secara default, contact form ini hanya bisa digunakan sebagai widget, dan apabila kita menginginkan Contact Form tersebut dipasang pada sebuah Halaman maka kita perlu melakukan beberapa trik supaya contact form tersebut bisa digunakan di sebuah halaman.

Untuk itu ikuti langkah-langkahnya di bawah ini

Langkah Pertama :
Menghapus Code Gadget Contact Us

1. Login Ke Blog kita
2. Pergi ke Template
3. Edit HTML
4. Pilih Lompat ke widget
5. Cari Judul Gadget yang kita Buat Tadi misal "Contact Us"
6. Cari dan Hapus kode berikut Mulai dari :

<b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>

Sampai dengan :

          <p class='contact-form-success-message' expr:id='data:widget.instanceId + &quot;_contact-form-success-message&quot;'/>
        </div>
      </form>
    </div>
  </div>

Lengkapnya yang dibuang :

<b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='contact-form-widget'>
    <div class='form'>
      <form name='contact-form'>
        <p/>
        <data:contactFormNameMsg/>
        <br/>
        <input class='contact-form-name' expr:id='data:widget.instanceId + &quot;_contact-form-name&quot;' name='name' size='30' type='text' value=''/>
        <p/>
        <data:contactFormEmailMsg/> <span style='font-weight: bolder;'>*</span>
        <br/>
        <input class='contact-form-email' expr:id='data:widget.instanceId + &quot;_contact-form-email&quot;' name='email' size='30' type='text' value=''/>
        <p/>
        <data:contactFormMessageMsg/> <span style='font-weight: bolder;'>*</span>
        <br/>
        <textarea class='contact-form-email-message' cols='25' expr:id='data:widget.instanceId + &quot;_contact-form-email-message&quot;' name='email-message' rows='5'/>
        <p/>
        <input class='contact-form-button contact-form-button-submit' expr:id='data:widget.instanceId + &quot;_contact-form-submit&quot;' expr:value='data:contactFormSendMsg' type='button'/>
        <p/>
        <div style='text-align: center; max-width: 222px; width: 100%'>
          <p class='contact-form-error-message' expr:id='data:widget.instanceId + &quot;_contact-form-error-message&quot;'/>
          <p class='contact-form-success-message' expr:id='data:widget.instanceId + &quot;_contact-form-success-message&quot;'/>
        </div>
      </form>
    </div>
  </div>
</div>

<div style="border: 1px solid #444; padding: 10px; background-color: #eaeaea; text-align: left;">
<b:widget id='ContactForm1' locked='false' title='Formulir Kontak' type='ContactForm'>
      <b:includable id='main'>
  <b:include name='quickedit'/>
</b:includable>
    </b:widget>

Hasil setelah di Edit :

<b:section-contents id='sidebar-right-1'>
  <b:widget id='ContactForm1' locked='false' title='Contact Form' type='ContactForm'>
    <b:includable id='main'>
  <b:include name='quickedit'/>
</b:includable>
  </b:widget>

7. lalu Klick Save

Langkah ke Dua :
Memasang Contact Use di laman


1. Pilih Laman
2. Buat laman baru
3. Isi Entri dengan Contact Us
4. Klick Tab HTML
5. Copy Kode dibawah ini dan paste ke laman tadi pada tab HTML

<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>

6. Save atau Publikasikan

Demikian caraku memasang Contact us Ke Laman Blog Kita, untuk lebih Jelasnya Silahkan Lihat Video yang kami Share untuk Anda :




Semoga Bermanfaat
Share Cara Q

Share :

Facebook Twitter Google+ Lintasme