[Plugin: Meteor Slides] Change pager To number & image title in caption

Thanks for trying my plugin. The paged navigation are actually numbered links just like that, the numbers are just being hidden and replaced with graphics using CSS.

You can use a custom stylesheet to change these buttons and reveal the numbers. Here is some same CSS to get you started:

.meteor-buttons a {
    background: #333;
    color: #fff;
    display: block;
    float: left;
    height: 10px;
    line-height: 10px;
    margin: 0 3px 0 0;
    outline: none;
    padding: 3px;
    text-align: center;
    text-decoration: none;
    text-indent: 0;
    width: 10px;
}

.meteor-buttons a:hover,
.meteor-buttons a.activeSlide {
    background: #666;
}

Hi JLeuze,

This looks like a great plugin. I second the thought of possibly integrating a caption. Any plans for this?

@ujgreg Thanks for trying my plugin! My goal with Meteor Slides is to keep it very simple out of the box, but to enable users to extend it easily.

I probably won’t add an option to the settings to display captions, but those captions are already there in the form of the slide titles waiting to be used. They just need to be displayed using a custom slideshow template.

The default slideshow skin doesn’t have captions, but I am planning to create additional skins, some of which will probably include captions so that end users are able enable captions without needing to mess with code!

JLeuze,

Just took a look at the custome slideshow template.

I am assuming this is a “global” setting.

<p><?php the_title(); ?></p>

How would you turn on captions for just one slide show? (I have four on my site right now ??

Thanks so much for your awesome plugin

Yes, that would add captions to each slideshow. There are a couple of ways you could add it to a single slideshow.

Lets say your slideshow’s slug is “neptune”, you could hide it by default using CSS and display it just on the neptune slideshow:

.meteor-slides p {
    display: none;
}

#meteor-slideshowneptune p {
    display: block;
}

Or you could use PHP and add a conditional like this:

<?php if ( $slideshow == "neptune" ) {

    echo '<p>', the_title(), '</p>';

} ?>

Hi Jleuze,

May I ask for some help. I would like to have my paged navigation float right. I have tried adding floats and positioning to the css but cannot get it right. I have changed the css to numbers so I also need the numbers to flow from right to left if you know what I mean.

For example: I have 8 slides and no. 8 should be right against the right side of the slide. Then if I add another slide, the no. 9 should be where the no. 8 was. So basically the opposite of what the default is.

Please see link where i have used it https://fuzegraphics.co.za/demo/acmegraphics/

Thanks for you help.

@fuzegraphics To move it to the right add this to your theme’s stylesheet:

#main .meteor-slides .meteor-buttons {
right: 0;
width: auto;
left: auto;
}

Hi JLeuze, it worked perfectly.

Thank you so much for your consistent help.

I have just donated on your site.

I encourage anyone who uses your plugin to donate as your support is amazing.

You’re welcome, thanks for the donation, I raise my cup to you!