putting posts with thumbnails horizontally at the bottom of each page

Hi,

I want to put posts with thumbnails horizontally at the bottom of each page (before the footer bar) My theme doesn’t seem to have the CSS codes needed to make the necessary modifications on this section.

To clarify: Are you trying to place a "recent posts" thumbnails in 1 row before the footer?

Let us know.

Yes, just a single horizontal line with thumbnails(before the footer bar)just like the website I linked in the private information field.

Thanks!

Yes, just a single horizontal line with thumbnails(before the footer bar)just like the website I linked in the private information field.

First, you'll need a plugin to show the related posts.

We recommend WP Show Posts: https://wpshowposts.com/

Upon installing and activating, you can create your post list.

Within WP you should be able to configure the number of posts that are displayed. You can also set how many columns to display.

Say for example, you want to display 4 posts in a row. To do this, you'll have to set WPSP list's post to display and column number to 4.

On the WPSP config page's right hand side, you should see a shortcode. Copy this shortcode.

You then create a Hook element:
https://docs.generatepress.com/article/hooks-element-overview/

Within the hook element's code area, paste the shortcode you've copied.

Make sure "Execute Shortcode" is checked and set the hook to generate_before_footer.

You then set the display rule location to the pages you want the recent post to display.

Thank you so much Alvin for the detailed explanation =) One more thing, I don't want it to appear on mobile ...what can I do to do just that? TIA

Hi there,

edit your Hook and wrap the shortcode in a <div> container like so:

<div class="grid-container hide-on-mobile">
    Add your shortcode here 
</div>

The grid-container will keep it from filling the full width of the screen, and the hide-on-mobile does exactly what it says :)

Hi!

Don't mind this..the issue is resolved. Thanks!

Sorry for my lack of technical know how..the div is the container where I will have to insert the codes you provided ..right? I did just that but it did not work. It still shows up on mobile and the grid container still occupies the full width of the screen.
The link to my website is in the private information field. Thanks!

Thanks, David..it worked!

Nice one. Glad you got it sorted:

To add: There're also hide-on-tablet and hide-on-desktop incase you need them.