• Resolved ninabon

    (@ninabon)


    As it’s described on the style guide, to get complex galleries, we stack galleries with different numbers of columns on top of each other, and to get the same space between the separate galleries than between individual gallery items, we must remove line breaks between each gallery.
    But how we can remove this line breaks? When I create a gallery, a line breaks appears automatically on the bottom of the block and I don’t know how to delete this line breaks .

    Thanks in advance.

Viewing 12 replies - 1 through 12 (of 12 total)
  • Theme Author Anders Norén

    (@anlino)

    Hi @ninabon,

    The stacked gallery margins work when using the old [gallery] shortcode (used by the Classic Editor), but not when using the Gallery block in the new block editor. I’ll take a look at updating the styling for the gallery block to match in a future update.

    — Anders

    Theme Author Anders Norén

    (@anlino)

    I tried including a fix for this in version 1.27, but it turns out that the gallery block in the most recent version of WordPress includes a caption element beneath the grid of images regardless of whether a caption has been set for the gallery or not, meaning that I can’t know how large the space beneath the gallery block will be and can’t remove it with a negative margin on the gallery block beneath it. I’ll have to take another look at this if/when this gets fixed in core.

    Thread Starter ninabon

    (@ninabon)

    OK. I’m going to do the galleries in a different way with the new editor.

    Thanks Anders!

    Thread Starter ninabon

    (@ninabon)

    I’ve just seen your second answer. Yes! This caption element beneath the grid of images is just what I was referring and I couldn’t remove.

    Well, thanks anyway!

    Any update on this issue? The gallery stacking was a feature that really drew me to this theme.

    Thank you!

    Theme Author Anders Norén

    (@anlino)

    Hi @lemonfig,

    Thanks for the nudge! It turns out Core fixed the issue with the empty gallery caption in 5.4.1, so I was able to take another look at this. Version 2.0.6 of Hamilton should be live shortly, and will remove the vertical margin between gallery blocks set to the same alignment. Give it a try and let me know if it works.

    (Pinging @ninabon as well, since she created the topic.)

    — Anders

    Hi Anders, I just tried, got too much of a margin. Apparently 16px exactly.

    For me this works:

    .entry-content .wp-block-gallery.alignwide + .wp-block-gallery.alignwide,
    .entry-content .wp-block-gallery.alignfull + .wp-block-gallery.alignfull {
        margin-top: -2.5em;
    }
    

    Admittedly, I have only tried .alignwide as I don’t use .alignfull.

    There’s an example here (the site uses a child theme with the above change):
    https://www.venicestreetphotography.com/photos/venice/

    Thanks a lot for this great theme.

    Theme Author Anders Norén

    (@anlino)

    Hi @seindal,

    It looks like your post uses the old Gallery block markup structure, where the ul element isn’t wrapped in a figure. If you edit the post, make some change to the gallery blocks and update it, the markup structure should be updated. That’s one of the difficulties of the Block Editor – even if you’re on the latest version of WordPress, any content created in previous versions of the Block Editor will retain the old markup. It’s a bit of a headache for theme developers.

    It’s true that the styling could do a better job of accounting for those differences in markup though, so I updated the block gallery margins slightly in version 2.0.7, which just went live. It will make sure the vertical margin is consistently 16 pixels regardless of whether the block has the figure markup or the old ul only markup.

    Let me know if it does the trick. Glad you like Hamilton!

    Edit: Oh, and I love the photographs on your site. I’ve been to Venice a couple of times. It’s a beautiful city.

    — Anders

    • This reply was modified 4 years, 6 months ago by Anders Norén.

    You’re totally right. Once I open and save the post, your solution is the correct one, and mine is wrong.

    Do you know if there’s a way of bulk updating the markup structure of all posts on a site? I fear not, as much of Gutenberg happens client side in JS.

    Actually I use quite a few of your themes: koji, hamilton, chaplin, hoffman at least. I like the simplicity of them. I’m not a hawk at frontend stuff, but standing on the shoulders of giants makes you reach higher.

    Thanks a lot for the praise for the photos. If you ever come to Venice, spritz is on me.

    Theme Author Anders Norén

    (@anlino)

    Happy to hear it fixed the issue. I believe you’re correct – the Block Editor probably requires you to manually update each post in order to apply the updated markup, since the markup is updated by the JavaScript. Nature of the beast.

    I’ll take you up on that!

    Thanks @anlino it worked! However, could it also work with single images? The spacing is different between single images / gallery and gallery / single images.

    Thank you!

    Theme Author Anders Norén

    (@anlino)

    Hi @lemonfig,

    I’m a bit more hesistant to add it to single images, since Hamilton hasn’t stacked single images in the past and since some people might want the space between them. You can add a gallery block with a single image, though – it should display the same as a regular image block, and will remove the spacing between itself and other gallery blocks with the same alignment.

    — Anders

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘How we can remove the line breaks between galleries?’ is closed to new replies.