[Plugin: Meteor Slides] Previous/next navigation arrows

Hi Andrew, thanks for trying my plugin. You can setup the navigation to always show, but you’ll have to add some customizations to your theme.

Add the Meteor Slides stylesheet and navigation images to your theme as explain in the FAQ.

Edit this rule in the stylesheet:

#meteor-slideshow ul.meteor-nav {
	display: none;
	list-style: none;
	margin: 0;
	padding: 0;
}

To look like this:

#meteor-slideshow ul.meteor-nav {
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
}

Next create a “slideshow.js” file in your theme’s “js” folder and add this code to it:

var $j = jQuery.noConflict();

$j(document).ready(function() {

	$j(".meteor-slides").hover(function() {

		$j("ul.meteor-nav").css('display', 'block');

	}, function() {

		$j("ul.meteor-nav").css('display', 'block');

	});

});

Now edit your “header.php” file to load this JavaScript file, add this to the head below the wp_head() function:

<script type='text/javascript' src='<?php echo get_stylesheet_directory_uri(); ?>/js/slideshow.js'></script>

Now the navigation should never be hidden. Right now this is a bit more complicated than it needs to be, I’ll try to simplify this so it can be done with just CSS in the next version.

Hey! Thanks a lot. This is great. I really appreciate you taking the time to give me all this. Even without the function, it’s a great plug-in. This fix looks a little beyond what I want to do right now, though. I’ll stick with the screen shots and try this a little later.
Best,
Andrew

No problem Andrew, I have also needed to set up the nav to always show on a few of the projects that have done recently, so I’ll try to make this easier to do in the next version of Meteor Slides.

Thank you so much for this! I love the plugin!

You’re welcome, thanks for trying Meteor Slides Ryan!

Hi,

Great plugin!

However I cant seem to get the buttons to go forwards and back, they are not responsive.

Any ideas why?

That sounds like a JavaScript conflict with your theme or another plugin, can you post a link to the page you are having this problem on?

Hi,

I just upgraded the plugin for this site:
https://www.integralgroup.com/
but now the arrows and the dots on the bottom are gone. Could you take a look if you have a chance?

Thanks

Oops, could you respond to this one? I forgot to click notify

Hi,

I just upgraded the plugin for this site:
https://www.integralgroup.com/
but now the arrows and the dots on the bottom are gone. Could you take a look if you have a chance?

Thanks

Are you using a custom stylesheet or slideshow template? What navigation option do you have set in the slideshow settings?

Thanks for replying!
It works now—I didn’t see the settings option on the left. In future versions you might want to consider renaming the tab from “Slides” to “Meteor Slides” for those of us dealing with multiple sites with multiple media plugins. (This site alone uses 3, bleh!) It would probably also help those new to WordPress.

Yeah, I can see how that could be a problem, glad to hear you got it figured out!

Thanks a LOT! This question solve my problem too! ??

No problem Leo, as an update on this thread, you don’t need to add or edit any JavaScript to always display the prev/next nav with Meteor Slide 1.4.

You can use a custom stylesheet and replace these rules:

body .meteor-slides ul.meteor-nav {
	display: none;
	*display: block;
	_display: block;
}

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

With this one:

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