[Resolved] Home Page post alignment issue

Home Forums Support [Resolved] Home Page post alignment issue

Home Forums Support Home Page post alignment issue

Viewing 15 posts - 1 through 15 (of 16 total)
  • Author
    Posts
  • #1818541
    shoukugp

    Hi

    I have arranged 3 articles in one raw with thumbnails while scrolling to the bottom section of my homepage there are 2 block is empty, how to fix this?, You have to check from pc browser

    #1818636
    David
    Staff
    Customer Support

    Hi there,

    in Dashboard > Settings > Reading you would have to change the Blog pages show at most to 9

    #1818880
    shoukugp

    FIXED IT THANK YOU

    THERE ONE MORE ISSUE RELATED TO THE HOME PAGE, REGARDING IMAGE LAYOUT SIZE ISSUE AS PER GOOGLE SPEED TEST

    Serve images that are appropriately-sized to save cellular data and improve load time. Learn more.
    WordPress
    Upload images directly through the media library to ensure that the required image sizes are available, and then insert them from the media library or use the image widget to ensure the optimal image sizes are used (including those for the responsive breakpoints). Avoid using Full Size images unless the dimensions are adequate for their usage. Learn More.

    #1818884
    David
    Staff
    Customer Support

    Go to Customizer > Layout > Blog –> Featured Images >> Archives ( Tab ). Remove any Width / Height settings you have and set the Media Attachment Size to Medium ( 300px ) or Medium Large

    #1818905
    shoukugp

    Hi,

    I have changed the settings as per your guide, earlier I was added manually 300 pixel width to show the gap between post image thumbnail, but once i change my settings as per guide there is no gap between post featured image, attached the link screenshot

    #1818920
    David
    Staff
    Customer Support

    Can you clear any caches as i cannot see the changes on the site

    #1818986
    shoukugp

    Cleared the cache, please check

    #1819053
    Ying
    Staff
    Customer Support

    Hi there,

    Try add this CSS:

    @media (min-width: 769px) {
        .generate-columns-container {
            justify-content: space-between;
        }
        .generate-columns-container article.post {
            width: 32%;
        }
    }

    Feel free to adjust the number.

    Let me know 🙂

    #1819305
    shoukugp

    Doesn’t work anything

    current additional css code as follws

    /* GeneratePress Site CSS */ /* Volume Remastered CSS */

    /* Featured post in blog */
    .featured-column.grid-100 {
    width: 100%;
    }

    .featured-column.grid-100:not(.has-post-thumbnail) .gb-grid-wrapper > .gb-grid-column:first-child {
    display: none;
    }

    /* Custom Post Navigation remove empty classes */
    .featured-navigation .gb-grid-column:empty {
    flex: 0 1;
    }


    @media
    (min-width: 769px) {
    .featured-navigation .gb-grid-column:not(:empty) {
    flex: 1 0;
    }
    }

    /* Single Post Hero image responsive controls */

    @media
    (max-width: 1024px) and (min-width: 769px) {
    .page-hero-block:before {
    background-size: cover;
    }
    .featured-column,
    .featured-column img.wp-post-image {
    width: 100% !important;
    }
    }


    @media
    (max-width: 768px) {
    .page-hero-block:before {
    background: none;
    }
    }

    /* Post Archives – force post meta to vertically align bottom */
    .generate-columns-container .post>.gb-container,
    .generate-columns-container .post>.gb-container>.gb-inside-container,
    .post-summary>.gb-inside-container {
    display: flex;
    flex-direction: column;
    height: 100%;
    }

    .post-summary {
    flex: 1;
    }

    .post-summary>.gb-inside-container>*:last-child {
    margin-top: auto;
    }
    /* Add border radius to post archive images */
    .generate-columns-container .dynamic-featured-image {
    border-radius: 4px;
    } /* End GeneratePress Site CSS */

    #1819343
    Leo
    Staff
    Customer Support

    Can you add Ying’s code in so we can see why it isn’t working?

    #1819484
    shoukugp

    Hi

    I have added the code, now the alignment issue has been fixed on the desktop browser, but in the mobile version, I don’t want to show 3 posts in one single row, in mobile it should be one post one row, how to fix this issue

    #1819660
    Leo
    Staff
    Customer Support
    #1819921
    shoukugp

    Okay, fixed now the mobile issue,

    now check my earlier issue: https://generatepress.com/forums/topic/home-page-post-alignment-issue/#post-1818880

    Upload images directly through the media library to ensure that the required image sizes are available, and then insert them from the media library or use the image widget to ensure the optimal image sizes are used (including those for the responsive breakpoints). Avoid using Full Size images unless the dimensions are adequate for their usage. (this negatively affecting Page speed score)

    I was just migrated to generate press from sahifa theme, do I want to regenerate all thumbnails?

    #1819923
    Leo
    Staff
    Customer Support

    Please open a new topic for the separate issue so we can keep one question per topic.

    Thanks!

    #1819927
    shoukugp

    Okay

Viewing 15 posts - 1 through 15 (of 16 total)
  • You must be logged in to reply to this topic.