[Support request] Move Featured image to the left of Post title on blog layout in mobile?

[Gulshan]

Hello,

Tried this below code but I would like to implement only for mobile device.

add_action( 'wp', 'tu_move_featured_image' );
function tu_move_featured_image() {
    remove_action( 'generate_after_entry_header', 'generate_post_image' );
    add_action( 'generate_before_content', 'generate_post_image' );
}

Refer to the screenshots for mobile layout:

https://drive.google.com/file/d/15hpVlihVMO5MhG3V_VCPX7i4_j0R85TS/view?usp=sharing

Kindly help me please?

Thanks

[David]

Hi there,

can you remove the filter and share a link to your site so i can take a look.
You can edit your original topic and use the Site URL field to share the link privately.

[Gulshan]

Just Updated the topic with site link & screenshots.

[David]

Try adding this CSS:

@media(max-width: 768px) {
    .entry-summary {
        display: none;
    }

    body:not(.single) .inside-article {
        display: grid;
        grid-template-columns: 40% 60%;
    }

    .post-image,
    .entry-header {
        grid-row: 1;
    }

    .post-image {
        grid-column: 1;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        margin-right: 2em !important;
    }
}

[Gulshan]

Brilliant, thank you very much.

[David]

Awesome – glad to be of help 🙂

[Author]

Posts