11 May 2010

How To Add Zoom Effect for images to your Blogger Blog?


You may have seen the zoom effect for images on various sites and wordpress blogs. Now here is the way to add 'Zoom Effect for Images' to your Blogger Blog.

Just follow these simple steps.

Step 1. Go to your dashboard >> layout >> Edit HTML >> Expand Widget Templates

Step 2. Search for </head>

Step 3. Add following code just 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'/>

Step 4. Replace <body> with <body onload='setupZoom()'>

Step 5. Save your template.

Step 6. Now that you have added the code for Image Zoom Effect to your template, you must add following code while addin any image to your post.

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

Here, "Image Address" is the url of the image you want to add.

See Demo here.

Related Posts

Post a Comment


Twitter Delicious Facebook Digg Stumbleupon Favorites More