WordPress.org

Ready to get started?Download WordPress

Forums

[Plugin: NextGEN Gallery] Any Way to Center Gallery Thumbs? (12 posts)

  1. variedcelluloid
    Member
    Posted 5 years ago #

    I hate to refer to myself as a noob with this sort of stuff, but compared to most on here I definitely am. I have searched through all the pages I could find and could not turn up anything that could help me with what I am trying to do. I love NextGEN, but am having difficulty adjusting it to my site due to ignorance on my behalf. Essentially, what I am trying to do is put galleries in all of my reviews using nextgen.

    Now, I've tried to adjust the CSS as much as I can, but without being able to use any kind of '< center >' tag that works I'm just stumped on how I can keep a uniform look when people visit the site with different resolutions. I use 8 images for all galleries, and what I want is for them to all sit next to one another uniform. If the images have to break and wrap around on a new line, I would like for the second line to be centered. I'll post a few shops to show what I have and what I'm *wanting* to do.

    Using this page as an example:
    http://www.variedcelluloid.net/?page_id=127

    At my resolution of 1152x864, the page looks roughly like this

    I would like to have it look something like this.

    Or more preferred, like this. Now, I can produce this effect using simple 'padding' properties but when I change resolutions it isn't going to keep that same two column structure.

    Anyone have any advice? Need me to post my css? Is there anything I can do to produce a similar effect? If so, can you give me any kind of clue so I can google it? Am I looking over some option that is right out in the open? Really just trying to perfect my review pages, and I hope this question isn't totally idiotic - though I'm sure it is.

  2. variedcelluloid
    Member
    Posted 5 years ago #

    Anybody have any ideas? I've pretty much run out of fresh thoughts on the subject, and am looking for help any way I can get it :P

  3. variedcelluloid
    Member
    Posted 5 years ago #

    Still trying and trying. I'm just wrapping my head around the whole float command, and have went over the stylesheet trying to hopefully find anything I can adjust that corresponds with the items within the float command. I'm wanting the thumbnails to center, not the gallery-box itself. I've tried 'margin-left: auto;' & 'margin-right: auto;' on pretty much everything under the "Gallery Style" section to no avail. As well as playing with padding commands, 'text-align: center;' and just about anything else I can find to try. I'm starting to wonder if what I'm looking for is outside the stylesheet, and if it is, where and what? Not sure, I'll just keep trying I suppose.

  4. variedcelluloid
    Member
    Posted 5 years ago #

    I'll give this one last bump. I've split my thumbnail-gallery into two pages for now, hope it's not going to be my permanent fix but it might have to be.

  5. nicknormal
    Member
    Posted 5 years ago #

    I don't have a clue! I've tried about 20 hacks.

    ?: how did you split the thumb gallery? clever-n-nice.

  6. noise
    Member
    Posted 5 years ago #

    yeah - how?

    I've gone through everything css related

    Can't figure out - perhaps a js thing?

  7. variedcelluloid
    Member
    Posted 5 years ago #

    Hey guys, yeah sorry about the late reply - but splitting the gallery is pretty simple. It's under Gallery >> Options >> Gallery. On the "Number of images per page:" box you just select the number of graphics you want on the page at once and it will split them up that way. I usually have 8 images per review, so I split it by 4 and it makes two even pages (well, in some browsers and at some resolutions... argh!).

    Here's a screencap to show you where the option is exactly:

    http://www.variedcelluloid.net/images/gallery-split.jpg

    It's working for me as a temporary solution - but like you all I'm hoping for someone who might have a better trick that will solve my problem.

  8. Alex Rabe
    Member
    Posted 5 years ago #

    You cannot center three images if you use float , but you can center a gallery more or less with marging. What do you need for that :

    Firebug : there exist no better tool to test online the result of you css modification

    Here is a example : http://nextgen.boelinger.com/gallery-page/

    If I add for example to .ngg-galleryoverview { margin-left:45px; }, it's a little bit centered. (Ok, the theme has a fixed width, which makes it easier )

    If you remove from .ngg-galleryoverview width: 100%; and add margin-left:100px; it will show up with two pics in a row

    I'm still a beginner for CSS. so any ideas, tweak or recommendation are always welcome...

  9. variedcelluloid
    Member
    Posted 5 years ago #

    "You cannot center three images if you use float..."

    Hi Alex, sorry to be a pest, but is there any alternative to using float? Would this require delving into the PHP and such? I'm a beginner with much of this, so this may be a stupid question. Like asking a mechanic "So it'll work if I just put a new engine in it right? How do I do that?" or something.

  10. Alex Rabe
    Member
    Posted 5 years ago #

    I have no other idea

  11. Phlux0r
    Member
    Posted 5 years ago #

    I had the same problem but I solved it by setting a % value for the ngg-album class. Since I have 3 columns, I set 31% on .ngg-album and adjusted the margins etc so it looks like the thumbs are nicely spaced across the content area. Look here for the example.

  12. nicknormal
    Member
    Posted 5 years ago #

    you would actually want to set that value to 33% - 33 x 3 = 99 which is closest to 100%.

    and that works well if your theme is fixed width, but for fluid themes it doesn't allow automatic adjustments to the user's preferred format. a slight limitation.

Topic Closed

This topic has been closed to new replies.

About this Topic