The Graphic Designer’s Complete Guide to Building a Portfolio on WordPress.com

I’ve been a self-taught graphic design freelancer since 2005 and started an agency in January 2015. In the early days, my portfolio was mostly everywhere.

Sometimes I use Behance to show my branding projects, maybe a PDF kit for clients, a DropBox folder of screenshots and a Google Drive of image files that I intended to turn them into case studies.

Those days, I wasn’t as techie as I am right now, if I were to go back in time, I would put everything together in WordPress.com without doubt. I don’t have to grapple with hosting and any developer kind of tasks to just show my work.

If this is you, that’s why we are here today. In this guide, I will show you how I’m building my portfolio on WordPress.com.

Signing Up and First Impressions

First of all, I’m assuming you’ve got all your past work in a folder you’ve full access and with full permission to put them out in public. The next step is to sign up for WordPress.com.

The signup process is like any app.

Go to WordPress.com, select the Get Started button on the top right hand corner of the homepage. Enter your email and click the Continue button to create an account.

You will be redirected to a page to “Claim your space on the web”. In the box, enter your company name or any name that will be representing your graphic design business. This will be included in your domain name. For example, for me, I may type “marilyn”, so my free WordPress url or full domain name will be marilyn.wordpress.com.

Once you’ve typed it in, click “Search domains”.

You will be brought to purchase a custom domain right away. I’d say if you are doing this to create work for clients and you don’t have a custom domain yet, you should purchase one like www.yourcompany.com.

It’s not expensive and it is professional. That said, if you are doing some shopping and not sure which platform to use, by all means test it first before making any paid commitment.

You don’t have to pay for anything to be able to build your portfolio site on WordPress.com. Only when you hit certain limitations and need more functions to move on, that’s when investing on it is worth it.

Let’s bring this on a test drive and go for the free version first. Go to the box that says “Start free with yourdomain.wordpress.com” and click the “Start Free” button.

When I got to the pricing plan page, I got a bit confused as to why I have to pick a payment plan, fret not, on the far left, you can go with the free version by clicking on “Start with Free” in the pricing table.

Choosing a Theme That Works for Visual Work

You will be taken to a page that shows a well-designed site. That’s a theme selected for you, but it’s a paid theme. At this point, I’m using the free version, so click “Back” on the top left hand corner.

You will be taken to a page with themes you can choose.

In the TYPE section, select “Portfolio” and “Free” to filter the categories. If you see other buttons in solid blue color, click on them to deselect them.

If you are in the free version, there are not many themes to choose from, but you can make adjustments. Look for something that is as minimal as possible so that your portfolio can shine. You don’t want elements of the website to overpower your work.

I selected “Arbutus”. I find that the style and layout matches my portfolio, and it looks easy for me to adjust.

I’m not just looking at the colors, more of how naturally the eye follows how the fingers will just scroll down, especially on mobile.

My thought process is that I want to spend less time working on the layout adjustments, more on getting the portfolio site public and launching to my ideal clients.

Pick your favorite “Style Variation” and click “Activate”.

Building the Core Pages

The structure of my portfolio site is not just a set of portfolios. I’d like to have several core pages to organize all content in the right places. In this section, I will show you how to set up the About, Contact and Home pages.

Your About Page

First, add a new page to your site by going to the left side menu. Under the section “Pages”, select “Add Page”.

Type in your title “About Me”.

Then click the + button on the top left hand corner to open up the side menu.

Under the “Block” tab, look for “Media & Text”. With this, you don’t have to figure out how to place your image and text side by side on desktop view.

Now the step is to add in your story on the right and your photo on the left.

To add your story, just click your cursor in the text box, delete the sample text and type in your own text.

To add your image, click the “Upload” button, and select your image from your computer. Or, select “Open Media Library” if you already have your images uploaded to your WordPress Media Library. Select your image from there.

Hit the “Save” button if you wish to, otherwise, WordPress.com auto saves as long as an edit is made.

For the purpose of this guide, I’m hitting the “Publish” button so that all the pages will be live and I can link them up together.

You’d want your prospects to visit your portfolio page, so below the text area, hover your cursor over it and a “+” button will appear. Click on that. Select “Buttons” in the dropdown section.

A button will appear, type in “Visit my portfolio”. Leave that to add your portfolio page url link later.

In your About page, you’d want to add some visuals to show a preview of your work. The next thing is to click on the “Block Inserter”, the “+” button on the top left of the edit page.

Select the “Patterns” tab, go to “About”, and select “About 5” pattern. You can drag and drop to the space under your photo and “Visit my portfolio” button, or you can just click on it and it will appear on the right side.

You will see a sample header, sample text and placeholder for images. Simply replace them to your own content.

Then, I want to add a call to action section below this portfolio preview. Click the “+” button on the top left, select the “Patterns” tab, then click “About” and select the “About 8” pattern.

It will appear on the left side below your portfolio preview section.

I’d change the button to “Contact Me” and you can customize the header and text to engage your prospects.

Contact Page

Next, go to the menu on the left, select “Add Page”. In the new empty editor, change the title to “Contact”. We are going to add a contact form for people to reach out to us.

Select the “Block Inserter” and click on the “Patterns” tab.

Select “Contact” and click on the “Contact 1” pattern.

That block will appear on your editor.

Next, customize your “Contact” page text.

One that’s done, you may also want to add your location with a map image of where you are.

Go to the “Patterns” section again, select “Contact” and click on “Map 3”.

Have this block below the “Send” button. If it appears above the contact form, click on the block and drag it below the contact form block.

Edit the contact details and the map image to yours.

Hit the “Publish” button on the top right to have it go live.

Home Page

Now, it’s time to build the home page which is the front of your portfolio site. This is where you put in your Unique Value Proposition, the main gap you are providing help with and speak to your audience in less than 3 seconds.

Go to the left side of the dashboard, select “Page” and click on “Add Page”. Here, put in the title of your home page. You can use “Home”.

Then, click on “Block Inserter”, and select the “Patterns” tab, select “Hero” and select the pattern named “Hero 1”.

Replace the placeholder image with yours and customize the text on the left to your own, in the simplest and fewest words possible to explain how you help your prospects. There’s a button below where you can add the call-to-action leading people to your contact page or portfolio page.

Creating Project Page

I’m now going to show you how I create a page with my best work in WordPress.com. Do get ready the your work in image and/or video format and have them in a folder to be uploaded to WordPress.

As before, go to the left side menu, go to “Page” and click on “Add Page”. I title this page “Portfolio”.

I’ll first create a header on the page by clicking the “+” on the editor and select the block “H1” or “Heading”. Add your title in the text box such as “Check Out My Portfolio”. Then align the text to be centered.

Next, click on “+” and select the “Paragraph” block. Here, type in your description.