There's a request for making pop-up contact form in my blog. So in this post ,I will show you the tip to make a contact form for Blogger ,using free service Google Docs and a Jquery Plugin name Fancy Box .
Here is screenshot :

Live demo

Here is the tip :
1,Go to Layout ,continue to Edit HTML ,check on Expand Widget Templates
2,Insert this code right after ]]></b:skin>
<script type="text/javascript" src=""></script>
    <script type="text/javascript" src=""></script>
    <link rel="stylesheet" type="text/css" href="" media="screen" />

3,Go to this address ,paste script bellow to text area in the page ,and click encode :
<script type="text/javascript">
        $(document).ready(function() {
                'width'                : '75%',
                'height'            : '75%',
                'autoScale'         : false,
                'transitionIn'        : 'none',
                'transitionOut'        : 'none',
                'type'                : 'iframe'
Copy the result and paste to template file right after the code in step 1 .
3, In previous post ,I told you tip to make Contact form for Blogger using Google Docs . You can read it here
When you created a contact form in Google docs ,it give you a link to form like this :

Now ,what we need to do is add a link to pop-up contact form . Add this code to your template file where you need a 'contact me' link
<a id="contact_form" href="">Contact me</a>
Remember to change the link to contact form in script above to your contact form link
Save template !
Ok,we are done.
So anytime we click on 'contact me' link ,a pop-up window which contain Google Docs contact form will appear .
Enjoy it ^^
huy signature

Share this post



  1. Replies
    1. thnks a lot!
      It's working now properly without any hardcore coding...

      I just customized my form design.

  2. not work :-(
    this form is cool but it doesn't open as a pop-up 4 me. hope u can help. it opens the form in the browser page

  3. @ampjosh : maybe a problem in installing fancybox,my friend.You can go to this address and download the full package for fancybox : . In the page you sent me ,I don't see fancybox installed.

  4. co the sai cung dc do ^^.
    my blog

  5. i need help installing fancybox. Someone help, am a novice at this.

  6. can i use other than google docs?

  7. I like over all your posting, that's inspirate to my blog
    thank's brother

  8. hy i had try this i ah put all codes according to abvoe but its not work in pop up
    and where me have to post the code
    tell me its cool trick but i failed

  9. Can you make a beautiful popup subscription box to increase subscribers for blogspot? it will be lovely.

  10. This comment has been removed by the author.

  11. hello sir

    pls tell me how to get a java script google ad code delay scrolling ads

    the above link like this see right side delay ads how to make this type for google ad code

  12. thnks a lot!
    It's working now properly without any hardcore coding...

    I just customized my form design.


Here are some rules for commenting on Simplex Design blog :
1, Search first ,then ask question. You will get the answer faster
2, All comments except spams are welcome.
3, Please make all requests in English.
4, Do not use generic titles such as Admin or Mod. This confuses readers