Guides/Create content/Pages and posts/Display portfolio projects on your site

Display portfolio projects on your site

By now, we recommend that you have created and published a few projects in your portfolio. In this guide, we’ll look at the different ways you can show your projects on your website.

Use the default portfolio page

The default portfolio page is automatically created for you, and is the quickest method for displaying your projects on your site. The instructions below will show you how to find the link to your portfolio page.

Select the appropriate tab below based on which method you used to activate portfolios.

After activating your portfolio and publishing at least one project, your site will automatically create a new portfolio page with your projects.

To view the new projects page, follow these steps:

  1. Visit your dashboard.
  2. Navigate to Posts → Categories.
  3. Hover over your portfolio category and click the “View” link.
The "View" option in the category listing for the "Portfolio" category.

Viewing the portfolio category this way allows you to see what your visitors will see. You’ll notice that the category URL is something like:

https://yourgroovysite.wordpress.com/category/portfolio

All of your projects will automatically appear on this page of your site in chronological order, with the most recent first. If you wish to change the order, you can adjust the date the project was published in the page settings.

A portfolio category page as visitors would see it.
The default portfolio category page in the Twenty Twenty-Four theme

Themes that support the Site Editor can edit the layout of these pages. To edit the layout of the default portfolio pages, edit the All Archives template.

Create a custom portfolio page

You can design your own portfolio page from scratch or with the help of pre-designed block patterns. Take the following steps to create a new page for your portfolio projects:

  1. Visit your site’s dashboard.
  2. Click on Pages on the left side.
  3. Click on the “Add new page” button.
    • If prompted, select starter content, or click the “X” in the top-right to start with a blank page.
  4. Insert a Query Loop block and adjust one of the following settings to display your portfolio projects:
    • If you’re using a portfolio category, select the portfolio category in the filters.
    • If you’re using a custom post type, select “Project” as the post type setting.
  5. Click the Publish button in the upper-right corner to make your page live.
An example portfolio using the Query Loop block filtered to the portfolio category.
The Query Loop block can be designed in several different layouts.

Optionally, you can set your new Portfolio page as your site’s front page by following the steps in our Set the Homepage guide.

Use portfolio shortcode

A less commonly used method for displaying portfolio projects on your site is through the use of shortcodes.

If you created a category for your site’s portfolio projects, you will use the shortcode. If you activated the custom post type for your site’s portfolio projects, you will use the [portfolio] shortcode.

Select the appropriate tab below based on which method you used to activate portfolios.

Add the display-posts shortcode to a post or page using the Shortcode Block. Use the category filter to display just the posts from your portfolios category.

In the following example, the category is set to portfolios, the content of the testimonial is included with the “true” value, and the image_size=”medium” will display the featured image in a medium size:

[display-posts category="portfolios" include_content="true" image_size="medium"]

Learn more about the display-posts shortcode.

Was this guide helpful for you?

Not quite what you're looking for? Get Help!

Copied to clipboard!