Customizing The Stylesheet

Meteor Slides comes with a stylesheet to style the slideshow. You can copy this stylesheet into your theme to override the default stylesheet and add customize CSS without hacking the plugin.

Adding a custom stylesheet

Copy meteor-slides.css from /meteor-slides/css/ to your theme’s directory to replace the plugin’s default stylesheet. If you have navigation enabled, be sure to copy the buttons.png, next.png, and prev.png files to your theme’s images folder and update the image paths, or create new graphics to replace them.

Using custom CSS

With custom CSS you can use your own graphics for the slideshow navigation and customize the design to match your theme.

Disable auto-hide on the previous/next navigation

One common use of custom CSS would be to change the previous/next navigation so that the buttons are always showing, replacing the default rule:

html > body .meteor-slides ul.meteor-nav {
	display: none;
}

With this one:

html > body .meteor-slides ul.meteor-nav {
	display: block;
}