Live examples of Flexbox lists made by Ultimate Post List Pro (plugin for WordPress)

Icon Ultimate Post List Pro

“Ultimate Post List Pro” (UPLP), a WordPress plugin, lets you create fascinating layouts for lists of posts. You can switch your post list type easily to a “Flexbox” and get all the power of that stunning technique.

And you don’t need to write any code! UPLP gives you easy-to-use and yet powerful options for the post list items like the width, the wrapping and the spatial distriution. And of course you have all the other options like the font styles, colours etc. at your fingertips.

The Flexbox support makes “Ultimate Post List Pro” (UPLP) one of the best WordPress plugins for creating customized post lists with many happy users.

Some examples of the Flexbox’ potential

Take a look at the following examples for the Flexbox feature! Hint: You will see the power of the Flexbox layout at its best immediately if you’d resize your browser window slowly.

Flexbox 1, one item centered

The Flexbox settings of this list with 1 item are:

  • List flow direction: row (horizontal axis)
  • List item width: 50%
  • Wrapping: enabled
  • Spatial distribution along the main axis: centered
  • Spatial distribution along the cross axis: centered
  • Spatial distribution of the lines: centered

The Flexbox settings of this list with 7 items are:

  • List flow direction: row (horizontal axis)
  • List item width: 150px
  • Wrapping: enabled
  • Spatial distribution along the main axis: equal spacing
  • Spatial distribution along the cross axis: stretched
  • Spatial distribution of the lines: equal spacing

The Flexbox settings of this list with 9 items are:

  • List flow direction: row (horizontal axis)
  • List item width: 30%
  • Wrapping: enabled
  • Spatial distribution along the main axis: aligned at the axis start
  • Spatial distribution along the cross axis: stretched
  • Spatial distribution of the lines: packed to the container start

Flexbox 4: Three in one row

The Flexbox settings of this list with 3 items are:

  • List flow direction: row (horizontal axis)
  • List item width: 25%
  • Wrapping: disabled
  • Spatial distribution along the main axis: no spacing, i.e. aligned at the axis start and end with equal spacing between the items
  • Spatial distribution along the cross axis: stretched
  • Spatial distribution of the lines: no spacing, i.e. aligned at the axis start and end with equal spacing between the lines

Flexbox 5: Two-columns Layout

The Flexbox settings of this list with 8 items are:

  • List flow direction: row (horizontal axis)
  • List item width: 48%
  • Wrapping: enabled
  • Spatial distribution along the main axis: no spacing, i.e. aligned at the axis start and end with equal spacing between the items
  • Spatial distribution along the cross axis: stretched
  • Spatial distribution of the lines: no spacing, i.e. aligned at the axis start and end with equal spacing between the lines

Get Ultimate Post List Pro

Ginny Deering 2017-02-04 Norwalk, CT Website
Relentless Customer Service  

I had a problem with the pagination on my site and Martin worked on the code until he got it! How many plugin developers would do that for you? I give this plugin 5 stars for its flexibility and great customer service.

Over 744 orders already processed!

Renewable license for 1 year of updates and support, lifetime use after license expiration:

Select your preferred currency

Add to Cart / In den Warenkorb Includes 16% tax

Get it via a secure purchase with money-back-guarantee!