Viewing 9 replies - 1 through 9 (of 9 total)
  • Plugin Author Josh Leuze

    (@jleuze)

    You can add thumbnail navigation to the slideshow, but it’s complicated and might not work for what you want to do if those buttons need to be different than the slide image they need to go to.

    But you can more easily do this just using CSS. First, make sure you use a custom stylesheet in your theme so that you don’t lose any changes when you update the plugin.

    Now, what you need to do is create a background image for your slideshow that has those four buttons built into it. Like mock the thing up in Photoshop how you want it to look and use that as the background image of the .meteor-slides slideshow container. After that you can add some padding to the slideshow container and some margins to the slides so that the slideshow is positioned within the background how you want it.

    Then you can take the four paged buttons and style them differently.(make sure paged nav is on and the slide quantity is set to 4). You can see in the CSS that they have a number in them which is hidden and a background image added. Leave the text indented and just get rid of the background. You will need to change the size to match your buttons, make the .meteor-buttons container large enough to cover all four buttons, and then move the four buttons around to overlap the buttons in the background.

    The tricky part will be styling the pager buttons to fit over the graphics as you cannot style each one individually, they have to all have the same CSS rules. Firebug will be a big help in positioning them.

    Finally, if you want the buttons to work on hover instead of click, there’s an option for that, you can use metadata to change it.

    Thread Starter dkingalon

    (@dkingalon)

    Hello, you can see in my website that i made a built in spaces for hte buttons,so those should be just texts.
    the website is : http://www.iatar.co.il
    I want the 4 little bullets in the bottom of the slideshow will stay and there will be more 4 buttons with in the places you can see.
    How can i do that ?
    i didnt understand what you were trying to tell me

    Plugin Author Josh Leuze

    (@jleuze)

    You won’t be able to keep the paged navigation as bullets and use it as for the larger buttons on the left and right, you need to use it for one or the other.

    Thread Starter dkingalon

    (@dkingalon)

    I can try.. this could be very useful for me and other members
    I search the bullets code i thought maybe i will be able to copy it to the larber buttons,but i couldn’t find it.
    Can you send it to me modified to 4 posts ?

    And assuming i cant do that.. can you explain me again how can i take those little bullets and spread them where i need them to be with hover ?

    Plugin Author Josh Leuze

    (@jleuze)

    The code for the paged navigation is dynamically generated by the slideshow script, so if there are two slides it makes two buttons, and for four slides it makes four buttons. So you can just make a second copy of those buttons, there is only the one set you have to work with in your stylesheet.

    The first thing you would have to do is set the overflow of the slideshow to visible and change the size and position of the .meteor-buttons container to overlap the four buttons.

    Thread Starter dkingalon

    (@dkingalon)

    How do i do that?
    I don’t know css so well, can you give me the codes i need ?
    Thank you very much for your support

    Plugin Author Josh Leuze

    (@jleuze)

    This is a unique layout, you’re going to have to do some custom CSS to get it to look like that.

    Thread Starter dkingalon

    (@dkingalon)

    would you like me to pay you to do that ?

    Please try http://jobs.wordpress.net/
    Topic now closed as per the Forum Rules

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘[Plugin: Meteor Slides] Adding images near to the slideshow’ is closed to new replies.