Om een mini slideshow te krijgen zoals op mijn website heb ik als eerst een nieuwe directory aangemaakt in de directory van Imagevue. Voor mijn site heb ik 'm component genoemd. In deze directory komen de foto's en een .ini-bestand met instellingen. Voorbeeld van mijn component.ini file:
[SLIDESHOW]
[MAIN]
globalpath = false
path = component/ ;instelling voor juiste directory
directimage = false
startimageclick = next
language = slideshowlang.ini
autostart = true
autoscale = true
scaleup = false
keepaspect = true
boxstage = false
imagesorting = rnd ;instelling voor random foto's
cacheimages = 3
minmargin = false
maxwidth = false
maxheight = false
interval = 5
serverextension = php
sitemenu = false
usejsresize = false
altimage = false
[VISUAL]
startimage = false
startheading = false
displaykeyguide = false
backimage = false
backalign = M
bgcol = 004ab8
textcol = f7f7f7
tooltipforegroundcolor = textcol
tooltipbackgroundcolor = bgcol
framewidth = 5
framecol = textcol
innerframewidth = 5
innerframecol = textcol
frameshadow = true
slideshowlayer = false
slideshowlayeralpha = 30
slideshowlayeralign = OIM
slideshowlayermargin = 10
[TRANSITION]
transition = fade; motionmove,motionmask,blockmask,tint,white,fade,shine,instant
transitionresize = tint,white,shine,instant; tint,white,shine,instant
frametransition = true
[AUDIO]
sfx = false
audio = false
audiopath = mp3/
audiorepeat = 0
audioinit = false
startvolume = 80
audiostyle = linear
loopinterval = 30
audioextension = mp3
audioinfo = id3
audioplayercolor = textcol
[CONTROLS]
sitemenu = false
showmaincontrols = false
maincontrols = select,previous,next
maincontrolsalign = BR
maincontrolsmargin = 10
altcontrols = false
altcontrolscolor = textcol
altcontrolsalign = L,R
altcontrolsmargin = 10
closebuttonalign = IRT
customdata = <b>UITLEG SLIDESHOW</b>
customdatalink = mailto:rene@site.nl
rightclick = next,previous,toggleplay
enablerightclickcontrols = true
enablekeycontrols = true
usekeysettingstext = false
imageclick = next
imageshiftclick = next
imagepopinfo = false
showpreloader = false
showaltpreloader = false
showtimer = false
preloadcolor = textcol
timercolor = textcol
controlsbackgroundcolor = textcol
controlsforegroundcolor = bgcol
controlsbackalpha = 50
controlsbackoveralpha = 40
controlsbackpressalpha = 60
controlsdimensionx = 30
controlsdimensiony = 30
controlstooltip = true
[IMAGESELECT]
imageselecttooltip = true
imageselecttooltipdelay = 500
imageselecttooltiptext = true
imageselecttooltipthumbnail = true
timerselectreset = 9000
[TEXT]
displayposition = imagebottom ;above,below,left,right,imagetop,imagebottom
displayimageindex = false
displayname = false
displaydescription = true
hideextension = false
formatmaxwidth = 250
formatminwidth = 150
formatmargin = 3
formatbackgroundcolor = 004ab8 ;kleur van de balk achter de omschrijving
formatbackgroundalpha = 60 ;instelling voor transparantie van deze balk
defaultfont = Arial
defaultsize = 19
defaultcolor = textcol
defaultleading = 2
defaultalign = left
headingfont = DesertDogHmk
headingsize = 28
headingcolor = bgcol
indexfont = Verdana
indexsize = 11
indexcolor = textcol
indexleading = 0
indexalign = left
namefont = Verdana
namesize = 11
namebold = true
namecolor = textcol
nameleading = 0
namealign = left
descriptionfont = Verdana
descriptionsize = 9
descriptioncolor = textcol
descriptionleading = 1
descriptionalign = center
selectfont = Verdana
selectsize = 11
selectbold = true
selectcolor = bgcol
[END]
Voorbeeld van .htm bestand waarin slideshow wordt opgeroepen:
<html>
<head>
<script type="text/javascript" src="http://fotos.globetrotternet.nl/javascript/swfobject_source.js"></script>
</head>
<body>
<div id="flashcontent"style="margin: 1px 1px 1px 1px;"></div>
<script type="text/javascript">
var so = new SWFObject("http://fotos.globetrotternet.nl/slideshow.swf", "features", "160", "120", "7", "#FFFFFF");
so.addVariable('configfile','component/compslideshow.ini');
so.addVariable('globalpath','http://fotos.globetrotternet.nl/');
so.addVariable('framewidth', '1');
so.addVariable('frameshadow', 'false');
so.write("flashcontent");
</script>
</body>
</html>
In je .htm bestand kun je een aantal dingen instellen:
- var so = new SWFObject("
http://fotos.globetrotternet.nl/slideshow.swf", "features", "160", "120", "7", "#FFFFFF"); hier geef je aan waar je slideshow.swf staat van je eigen Imagevue, 160 en 120 staan voor breedte en hoogte van slideshow, #FFFFFF is de achtergrondkleur, waar de 7 voor staat weet ik niet.
- Bij configfile','component/compslideshow.ini stel je de directory in waar het .ini bestand staat.
- Bij globalpath','
http://fotos.globetrotternet.nl/' stel je in, waar de normale Imagevue bestanden staan van jouw site.
- 'framewidth', '1' hier kun je instellen of je een randje rondom de foto's wilt, en hoe breed.
- 'frameshadow', 'false' hier kun je eventueel schaduw aanzetten.
Foto's uploaden via FTP of via admin menu, bv.:
http://fotos.globetrotternet.nl/admin/?folder=component (aanpassen op eigen site en directory)
Via dit path kun je ook de descriptions editen.
Foto's die je upload kun je het beste even groot houden als in het .htm bestand in gesteld.