How to style [gallery]?

  • I am trying to call and style the WordPress gallery from single.php. Plugins are not an option.

    I am trying to get the gallery to show to the right of the main post area.

    Problems:

    1. The incorrect gallery is showing.
    2. The padding won’t get smaller.
    3. I can’t get more than 3 thumbnails to display in a single line.

    I have tried this:

    <div style="
position:relative;
z-index:1000;
display: inline;
list-style-type: none;
margin: 600px 0 0 340px;
padding: 0;">
<?php echo do_shortcode('[gallery id=""]'); ?>
</div>

    And I have tried this:

    <div style="
position:relative;
z-index:1000;
display: inline;
list-style-type: none;
margin: 600px 0 0 340px;
padding: 0;">
<?php echo do_shortcode('[gallery id="'.get_the_ID().'"]'); ?>
</div>

    Neither works. Help?

Viewing 8 replies - 1 through 8 (of 8 total)
  • Thread Starter websta

    (@websta)

    So does this (not getting any responses) mean that the wordpress gallery cannot be effectively styled?

    – Or that the question is complicated?

    – Or that the question is incredibly simple?

    – Or that I offend others in some way?

    If anyone — anyone at all — could respond as to their reason why there are no responses, that at least would help me move on.

    Thread Starter websta

    (@websta)

    Wow, no responses. Not even something about the question being confusing or whatever.

    I’m wondering if wordpress itself is dying off, since when forums die, that’s usually the first step off the cliff.

    What a shame.

    WordPress and the forum aren’t dying. Unfortunately, this is a volunteer forum, and not everyone might know an answer to a question. Please don’t take it personal.

    When you say a plugin isn’t an option, do you mean any kind of plugin? I found adding the Cleaner Gallery plugin, it helped. I also found when I was trying to float a gallery to to the right of my content, it was messing up. What I found was .gallery was being set with clear: both; which screwed up my float left and right in my single page layout. I added a clear: none !important; to the theme stylesheet to get around that.

    I also used !important in the theme style sheet to override a few other of the inline styles the gallery was adding to change margins and padding.

    Hope that points you in the right direction…

    To be clear I added .gallery {clear: none !important;} as well as a few other specific margin/padding/width settings I wanted all with an !important declaration in the theme’s stylesheet. You can add some functions to completely override the inserted CSS and completely write your own, I’ve seen some posts in the forums on how to do that as well.

    This was just a simple workaround for my own purposes and might help. I’m not a big fan of !important; but I’m also not a fan of inline styling being inserted for me. But a nifty function you get a trade off.

    Thread Starter websta

    (@websta)

    Thank you, miklb. I appreciate you taking the time to clarify things for me — including about the forums. That’s good to know.

    The tips you gave were enough for me to figure out how to move things over, and get most everything worked out.

    If I can just figure out how to change the z-index layer of the image that loads when a thumbnail is clicked, I’ll be all set…

    Does anyone know what the class(es) of that image is?

    you can check what the class is specifically by going to that page and then viewing the page source. That’s how I figure out exactly what’s going on in a theme.

    Or install the firebug addon for firefox, or dev toolbar for IE….. then you can just point at an element to view its class, as well as all styles applied to it, and their source

    Is really simple [gallery columns=x] where x is the number of columns to display.

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘How to style [gallery]?’ is closed to new replies.