How do I center thumbnails in a gallery?

  • I’d love this done for any gallery or at least 1 entire gallery if possible, if I have to make edits for each image I can do that but it’d be much more efficient if it could apply to a Gallery as a whole or the website as a whole.

    The images you see in the picture I’m sharing were set to the medium setting in WordPress, they’re still clickable and relatively small so I’m thinking they’re still technically thumbnails, if not give me the heads up on what I’d need to do for medium previews in a gallery.

    If pages like the one in the pic have all the thumbnails/medium previews centered it’d be what I’m wanting. It looks a little off otherwise. You can see all the space on the right side in the pic.

    Does anyone know of a way to do this? My coding knowledge is limited so I’d need specifics, especially if I have to apply code to each image for it to work, I’d need to know how to identify an image I have in my media library.

    https://www.dropbox.com/s/b8pn8atu9cf4uyi/Gallery%20not%20centered%20example.PNG?dl=0

    Thanks in advance.

Viewing 15 replies - 1 through 15 (of 15 total)

  • Is this your own custom theme?

    Thread Starter mikenet7482

    (@mikenet7482)

    Nah, it’s the Mantra theme. It doesn’t have that as a feature from what I can tell, and I don’t see it built into WordPress. I’ve customized the theme a good bit though. Such as those borders you see around the previews (I’m going to thin them down)

    I’m getting help with a lot of this though because I’m still learning as I go.

    Have you tried asking in the theme’s dedicated sub-forum: https://www.ads-software.com/support/theme/mantra ?

    You really should not edit the theme itself. Instead, you should create a child theme for your changes. Or install a custom CSS plugin.

    Thread Starter mikenet7482

    (@mikenet7482)

    I have a child theme ?? The Mantra subforum is really slow but Im currently getting help with another issue in premium support who is answered by the same guy who attends the forums. They like that you spread out your questions, so I try to.

    The theme also has a built in css editor if that’s any help.

    Can we see your live site?

    Thread Starter mikenet7482

    (@mikenet7482)

    Sure

    Um… url?

    Thread Starter mikenet7482

    (@mikenet7482)

    Here it is, I usually don’t keep it live for very long since it’s not finished. I’ll do so for a while today, then let me know if you need it again in the future if we don’t solve this now.

    Nevermind all the redundant comments, I was testing page number navigation for comments to my post. (not working 100% yet either)

    https://www.dividedifnotunited.com/

    Click the Gallery button in the header.

    Thread Starter mikenet7482

    (@mikenet7482)

    Also if it didn’t work a minute ago try again, I had forgot to turn off the website lock.

    Which gallery should we be looking at?

    Thread Starter mikenet7482

    (@mikenet7482)

    And that gallery button in the header that leads to the appropriate gallery page is custom, I doubt that matters but just in case I thought I’d mention.

    Thread Starter mikenet7482

    (@mikenet7482)

    Look at the one after you click on the gallery button in the header, you’ll see that all previews are aligned to the left.

    Sorry – got it! That gallery looks pretty central to me. You’re always going to get minor placement differences depending upon how may images/thumbnails you have in a row, the width of each image and the various browser algorithms for calculating whether it can fit 2 or 3 images across.

    Markup looks clean and CSS seems fine but you may be creating a bit of a headache for yourself by creating long strings oh characters with no spaces for the captions. That will break any design and doesn’t really emulate real text. I’d suggest sticking with some “lorem ipsum” test. If you’d like to populate your test site painlessly, there’s a Theme_Unit_Test you can import. It’s designed to test themes for the WPORG repository, so it covers most bases.

    In terms of thumbnail size (and, yes – they will all be thumbnails), the actual size of the images is governed by the Thumbnail dimensions in Settings -> Media. Those look a little on the large size to me. If you do opt to change the dimensions, remember to install and run this plugin afterwards to resize all of the existing thumbs.

    Not much else I can say to help really. It all looks quite tidy to me.

    Thread Starter mikenet7482

    (@mikenet7482)

    You think so? The first row of the gallery looked off to me with a lot of space on the right side, the second row turned out fine, I think the resolution of the images helped fill more space.

    I’ll take a look at the plugin, thank you. ?? If you or anyone here can think of anything else give me a holler.

    Hey Esmi
    I have the same question, how do you centre images>
    My website looks bad as peoples heads are off the thumbnail
    I’m using gigabox and have recently purchased The Grid, but still learning how to use it.
    How to do centre the image on a thumbnail?
    Any help would be appreciated
    https://vip-entertainment.com.au/celebrity-talent-gallery/
    Darren

Viewing 15 replies - 1 through 15 (of 15 total)
  • The topic ‘How do I center thumbnails in a gallery?’ is closed to new replies.