Portfolio

4 min read Updated

Unwind shows Jetpack Portfolio projects in a grid that visitors can filter by project type, with a page for each project. View the Unwind demo portfolio.

Turn On Jetpack Portfolio

Go to PluginsAdd Plugin, search for Jetpack, then install and activate it. Unwind tells Jetpack that it supports portfolios, so a Portfolio menu shows in the WordPress menu. If the menu does not show, go to JetpackSettings, search for Portfolios and turn the setting on.

The Portfolio menu has links for projects, project types and project tags. A project is like a post, and a project type is like a category. Go to PortfolioAdd New Project to add your first project. Give each project a featured image, because the portfolio grid shows the featured image of each project.

Show Your Portfolio

Use the Default URL

If your site uses pretty permalinks, the portfolio is at /portfolio on your domain, for example https://example.com/portfolio/. You do not need to create a page. To link to it, go to AppearanceMenus, add a Custom Link and use /portfolio as the URL.

Unwind shows the projects in a grid of square images, three per row on wide screens. When the visitor points at a project, its title and project types show over the image. Above the grid, an All button and one button for each project type filter the projects on the page. The buttons show the slug of each project type, so keep the slugs short and clear. Use this method if you want Jetpack Infinite Scroll on the portfolio.

The portfolio grid with filter buttons and a project title on hover

The project type and project tag pages show the same grid without the filter buttons.

Use the Post Loop Widget

Use Page Builder by SiteOrigin to put the portfolio on any page.

  1. Edit a page. In the Classic Editor, click the Page Builder tab. In the Block Editor, add the SiteOrigin Layout Block from the block inserter.
  2. Click Add Widget and choose Post Loop.
  3. In the Template list, choose Portfolio (only for Jetpack portfolio projects).
  4. In Posts query, set Post Type to Projects, then set Posts Per Page. Without the SiteOrigin Widgets Bundle, the form has no Posts query section and the Post Type list shows jetpack-portfolio.
  5. Click Done, then publish or update the page.

The Post Loop Widget with the Portfolio template and the Projects post type

The template shows the same grid and filter buttons as the default URL. It only shows projects. If you leave Post Type set to another type, the template still loads projects, using the Portfolio Projects number in SettingsWriting, but the Older posts and Newer posts links below the grid follow the other post type. Jetpack Infinite Scroll does not work with the widget.

Use the Jetpack Shortcode

Jetpack has a shortcode that shows your projects anywhere: [portfolio]. It shows two columns by default; to change the number, add columns, for example [portfolio columns=3] for three columns.

To show a short summary under each project image, fill in the Excerpt field of the project. Unwind styles the shortcode like its grid blog layout. The shortcode does not show the filter buttons. To get them, use the default URL or the Post Loop Widget.

Projects shown in three columns by the portfolio shortcode

Number of Projects per Page

Go to SettingsWriting and change Portfolio Projects. The default URL /portfolio, the project type pages and the project tag pages use this number.

Single Project Pages

A single project page shows the date and project types, the title, the featured image, the content and the project tags. Below the content come the Jetpack sharing buttons if you turned them on, the post navigation, the author box and the comments. If Related posts on single post. is on in Blog, the page also shows related projects. Unwind uses Jetpack Related Posts when that feature is on. If not, Unwind shows three projects of the same project type.

The Featured image on single post., Date on single and archive posts., Categories on single and archive posts. and Author box on single post. settings in Blog apply to projects too; the categories setting shows or hides the project types.

Page Settings

To change the layout of one project, edit the project and use the Page settings box. It has the same settings as a page. See Page Settings.

To change all portfolio pages at once, go to AppearanceCustomizePage Template Settings and use these sections: Type: Projects for the default URL, Taxonomy: Project Types and Taxonomy: Project Tags. See Page Template Settings.

If you show the portfolio with the Post Loop Widget, the Page Template Settings do not apply to that page. Edit the page and use its Page settings box.