Rotating Images on Home page

[Donna Kempster]

Hi I have searched through and read some threads about rotating images but have not found anywhere that would indicate how to do it. Does anyone know a) if I can have the main image on my home page rotating so that it is randomly selected when you view the site and b) how I would do it!

Many thanks

D

[hobuk]

Hi Donna,

I use this simple one in one of my right hand boxes see here the code is simple and you can add as many as you want, just remember to add the images you use to your site1 folder and add them to your additional files and it should work fine (if its what you want)

<script language="JavaScript">
<!--
/*
Random Image Link Script
By Website Abstraction (http://www.wsabstract.com)
and Java-scripts.net (http://www.java-scripts.net)
*/

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish
myimages[1]="img1.gif"
myimages[2]="img2.gif"
myimages[3]="img3.gif"

//specify corresponding links below
var imagelinks=new Array()
imagelinks[1]="http://www.wsabstract.com"
imagelinks[2]="http://www.dynamicdrive.com"
imagelinks[3]="http://www.java-scripts.net"

var ry=Math.floor(Math.random()*myimages.length)

if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" border=0></a>')
}

random_imglink()
//-->
</script>

Kind Regards
Lee
www.hobuk.co.uk

[Donna Kempster]

Thanks but ...

Lee

Thanks very much - just what I am after - stupid I know but where do I enter this code ... in my actbrochureprimary template - and anywhere in particular?? cheers D

[NormanRouxel]

