Docs    Facebook    Customizations

Can I display my Facebook posts horizontally or in multiple columns?

To create a multi-column masonry layout for your feed, just use the setting in the following location: Facebook feed > All Feeds > Feed settings (pencil icon) > Customize tab > Feed Layout > Columns.

Below version 4.0

There is now a built-in setting to create a multi-column masonry layout for your feed. Just use the setting in the following location: Facebook Feed > Customize > General > Feed Columns, or use the cols shortcode setting.

Using CSS instead to display one row of posts

To display your posts horizontally you would need to do the following:

2 posts

Set the number of posts to be 2, or use the following shortcode:

Comments Box SVG iconsUsed for the like, share, comment, and reaction icons
Load more

Add the following to the plugin’s Custom CSS section, which is under the Misc tab on the plugin’s Customize page:

#cff .cff-item{ width: 46%; clear: none; padding: 0 2%; border: none !important; }

3 posts

Set the number of posts to be 3, or use the following shortcode:

Comments Box SVG iconsUsed for the like, share, comment, and reaction icons

3 weeks ago

Smash Balloon

Did you know that 65% of people are visual learners? πŸ‘€

By embedding your #instagram feed, you can give people an easier way to learn about your brand.

The best part? You can do this for free!

Check out our new video below to get started right away: πŸ‘‡

... See MoreSee Less

Video image

Comment on Facebook

Load more

Add the following to the plugin’s Custom CSS section, which is under the Misc tab on the plugin’s Customize page:

#cff .cff-item{ width: 31%; clear: none; padding: 0 1%; border: none !important; }

4 posts

Set the number of posts to be 4, or use the following shortcode:

Comments Box SVG iconsUsed for the like, share, comment, and reaction icons

3 weeks ago

Smash Balloon

Did you know that 65% of people are visual learners? πŸ‘€

By embedding your #instagram feed, you can give people an easier way to learn about your brand.

The best part? You can do this for free!

Check out our new video below to get started right away: πŸ‘‡

... See MoreSee Less

Video image

Comment on Facebook

Load more

Add the following to the plugin’s Custom CSS section, which is under the Misc tab on the plugin’s Customize page:

#cff .cff-item{ width: 23%; clear: none; padding: 0 1%; border: none !important; }

5 posts

Set the number of posts to be 5, or use the following shortcode:

Comments Box SVG iconsUsed for the like, share, comment, and reaction icons

3 weeks ago

Smash Balloon

Did you know that 65% of people are visual learners? πŸ‘€

By embedding your #instagram feed, you can give people an easier way to learn about your brand.

The best part? You can do this for free!

Check out our new video below to get started right away: πŸ‘‡

... See MoreSee Less

Video image

Comment on Facebook

Load more

#cff .cff-item{ width: 18%; clear: none; padding: 0 1%; border: none !important; }

support

Couldn’t find your answer in the docs?

Contact Support

Was this article helpful?