Wednesday, May 20, 2009

0

How To Add Zoom Effect for images

  • Wednesday, May 20, 2009
  • abhi
  • Share
  • 1.Log in to your dashboard--> layout- -> Edit HTML

    2.Click on "Expand Widget Templates"

    3.Scroll down to where you see </head> tag.

    4.Now add below code before </head> tag.

    <script src='http://wam8387.110mb.com/FancyZoom.js' type='text/javascript'/>
    <script src='http://wam8387.110mb.com/FancyZoomHTML.js' type='text/javascript'/>


    5.Now replace the <body> tag with <body onload='setupZoom()'>

    NOTE : If in your template already has <body onload="setupZoom()"> code instead <body> tag ,skip this step.

    6.Now save your template.

    You have already add zoom effect for images.But,to zoom image you have to use this new form :

    <a href="Image link"><img src="Image link" width="200" border="0" height="200" />


    You must replace 'Image link' with your real url of image.You can change Height,Weight,.....

    Look at the example below.

    <a href="http://img2.pict.com/aa/ae/97/16680dfb7c10435cbefea4aa04/4OXiK/geneliadsouzawallpaperspicturesd.jpg"><img border="0" width="200" src="http://img2.pict.com/aa/ae/97/16680dfb7c10435cbefea4aa04/4OXiK/geneliadsouzawallpaperspicturesd.jpg" height="200"/></a>

    It will look like this.click on the picture to see effect.

    Read this : When you add this effect inside post if come html errors , check the box 'Stop showing HTML errors for the body of this post' and publish your post.Good Luck.

    0 Responses to “How To Add Zoom Effect for images”

    Post a Comment

    Subscribe