Skip Navigation

[Resolved] 3 featured images in a row

This thread is resolved. Here is a description of the problem and solution.

Problem:
how to display 3 featured images in single row
Solution:
You can use Bootstrap Styling to design your output.

You can find proposed solution, in this case, with the following reply:
=> https://toolset.com/forums/topic/3-featured-images-in-a-row/#post-1080214
Relevant Documentation:

This support ticket is created 6 years, 3 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Kolkata (GMT+05:30)

This topic contains 5 replies, has 3 voices.

Last updated by Minesh 6 years, 3 months ago.

Assisted by: Minesh.

Author
Posts
#1079841
ftimg.jpg

Tell us what you are trying to do?

I want to create a 'featured section' containing a row displaying three latest posts with their featured images.

Is there a similar example that we can see?

Notice that this site has four 'featured posts' towards the top of the site with image and post title:

hidden link

I've also uploaded a mock-up of what I'm looking for.

What is the link to your site?

Site in development mode.

#1080214

You can follow this short guide:
hidden link

It assumes that in Toolset > Settings you load Bootstrap (either from Theme or Toolset).

It assumes as well that you want your latest posts as per Post Date on the Featured list of 3 posts.

Note:
I made a mistake in the guide, you will note that I set the View to show 4 posts instead of 3.
However that is a detail as you will notice the setting is just a select to be changed from 4 to 3.

Let me know if anything is unclear.

#1081694

Wonderful! Thanks Beda.

Just one more thing, if it possible to just display this on page 1 of the home page (archive), and not subsequent pages (2, 3, 4, etc).

Thanks

#1082749

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Well - what you mean by 1 page - could you please tell me with test example and problem URL where you want to display the view and where you do not want to display the view.

#1085820

Hi,

I managed to get the above issue sorted.

However, I was wondering how do I reduce the gap between the images/text in the row so they are closer together (with the text also neatly spaced in harmony with their images).

Any ideas?

#1087358

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

You should try to apply CSS margin or padding to your div class to have more space between your boxes.

More info:
=> hidden link
=> hidden link