How can we change the button's image (arrows, play/pause) of a slideshow ?

[jlie]

How can we change the button's image (arrows, play/pause) of a slideshow?

Without paying/having their logo a 3rd party app?

I tried to override the CSS but it doesn't work.

They are quite big ugly and pixelized

Or could you just change it for something nice

[Adam7]

If you post a link to the slideshow on your site along with what you want it to look like, someone might be able to offer a solution for you @jlie.

[jlie]

not a slideshow, a Gallery, sorry for the confusion

[Adam7]

That's ok, I think it could be resolved the same if you post a link to one.

[jlie]

http://www.laurencedusault.com/gallerie.html

[BJ5 · Accepted solution]

Try adding this to Settings > SEO > Header Code and publishing:

<style>
	#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span
	{
		background-image: none !important;
	}
	
	.fancybox-next span, .fancybox-prev span
	{
		color: #fff;
		font-weight: bold;
		font-size: 50px;
	}
	
	.fancybox-prev span:before, .fancybox-next span:before
	{
		position: relative;
		left: 25px;
	}
	
	.fancybox-prev span:before
	{
		content: "<";
	}
	
	.fancybox-next span:before
	{
		content: ">";
	}
</style>

[BJ5]

It will probably take a little bit of tweaking to get it to look how you want, though. That basically replaces the default previous and next icons with white text > and <.

[jlie]

thanks!