TUTORIAL

Setup a basic portfolio

In this tutorial I’ll walk you through everything how to setup a basic PORTFOLIO PAGE properly, using self-hosted WordPress with Pinboard theme:

  • Creating the look and feel
  • Using a category
  • Adding content to your portfolio
  • Setup Pinboard options
  • Handeling content with your main page
  • Showing the new topic in your navigation

Using a portfolio can have different purposes and goals, too many to explain ALL options but you will get the hook of it quickly.

1) Choose your portfolio style

The first page of your portfolio shows all your posts that you decide to be in the portfolio. You will learn in a later stage how to choose. These posts will be displayed with only an image, which must be a thumbnail, and a headline each. Thats the beauty of the portfolio. Therefore you need to choose a style (=template) how to display them. The template can be for example a grid of 3 columns and a sidebar or 4 columns and no sidebar or other combinations and can be changed later. For this one we will use the standard template.

  • Create a PAGE and name it “Portfolio”
  • In the dedicated box “Attributes” change the dropdown “Template” to “Portfolio” (you can come back later here to change the template but make sure you always choose an option starting with “Portfolio…”).
  • Publish the page

2) Add categories

It’s important to add categories so that WP knows which posts you want to show in your portfolio. In this tutorial we add only one category, but I will explain in another tutorial how to use multiple categories properly in a portfolio.

  • Goto “Post/Categories”
  • Type “Portfolio” in the field “Name” and click “Create new category”

The new category should now appear in the box

3) Add content

Now it’s time to add some content. Always remember that a portfolio always shows only the headline and an attached thumbnail. No thumbnail attached – no image on your portfolio overview page.

  • Create a POST and name it “Example 1”
  • In the dedicated box “Categories” choose “Portfolio”
  • Add a thumbnail to the post
  • Add images and copy to the post (optional)
  • Publish the page
The size of the thumbnail don’t need necessarily to be small but should NOT be wider than 1600px as some people had problems with images wider that that.

4) Choose your portfolio category

  • Goto “Appearance/Theme Options”
  • Scroll down to the “Portfolio Page” section
  • Choose “Portfolio” from the “Portfolio Category” dropdown

5) Hide your portfolio post from the main page (optional)

Whenever you publish a post, it will be shown in your blog home page. Even the ones that you choose to be in your portfolio. Most people want to prevent showing the same post in the portfolio AND the blog home page. If you’re one of them:

  • Goto “Appearance/Theme Options”
  • Scroll down to the “Home Page” section
  • Tick “Exclude Portfolio Category from main loop” at the “Exclude Portfolio” option

6) Add the portfolio to your menu

Now this is the last step: We have to show the world where to find your portfolio:

  • Goto “Appearance/Menu”
  • Scroll down to the dedicated “Pages” box (not Category)
  • Tick “Portfolio” and add them to the menu
  • The new entry will appear in the “Menue” box
  • Inside the box you can drag & drop the entry to its place
  • Click the “Save Menue” button!

You are finished setting up the portfolio.  After a reload you will see a new entry in the navigation bar named “Portfolio”. Clicking on it you will find the portfolio page we added.

I added a continuative tutorial to show you how to add more categories to your portfolio.

I hope you like the tutorial and it was helpful for you.

Cheers,
Alexander

  1. richardblockirichardblocki11-14-2012

    Thank you for your insights. Great tutorial.
    I’m building my website and want it to look like Pinterest. How do I create the multi-column front page post format?
    In addition, I’ve inserted a tagline, however it does not appear. Any insight?
    Thank you.

    • AlexanderAlexander11-14-2012

      First of all the Pinboard theme is quite different designed than Pinterest. And many key functions, like the comments below the post are implemented in a different way. What looks closest to Pinterese is the 4-column grid, which you can try in the layout of the theme functions. In case you want to hide the featured posts you can set the „Full Posts To Display“ to 0 in “Apperarance/Theme Options”.

      The tagline problem need definitly more details.

  2. AlexanderAlexander12-28-2012

    I’m no longer with the Pinboard theme.

    The tutorials are still accessible but no longer supported.

    /closed