Corp offers support for Jetpack Portfolio content type. Once activated, Jetpack Portfolio is a quick and easy way to add portfolio items.

View the demo Corp portfolio.

The Portfolio custom post type gives you an easy way to manage and showcase projects on your site.

Required Plugin

If you don’t yet have Jetpack installed, go to PluginsAdd New and search for Jetpack. Install, activate and connect the plugin to your WordPress.com account as instructed.

Activate Jetpack Portfolio

With Jetpack (plugin) activated, go to JetpackSettings and use the search icon to search for “Portfolios”. Once located, click the toggle button to activate the Portfolios module.

Jetpack activates several modules by default. It’s worth reviewing the activated modules and deciding which ones you need. For an overview of all Jetpack modules, use the following URL: http://yourdomain.com/wp-admin/admin.php?page=jetpack_modules, replacing yourdomain.com with your own website domain.

Setup Your Portfolio

You should now see a Portfolio menu item in your main WordPress menu. There you’ll find links to add a portfolio project, project types and project tags. A portfolio project is similar to a post, a project type is similar to a category. Go to PortfolioAdd New to add your first portfolio project.

Display Your Portfolio

Once you have at least one portfolio project you can setup your portfolio to display in your WordPress site. You can choose between one of the following methods to display your portfolio.

Using the Default URL Structure

If you’re using Pretty Permalinks (links) for your WordPress installation you can simply link to your portfolio without creating a page. Simply go to go to your domain /portfolio. For example, in the Corp demo you can go to http://demo.siteorigin.com/corp/portfolio/. To link to your portfolio, go to AppearanceMenus and insert a Custom Link item. Link to your portfolio using the /portfolio URL.

If you’d like to use Jetpack Infinite Scroll with your portfolio then this is the display method to use.

Using the SiteOrigin Post Loop Widget

With Page Builder by SiteOrigin activated, go to any page and click on the Page Builder tab. Click the Add Widget button and search for the Post Loop widget. Once inserted, edit the widget and select Portfolio from the Template drop-down list. Next, click on the Posts Query section usually, you’d need to use the Post type drop-down to select Projects, however in this case, once the Portfolio template has been selected, the portfolio post type will automatically be used. This means that the Portfolio template can’t be used for posts, only the portfolio post type. Further down you can also make use of the Posts per page setting. Finally, click the Done button and publish or update your page.

Only the regular post loop pagination will work with this display method. For most users that’s perfect. If you’d rather make use of Jetpack Infinite Scroll then please, use the default URL structure method explained above.

Using the Jetpack Portfolio Shortcode

Jetpack offers a shortcode to display your portfolio wherever you’d like [portfolio]. To set the number of columns, change the shortcode to [portfolio columns=x] where x equals the number of columns. For example, to display three columns you’d insert [portfolio columns=3].

To display a short summary of each project below the thumbnail, use the Excerpt field when editing each project.

We’ve styled the shortcode output the same as our grid blog layout. To make use the sortable grid layout you see in the Corp portfolio demo, please use either the default URL structure or Post Loop widget method mentioned above.

Number of Portfolio Items per Page

To set the number of portfolio items that display per page, go to SettingsWriting and edit the Portfolio Projects setting.

Controlling Page Settings for Archive Pages

If you’ve inserted your portfolio using the Post Loop widget on a page, removing the sidebar or adjust other page settings is easy. Simply locate the Page Settings meta box in the right column and adjust the settings as required.

Adjusting the page settings for archive and taxonomy pages is also possible from within the Customizer. Examples of these pages are:

Type: Projects
Taxonomy: Project Types
Taxonomy: Project Tags

To adjust the page settings on any of the above page types go to AppearanceCustomizePage Template Settings. Initially, only the Search Results and Not Found pages will be available. The Page Template Settings section will display settings for other pages when you navigate to them. Using the links in your site in the preview window to the right, navigate to a Taxonomy: Project Types page or a Taxonomy: Project Tags. Once there, a new section will appear in the Page Template Settings section and you’ll be able to adjust the page settings as required.

Navigating to a project type or tag is quite easy, simply browse to your portfolio, open a single project and click on a project type link in the top meta information or a project tag link at the bottom of the project text.

Please note: if you’ve used the Post Loop method of inserting your portfolio, Page Template Settings in the Customizer aren’t applicable for the page you’ve inserted the Post Loop widget into. Instead, to edit Page Settings for that page, simply edit the page and use the Page Template Settings in the right column.

Corp Page Template Settings documentation.

Controlling Page Settings for Single Project Pages

To edit the page settings for single project pages, navigate to PortfolioAll Projects in your main WordPress menu. Edit the project you’d like to adjust and locate the Page settings meta box in the right column. There you’ll find settings for Page Layout, Header Overlap, Header Bottom Margin, Page Title, Footer Top Margin, and Footer Widgets. To find out more about using Page settings, please see the Corp Page settings documentation.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More