Gallery columns not showing properly on front end with version 6.4.2

  • hooma

    (@hooma)


    11 months ago

    Hi,

    My site – https://traveljaunts.in

    All the posts have issues as the gallery is not showing properly . Backend is different and front end is different. No matter how many columns i create in gallery at backend, only one colums shows on front end and the image sizes are also going haywire. Here’s a post with display issues – https://www.traveljaunts.in/45-photos-inspire-visit-morocco

    However every post has this problem

    I tried to add the below code too but that also is not solving the issue

    }
    .wp-block-gallery.wp-block-gallery-1 {
    gap: 10px !important;
    }

    .is-layout-flex {
    display: flex;
    flex-wrap: wrap;
    }

Viewing 1 replies (of 1 total)

  • I tried to add the below code too but that also is not solving the issue

    It seems you’re not using the block editor (aka Gutenberg)… at least not for the page you provided.

    So display and styling of the gallery (and everything else on the page) is really up to your theme and the page builder plugin your theme provides. And I don’t see any code showing your theme or said plugin attempting to style the galleries at all.

    This also explains why the CSS code you provided does nothing because the classes used are only available when using WordPress’ native block editor.

    The following CSS should break the galleries into the defined columns:

    .gallery {
    display: flex;
    gap: 10px;
}

    But I don’t consider this a complete solution because when you have images of different heights and widths, this code will not force an equal width & height grid layout.

    It should surely be possible to force a uniform grid layout, but that involves more CSS wrangling than I have time for now. I’ll recommend you contact the theme’s vendor — the folks you purchased the theme from — for help with this.

    Good luck!

Viewing 1 replies (of 1 total)
  • The topic ‘Gallery columns not showing properly on front end with version 6.4.2’ is closed to new replies.