Here's my similar take on the same idea. It lets you keep the images in a Custom Property, so that Actinic uploads them and they're easy to change.[

****************

Here's an idea where you can keep up to 10 images in Custom Properties.
Use Advanced / Custom Properties to create Properties IMAGE1, IMAGE2, ... IMAGE10
and also properties LINK1, LINK2, ... LINK10.
Now you maintain the list of images (in Design / Options / Site Defaults)
and check File Name" and Actinic will upload and maintain changes for you.
You can also put a list of links e.g. "http://news.bbc.co.uk" into the LINK Customvars.
You can use all 10 or leave some empty.
The script will adapt to the number of images you use.

Edit Act_Primary.html and put the following just above the [/b]</HEAD>[/b] tag

<script language=JavaScript>
var cvimages=new Array('CUSTOMVAR:IMAGE1','CUSTOMVAR:IMAGE2','CUSTOMVAR:IMAGE3','CUSTOMVAR:IMAGE4','CUSTOMVAR:IMAGE5',
                     'CUSTOMVAR:IMAGE6','CUSTOMVAR:IMAGE7','CUSTOMVAR:IMAGE8','CUSTOMVAR:IMAGE9','CUSTOMVAR:IMAGE10');
var cvlinks=new Array('CUSTOMVAR:LINK1','CUSTOMVAR:LINK2','CUSTOMVAR:LINK3','CUSTOMVAR:LINK4','CUSTOMVAR:LINK5',
                     'CUSTOMVAR:LINK6','CUSTOMVAR:LINK7','CUSTOMVAR:LINK8','CUSTOMVAR:LINK9','CUSTOMVAR:LINK10');
var images=new Array();
var links=new Array();
for (var i=0; i < cvimages.length; i++) { if (cvimages[i] != '') { images.push(cvimages[i]); links.push(cvlinks[i]); } }
idx = Math.floor(Math.random()*images.length - 0.01);
showlink = (links[idx] != '');
</script>

and put this wherever you want the image to display (probably somewhere in the BODY of Act_Primary.html).

<script language=JavaScript>
<!--
if (showlink) document.write('<a href="' + links[idx] + '">');
document.write('<img border=0 src="' + images[idx] + '">');
if (showlink) document.write('<\a>');
//-->
</script>

You can also have a different set of images and links for each page by setting these in the Section Properties.

[Donna Kempster]

Hi
I have to confess to never getting round to doing this and cheating () and using an animated gif. I have however decided to go back and do it properly now.

I am looking to replace the gif on the home www.cottonbunting.co.uk with a bank of images that it selects and rotates. Doing it the way laid out in these threads will allow it to be more flexible as I can easily interchange the images.

However this thread was started in v7 and I don't know how to adapt it to v9. Would I create variables? instead of customvars? I don't really need them to link anywhere (but if that is easily doable then it would be a nice to have). I assume once I have got the variables I then insert the code into the page via the design layout?

TIA
D

[grantglendinnin]

Why not use the Best Sellers and New Products marketing features? Seems the most logical way of doing this without the need to open up and edit javascript files every other week.

[leehack]

There's some classy javascript slideshows in this area nowadays, loads of free ones available on Google. If it's the interaction or the changing of images in a confined space that you are after, then I think they are great. You can see one on my home page, which can be stopped and linked to something too.

[Donna Kempster]

Grant ... we use the best sellers as our main home page to show the products but these use the product for which we use simple cut outs, but the revolving image shows lifestyle shots which help give an overall impression for the brand. It's that that I'm looking to update.

Lee ... will have a look at your site and do a search on google and see how I go! ( I'll probably be back in a bit!

[malbro]

Grant ... we use the best sellers as our main home page to show the products but these use the product for which we use simple cut outs, but the revolving image shows lifestyle shots which help give an overall impression for the brand. It's that that I'm looking to update.

Lee ... will have a look at your site and do a search on google and see how I go! ( I'll probably be back in a bit!

Donna
You could try simple gallery, it can be easily integrated into actinic using a few custom variables and works well with V8 and V9 http://www.dynamicdrive.com/dynamici...plegallery.htm for a demo.

[Firecom]

Hi Lee

Which javascript slideshow would you recommend?

[leehack]

Depends on what you want it to do more than anything, the one I use on my home page does all I need, so I just use different versions of that each time.

[Firecom]

just want to use it in a fragment to scroll through different images being used as ads on the home page.

will be used on the large single ad at the top of the home page.

[malbro]

just want to use it in a fragment to scroll through different images being used as ads on the home page.

will be used on the large single ad at the top of the home page.

You can use a script with the image list built in or you can use a script and actinic variables to hold the image filenames. The second method makes it slightly easier to change image names.

The choice is very wide, I used the one I mentioned earlier in a fragment and it works well for a single fragment but not if you want more than one scrolling image on the same page. I found another more sophisticated one that will allow multiple scrolling images on the same page but that works better using choices to determine the image names, hence it is not really suitable for fragments.

[Donna Kempster]

Hi Malcolm
I did have a good look at the one you posted and I got a bit confused (nothing new there then!) as it looked like it didn't revolve itself but that you needed the play stop buttons etc .... but then it could have been my misunderstanding of how it worked.
I need a day clear of anything else to get my head round these sort of things and we've been a bit manic recently hence I haven't re-looked at it since my last post. We usually go a bit quite over the kids hols so I'm hoping to have a go at it then. There are so many to choose from out there it's difficult to know which ones are best. Will let you know how I get on! Wish me luck! D

[malbro]

Hi Malcolm
I did have a good look at the one you posted and I got a bit confused (nothing new there then!) as it looked like it didn't revolve itself but that you needed the play stop buttons etc .... but then it could have been my misunderstanding of how it worked.

Take a look at the home page for the yarn shop in my signature to see it in action, yes it can be manually controlled but I have it set to auto on that page (first image on right hand side). As you say there are many to choose from, they all have there own quirks and it will depend on your exact requirements. The one on the yarn page uses twenty custom variables to hold the image names so it is easy to change the pictures without having to make changes to the source code for a java script. I found quite a neat one to give a turning page effect http://www.fiddlesticksdevon.co.uk/a..._Book_617.html and a third one for displaying product images http://www.fiddlesticksdevon.co.uk/a...ven_yarns.html all of which are integrated into actinic using custom variables and layouts. All of these are based on the jquery library and are very small in terms of code size.