Portfolio Block

Display a collection of posts in a portfolio.

The Portfolio Block is perfect for showcasing multiple portfolios throughout your WordPress website.

View Pricing View Demo
Latest Version 2.4
WordPress Version 5.2+
View Changelog
View Setup Guide
Get Support

The Portfolio Block is available in the Organic Blocks Bundle. The block displays a portfolio of posts from a selected post type. It may be added to any page or post using the WordPress 5+ Gutenberg editor. Additionally, several options are provided for modifying the layout, style, colors, and more.

Getting Started

To get started, add the Portfolio Block to any page or post using the WordPress 5+ block editor. Search “Organic” or “Portfolio” within your list of available blocks. Upon adding the block, select your post type and taxonomy. Then, click the “Done” button. As a result, the portfolio will render within the editor as it appears on your website.

The Portfolio Block displays the featured image, title, excerpt, and a Pinterest link for each portfolio item. The featured image displays as the portfolio image for each post. Additionally, block options are available on the right to modify the portfolio settings and style.

Portfolio Block Options

Each instance of the Portfolio Block contains several options to change the appearance. The options are divided into categories, and a description of each option is provided below.

General Settings
  • Style: Choose from a list of per-defined styles for the block.
  • Heading: Change the HTML heading of the portfolio title.
  • Content Position: Change the position of the portfolio content.
  • Order: Choose the order in which to display portfolio posts.
  • Maximum Number Posts: Enter the maximum posts to display before pagination.
Display Settings
  • Title: Toggle the display of the portfolio title.
  • Excerpt: Toggle the display of portfolio excerpt/summary.
  • Pinterest Button: Toggle the display of the Pinterest icon button.
  • Link: Toggle the portfolio item permalink.
  • Show Content On Hover: Toggle the display of content when hovering over portfolio items.
  • Pagination: Toggle the pagination for portfolio posts.
Layout Settings:
  • Masonry Layout: Toggle the Masonry.js layout. Masonry displays items in a fluid grid in which portfolio posts fit together like pieces of a puzzle.
  • Columns: Change the number of columns. The range increases to a maximum of 6 columns.
  • Gutter Width: Change the spacing in pixels between each portfolio item. The default spacing is 24 pixels.
Color Settings:
  • Title Color: Change the color of the portfolio title.
  • Excerpt Color: Change the color of the portfolio excerpt.
  • Pin Icon Color: Change the color of the Pinterest icon.
  • Hover Background: Change the background overlay color that is visible on hover.

Portfolio Block Requirements

The Portfolio Block requires published content on your WordPress site in order to display properly. As a result, we recommend publishing multiple posts with featured images, and applying a category before using this block on a fresh WordPress installation.

All WordPress blocks, including Organic Blocks, require WordPress 5+ and the Gutenberg editor. Additionally, the Organic Blocks Bundle requires that your server is using PHP 7+ in order to work properly. Please Note: These are standard requirements for running WordPress 5+ on any web server.