Contact Form for Blogger Static Page with jQuery
As you know, I posted a tip: Contact form for Blogger on static page with css before, and now, I will show you how to do that tip with ... READ MORE
If you don’t want to create static page to insert contact form for Blogger as my tip, or also don’t want to place it at right sidebar. So this tip may be your perfect choice, create a floating box of contact form.
![]() |
Floating Contact Form for Blogger |
If your blog has no jQuery before, just read my tutorial. I also wrote an article to help you figure out how to add a Contact Form gadget for your blog. If you did not add one, please read the tutorial.
Please paste the below code beforeĀ ]]></b:skin>
in your template
/*Floating Contact Form by BloggerItems.com*/ .ContactForm, .ContactForm .title { display: none; } .floating-ct { position: fixed; width: 250px; right: 0; bottom: 0; z-index: 999; } .floating-ct-head a { padding: 5px 10px; background: #09f; color: white; font-weight: bold; display: inline-block; *display: block; zoom: 1; } .floating-ct-body { height: 285px; background: white; border: 1px solid #09f; padding: 10px; display: none; } .floating-ct-head { text-align: right; } .floating-ct-body .ContactForm { margin: 0; display: block!important; }
Then paste the below code before </body>
tag in your template
<script type='text/javascript'> //<![CDATA[ /*Floating Contact Form by BloggerItems.com*/ $('body').append('<div class="floating-ct"><div class="floating-ct-head"><a href="#no-move">Contact</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>
As you know, I posted a tip: Contact form for Blogger on static page with css before, and now, I will show you how to do that tip with ... READ MORE
The Global Layout Data Tags will be used anywhere in your Blogger template code. This article is useful for Blogger developers who creating ... READ MORE