WordPress.org

Support

Support » Plugins and Hacks » [Plugin: Meteor Slides] Space above slider

[Plugin: Meteor Slides] Space above slider

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

    @jleuze

    Hi, thanks for trying my plugin. The problem is that there are code tags wrapped around the slideshow shortcode. These can mess with the layout of the slideshow sometimes, in this case there is an empty paragraph above the shortcode that is adding this space.

    Switch from the visual editor to the HTML editor for that page and remove the code tags wrapped around the shortcode, make sure the shortcode is on the first line of the page and it should layout correctly.

    That was it! Thank you for the amazing support.

    Plugin Author Josh Leuze

    @jleuze

    No problem!

    I also have this problem at http://lifeagain.com.au/ but there is no empty paragraph code. This is what I have:

    <p style=”text-align: center;”>[meteor_slideshow]</p>
    <p align=”center”><img src=”http://www.lifeagain.com.au/linkedin.png” alt=”” width=”48″ height=”48″ border=”0″ /> <img src=”http://www.lifeagain.com.au/facebook.png” alt=”” width=”48″ height=”48″ /> <img src=”http://www.lifeagain.com.au/twitter.png” alt=”” width=”48″ height=”48″ /></p>
    <p align=”center”>Subscribe to our Newsletter</p>

    So is there anything else I can do to remove the empty space above the slideshow please?

    Plugin Author Josh Leuze

    @jleuze

    I see some code tags on your page around the slideshow, doublecheck that and see if there are any that need to be removed.

    The shortcode should be on a line all by itself, don’t wrap a paragraph tag around it. If you want to center it, use CSS, try adding this to your theme’s stylesheet:

    .meteor-slides {
    margin: 0 auto;
    }

    The interesting thing is I didn’t add any code other than what I was given for the slideshow so not sure how the code got in there.

    However, I’ve removed the extraneous code and added the code you mentioned into the stylesheet. The image moves to the centre when first viewing the homepage and then jumps back to the left again. What else can I do to get it to stay centred please?

    Plugin Author Josh Leuze

    @jleuze

    Try making the rule more specific:

    #wrap .meteor-slides {
    margin: 0 auto;
    }

    I really can’t see how that’s going to centre the slides. Wouldn’t you need a code that has the word ‘center’ in it? I’m not a code writer but that’s what I thought it would need?

    I’ll try what you suggest though. Thanks.

    Plugin Author Josh Leuze

    @jleuze

    That code centers the main slideshow container with all the slides in it.

    This is one of those quirks of CSS, it is good at styling text, but was not really designed to style whole sites and do layout. You can use text-align: center; to center text and other inline elements, but not block level elements like divs.

    So you have to “cheat” a bit and use auto margins. What that CSS does is, it sets the top and bottom margin of the slideshow container to “0”, and the left and right margin to “auto”. So if the slideshow is 200px wide and is in a space that is 400px wide, it will automatically set the left and right margins to 100px each. The byproduct of this is that the slideshow is centered.

    Sorry, that’s way too much information, but now you know 🙂

    Ok, that did do it. Thank you so much!

    But I have now dead space above it now before the menu tabs. Is there any way to move it closer? Is there padding I should be removing or making smaller? I’m not really sure what I should be looking for.

    Plugin Author Josh Leuze

    @jleuze

    There is some dead space in there from this code which is above the slideshow, but in the editor it might actually be wrapped around it:

    <p style="text-align: center;"></p>

    Removing that will get rid of the extra space above it in the content, the rest is part of the design, top and bottom margins on the header and inner divs.

    I should have said thank you for the detailed response and explanation too – really appreciate.

    Ok, will go look for that. Thank you. I’ve removed it and hopefully the owner of the site will be happy with that. Thanks once again.

    Plugin Author Josh Leuze

    @jleuze

    You’re welcome!

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘[Plugin: Meteor Slides] Space above slider’ is closed to new replies.