Saturday, September 22, 2012

How to add Image Gallery in Blogs or Websites?


1.  Open your Blog
2. Go to Design
3. Click Lay Out
4. Click Add a Gadget
5. New windows will open to choose Gadget
6. Click on Basics
7. Scroll down and Click HTML/JavaScript
8. Give title as you like in Title box
9.Copy the following JavaScript Code

<script type="text/javascript">
<!--
var image1=new Image()
image1.src="URLImage"
var image2=new Image()
image2.src=" URLImage "
var image3=new Image()
image3.src=" URLImage "
var image4=new Image()
image4.src=" URLImage " 

//-->
</script>
<img src="first" name="slide" width="400" height="300" />
<script>
<!--
//variable that will increment through the images
var step=1
function slideit(){
//if browser does not support the image object, exit.
if (!document.images)
return
document.images.slide.src=eval("image"+step+".src")
if (step<4)
step++
else
step=1
//call function "slideit()" every 3 seconds
setTimeout("slideit()",2500)
}
slideit()
//-->
</script>

10. Past into Content Box
11. Click Save

Note 1: Replace URLImage with your URL address of Image from any site where you want to take image from. To do this, copy the Image URL and paste in the place of URLImage. Click here to learn How to copy Image URL?  

Note 2: If you want to add 5th Image or 6th Image or 7th Image or as so on copy below code.
var image0=new Image() 
image0.src=" URLImage " 


Then paste it before 
//--> 
</script>  
After doing paste you should change image0 into image5 or image6 or image7 or as so on representatively.

Note3: Indicate the quantity of images in if (step<4). For example the code in step no. 9 is for 4 images slide so there is if (step<4). If you added 5 images then you should put if (step<5) or if you added 6 images then you should put if (step<6) as so on, it should represent the quantity of images you added.

1 comment:

Comment form Message