EnglishWOWSlider  DeutschBildergalerie Diashow  EspañolGaleria de Imagenes, Slide Imagenes Gratis  FrançaisDiaporama Galerie D'Image  ItalianoImmagini Galleria  汉语网络幻灯片: 效果的幻灯片  Português brasileiroGaleria De Imagens  Русскийслайдер изображений, слайдшоу, CSS3 слайдер  SvenskaBild Galleri  日本語画像のスライダー&ギャラリー  NederlandsAfbeeldingen Caroussel 

How to make navigation arrows outside the slideshow?

Sometimes, you may want the appearance of the slideshow to vary from the default theme. Whilst WOWSlider does not let you re-position the elements of the slideshow, you can manually edit the code to change things. This includes moving the navigation arrows outside the slideshow.

To do this, first build your slideshow as normal. When you are happy with the overall appearance, ‘publish’ your Slider or Save the HTML.

Go to the place where you saved your Slideshow to, and open the folder called ‘engine’. In here is a file called ‘style.css’.

Open this in a plain-text or HTML editor. If you’re unsure, use ‘Notepad’.

Find the section that looks like this:

#wowslider-container1 a.ws_next{
	background-position: 100% 0;
	right:3px;
}
#wowslider-container1 a.ws_prev {
	background-position: 0 0; 
	left:3px;
}

You will want to change the values highlighted in red. To move the arrows outside of the slideshow, change it to a negative number, e.g. −40px. To move the arrows closer together inside the slideshow, make the number larger, e.g. 40px. ‘0’ is right on the edge of the slideshow.