Contact Form

Contact Form

Contact Form




 Sebuah web/blog jika ada contact form akan lebih baik, setidaknya dapat berinteraksi dengan pengunjung, kali ini kami  berbagi tips membuat contact form seperti yang dapat anda lihat di pojok kanan atas web/blog ini

Login ke web/blog anda
Klik template kemudian edit HTML
Cari kode ]]></b:skin>
Copy dan paste kode dibawah ini tepat diatas kode ]]></b:skin>

.ContactForm {display:none}

Klik simpan template
Selanjutnya masuk ke tata letak
Tambahkan gadget pilih gadget lainya 
Kemudian tambahkan formulir kontak dan simpan
Klik kembali tambahkan gadget cari dan pilih tambahkan html/javascript
Kemudian copy dan paste kode dibawah ini kedalam html/javascript box dan klik simpan 
Selesai

<script type='text/javascript'>
//<![CDATA[
$('body').append('<div class="floating-ct"><div class="floating-ct-head"><a href="#no-move">Contact Me</a></div><div class="floating-ct-body"></div></div>');
$('.ContactForm').appendTo('.floating-ct-body');
var slide_up_ct = false;
$('.floating-ct-head a').click(function(){
 if (!slide_up_ct) {
 slide_up_ct = true;
 $('.floating-ct-body').slideDown();
 } else {
 slide_up_ct = false;
 $('.floating-ct-body').slideUp();
 }
});
//]]>
</script>
<style>
.ContactForm, .ContactForm .title {
 display: none;
}
.floating-ct {
 position: fixed;
 width: 250px;
 right: 0;
 bottom: 0;
 z-index: 999;
}
.floating-ct-head a:hover {
color: #fff;
background: #2c3e50;
}
.floating-ct-head a {border-radius:8px 0 0 0;
text-decoration:none;
padding: 5px 10px;
background: #16a085;
color:#fff;
font-weight: bold;
display: inline-block;
zoom: 1;
}
.floating-ct-body {
 height: 311px;
 background: #FD6CA3;
 border: 1px solid #FD6CA3;
 padding: 10px;
 display: none;
}
.floating-ct-head {
 text-align: right;
}
.floating-ct-body .ContactForm {
 margin: 0;
 display: block!important;
}
</style>

Selamat mencoba, terima kasih untuk mas Samsury  di  _samsury-sites.blogspot.com_

Share On:

You Might Also Like:

Disqus
Blogger
Pilih Sistem Komentar Yang Disukai

0 Comment

Add Comment

[+] Silahkan tinggalkan komentar
[+] Berkomertarlah dengan santun
[+] Mohon tidak meninggalkan live link
[+] Terima kasih untuk komentar anda

https://infoalya.com

Gunakan konversi tool jika ingin menyertakan kode atau gambar.


image
How to style text in Disqus comments Top Disqus Commentators
  • To write a bold letter please use <strong></strong> or <b></b>.
  • To write a italic letter please use <em></em> or <i></i>.
  • To write a underline letter please use <u></u>.
  • To write a strikethrought letter please use <strike></strike>.
  • To write HTML code, please use <code></code> or <pre></pre> or <pre><code></code></pre>.
    And use parse tool below to easy get the style.
Show Parser Box

How to get ID DISQUS - https://disq.us/p/[ID DISQUS] - lihat di sini

strong em u strike
pre code pre code spoiler
embed

Like Info Alya? Keep us running by whitelisting Info Alya in your ad blocker.

This is how to whitelisting Info Alya in your ad blocker.

Thank you!

×
×
×