Creating A Killer Online Portfolio Website Using WordPress

Posted on September 26, 2014 by in Tips & Tricks | 25 comments

Creating A Killer Online Portfolio Website Using WordPress

If you’ve ever looked for a job in a creative field, you’ve likely seen those job ads. You know the ones that ask for your resume and your portfolio? As if a resume weren’t bad enough, right? Throw a portfolio into the mix and it’s enough to send creative types running for the hills. Organization! Structure! The horror!

Despite a seeming reluctance to adopt a portfolio structure for your website, it’s the established method of presenting your best work to potential clients. There’s just no getting around it. Basically, if you want to get a gig (or at least dramatically improve your odds of getting a gig) you need to put some time and effort into how you present yourself online. Namely, you need to think about your portfolio.

Who Needs a Portfolio?

Oh, I don’t know. Maybe everybody? Okay, enough with my sass. The truth of the matter is anyone who creates things for a living can make use of a portfolio. I’m talking web designers and developers, here. Writers and artists. Architects and engineers. Musicians and dancers. Anyone, anywhere who makes things for a living needs to have a digital space to represent their work. How else do you expect to attract attention for what you do? How else can you keep your work organized, current, and ready for display?

Defining Your Portfolio’s Purpose

One of the most important things you can do before setting out to create a portfolio in WordPress is to figure out why you want one in the first place. That is, what do you want to accomplish with it?

According to Smashing Magazine, there are four common portfolio goals. Once you figure out which you’re trying to accomplish, the better your chances are of creating something that actually achieves it. These common goals include:

  • Trying to get a job
  • Sales/lead generation
  • Reputation/brand building
  • Networking/building a community

Rest assured, it’s totally okay (and normal) if you decide to try to accomplish more than one of these goals with your portfolio.

What All Good Portfolio Websites Have in Common

Image by Dooder / shutterstock.com

Image by Dooder / shutterstock.com

Portfolio websites can be a godsend in terms of landing new jobs and attracting the attention of potential clients. Of course, you need to make sure it’s working hard for you if you ever hope to experience such benefits. A good way to ensure your portfolio is up to snuff is to model it after existing portfolios out there. Whether it’s built on WordPress or not, the very best portfolios all share some key characteristics:

  • It showcases your work. This should probably go without saying, but the best portfolio websites out there actively show off your work in such a way that builds interest in you and your services. You’d be surprised by how many portfolios actually fail to complete this step. Not because people forget to upload work examples, mind you. Rather, this happens because the portfolio owner chooses a layout, navigation method, or other detail that distracts from the work to be viewed. Your work should do all the talking—the website is just there as a frame for it.
  • It’s focused. There’s no need to include every single piece of work you’ve ever completed in your portfolio. Unless you’re just starting out, you can and should be selective in what you include in this space. It’s supposed to be the best representation of you and your work, so make sure every piece you include serves a purpose and carries its own weight.
  • It’s targeted. This goes right along with being “focused,” I know but I’m referring more to targeting your intended audience here rather than just keeping your portfolio contents streamlined. Knowing the goal you want to accomplish with your portfolio can be helpful here as well. For instance, if you’re looking to use your portfolio to get a job designing medical websites, then your samples should obviously reflect this niche.
  • Straightforward navigation. Another key component the best portfolios out there share is intuitive and easy-to-use navigation. Whatever you do, do not make potential clients work to find what they’re looking for on your site. Use standard navigation and menus here. Now is not the time to get artsy. As tempting as it may be to use the portfolio itself as an example of your artistic flair, it’s much better to use it as a frame from within to showcase your best pieces. Just like you would in an art gallery!
  • Request a quote. The best portfolios include some kind of contact information on them. How else do you expect to land a new client? If somebody has to poke around your site for a long time to find an email address or contact form, you’re not doing yourself any favors, let’s be honest here. Create a dedicated contact page that displays all of your relevant details, including your social media links. A contact form where people can leave details about their project needs might also be relevant, depending on your specific industry.

The details of your portfolio might vary a bit but these qualities are typically pretty standard.

Now, let’s move on to discussing how you can actually build an awesome portfolio website using WordPress.

WordPress Portfolio Plugins

One of the simplest ways to incorporate a portfolio into your WordPress site is to use a plugin, of course. This is a good option if you’re really committed to keeping your current theme. If you don’t want to change up your design at this moment but still need to add a professional portfolio that looks like it was always meant to be there, these plugins ought to prove helpful as you get you started in your research:

Awesome Filterable Portfolio

Awesome Filterable Portfolio

The Awesome Filterable Portfolio plugin certainly lives up to its name. It works by letting you create a portfolio or gallery that can be filtered based on criteria you set. It uses image hover effects and animations to create an attractive interface. Set as many categories as you want and include as many items as you want. It’s simple, straightforward, and definitely awesome.

Portfolio

Portfolio

The aptly named Portfolio plugin is another option for putting your work on display. Once installed, you can create a dedicated page for your portfolio. You can include project details along with each item as well like a short and long description, URL, screenshots, and a date of completion. You can also change image sizes and the number of images displayed in each row as well as enable or disable the display of additional fields.

WordPress Portfolio Plugin

WordPress Portfolio Plugin

So some of these plugins aren’t getting brownie points for name creativity here but that doesn’t mean they’re not feature-rich. The WordPress Portfolio Plugin is highly useful, letting you automatically populate a portfolio page using thumbnails. Just insert the short code [wp-portfolio] wherever you’d like it to appear and voila! This is a perfect solution for web designers, as it can create thumbnails of the websites you’ve worked on automatically. Full customization through HTML and CSS is available as is the ability to use a custom image rather than the thumbnail.

WordPress Picture / Portfolio / Media Gallery

Nimble Portfolio

The Nimble Portfolio plugin is highly versatile and can be used to display your images, videos, and other media for gallery or portfolio purposes. It can easily be customized to display photography, logos, screenshots, videos, or anything else related to your work. It includes jQuery sort filters for easy grouping and categorization. It also comes with the PrettyPhoto lightbox, is responsive, and establishes a custom post type for your portfolio items. PDF preview is available. It also comes with three different styles of thumbnail for better integration with your existing theme.

Waving Portfolio

Waving Portfolio

The Waving Portfolio plugin creates a simple interface that still manages to be quite aesthetically pleasing. Once installed, you can quickly set it up to display your best work over the long term in a portfolio grid. To do this, just navigate to the Portfolio menu in the dashboard and add some posts, each with a featured image. Once you set up your portfolio page, these posts will be pulled into the grid and displayed in an attractive manner.

Auto Grid Responsive Gallery

Auto Grid Responsive Gallery

Create a portfolio with just one click. Auto Grid Responsive Gallery is a premium plugin that works by scanning an image folder in your WordPress installation and uses any subfolders contained within to define categories for your portfolio. A responsive, grid style gallery is then created automatically based on this information. The only setup requires putting the images you want to appear in the portfolio in the designated folder. Then, just use the shortcode [autoGrid] to display your portfolio in any post or page. This plugin will cost you $16 but its flexibility might be worth the price tag to you.

Go – Responsive Portfolio for WP

Go Responsive Portfolio

The last plugin I’m featuring here is called Go – Responsive Portfolio for WP and it really lives up to its $22 price tag. It’s simply loaded with features. For starters, you can use custom post types to create new portfolio entries or use existing blog posts (or even product pages) to populate it. You can insert it on other pages and posts to display post teasers, product showcases, and more. And it works with WooCommerce, too.

Integrating Your Portfolio Community Profile

Sometimes the task of building a portfolio on your WordPress site is daunting because you already have one on a portfolio community site. And if you’ve built up a good following there, it can feel like all of that hard work you put into the community-building aspect will go to waste.

Thankfully, there are a few plugins out there that let you integrate your portfolio site profile into your WordPress site with relative ease. Not all of these will allow you to create dedicated portfolio pages but they do at least give you the opportunity to make a connection to the community site profile.

Behance Portfolio for WordPress

Behance Portfolio for WordPress

If you already have a portfolio built on Behance, then you might just want to import it directly into your WordPress site instead of dealing with two separate entities all the time. That’s where Behance Portfolio for WordPress comes in handy. This plugin is easy to set up and only costs $15.

deviantART Widget

deviantART Widget

Have a presence on deviantART already established? Then you might be able to make use of the deviantART Widget. It’ll set you back $9 but with it you can insert your latest gallery or favorites in a widget on your site. This won’t make for the most robust portfolio, of course, but it is a good way to at least integrate your deviantART presence onto your WordPress site without having to manually bring the content over.

Awesome Flickr Gallery

Awesome Flickr Gallery

The Awesome Flickr Gallery plugin makes it simple to add any portfolio you’ve established on Flickr onto your WordPress site. You can use photos from your Flickr Photostream, Gallery, Group, or Photoset. You can even build a gallery based off of tags. Crop images, set image sizes, and use custom CSS if you want. Not too shabby for a free plugin, I’ve got to say.

WordPress Portfolio Themes

A quick way to get a portfolio set up is to just use a theme dedicated to its creation. Portfolio themes come in a wide variety of styles. Some are free and some are premium. I highly suggest you look through several options before making a decision, especially if you plan on shelling out cash. A theme purchase is an investment. Make it a good one!

Folio Black

Folio Black

Folio Black by Authentic Themes is truly stunning. And the best part of it is how simple the presentation is. No fancy stuff here at all. Just straightforward design that serves to lift up the pieces to be featured in the portfolio. That’s it. Features include a gallery slider, various shortcodes, robust theme options, and the ability to set the whole thing to full-width.

Divi

Divi

Our very own Divi theme is designed to serve a variety of functions, one of which is to act as a portfolio. Using the Divi Builder, you can create any kind of site you want from a simple blog to a robust portfolio. Here’s an example of a portfolio layout. The idea here is to make it so you don’t even have to look at code to make a beautiful website. Beyond the portfolio layout, Divi comes with 18 layouts total that you can then build on top of to create a custom site. Each layout is responsive and can be customized using Divi modules. The sky’s the limit here, folks.

Lilith

Lilith

The Lilith theme by Bluxart is a true visual feast. It’s responsive, flat, and looks super creative. Though it can be used for an agency or blog site, it’s also completely perfect for a portfolio. Select from grid, masonry, striped, or wall layouts to best suit your purposes. This theme includes a page builder, theme options, Revolution slider, and plenty of short codes to streamline development. Lilith is built on Boostrap 3.0 and includes WooCommerce and WPML Multi Language Plugin support.

Akin

Akin

Akin by Bitfade is a minimalist theme that includes a parallax header and Ajax portfolio so you can build a stylish site that best highlights your past work and services. The typography is stylish, the layout simple. And you can use the built-in page builder to achieve precisely the look you want. Akin will cost you $43 but the smooth hover effects and one page simplicity might just be enough to win you over.

Origin

Origin

Another Elegant Themes selection, Origin was designed with portfolios in mind. And call me biased, but I think it’s pretty beautiful. Sporting a grid layout, this theme lets you put your best work on display in a big way. It’s responsive and super customizable. Included page templates let you build feature-rich pages without having to dig into code. Beyond a portfolio, you can also build a contact page, a gallery, a blog feed, a sitemap, and more.

Wrapping Up

If you’ve ever thought the barrier to building a portfolio on WordPress was too high, I hope after reading this article you’re changing your tune. WordPress makes it so easy to build a portfolio, it’s not even funny. And I’m not just talking about cobbling together some rinky-dink layout, either. I’m talking a full-featured, aesthetically pleasing experience that works hard to sell potential clients on your work and on your services.

From defining your goals to selecting from plugin and theme-based solutions, you should now have a thorough understanding of how to build a portfolio that’ll serve you and your business well. But now I’m curious: did I miss anything? Is there a plugin or theme that you just can’t live without? Please share your ideas in the comments below!

Article thumbnail image by vasabii / shutterstock.com

25 Comments

  1. I just discovered Go Portfolio (included in your list) and found that it not only allows for filters, but videos can be played in a lightbox without leaving the portfolio page you can also include a link to each video’s page, where a text description and other information can be provided).

    Do any of the other filterable options you mention include a “play in lightbox” option for videos, perhaps also including the option to add a text description under the video?

  2. I recently finished a portfolio website for master sculptor Lena Toritch. I used the Divi theme and a couple of my own custom plugins. I find the challenge with creating portfolio website is that my clients have few good photos to work with. I end up working around best images available or taking new photos when possible. I found the Divi theme enjoyable to work with, and its built in features really helped show off my clients work. Please see Lena’s portfolio at http://lenatoritch.com

  3. Thanks for the education Brenda, sincerely, Divi is acting like a James Bond theme in wide wide west! I love every part of her and I need EXTRA 🙂

    Nick, please make Extra to be compatible with buddypress.

    Cheers

  4. I LOVE Divi so much I switched my own website design theme in May, and since then my quote enquiries have resulted in a 100% conversion to client!

    http://wickedwebsitedesigners.com

    The amazing team at Elegant Themes make it too easy to create stunning websites, I’m on to my 7th client site using Divi;)

    Can’t wait for the Monarch social sharing plugin too!!

  5. Randy A. Brown

    This is perfect timing Brenda! I just started a freelance writing business and I’m building my portfolio. I had no idea that it could get this complex. Thanks for another awesome post!

    Randy

  6. Hello,

    Very interesting read. As a photographer I find there is a huge hole in the wordpress community for descent portfolio plugins. Especially for displaying portfolio items in a custom order – as photographers like to do with their work.

    I’ve managed to get around this by using NextGen Gallery combined with my own custom CSS to create a descent sortable gallery, and place them in ET tabs, which gives users the ability to navigate through portfolio categories without leaving the page.

    You can view my travel photography portfolio here:
    http://explosiveaperture.com/portfolio

    • Nice solution Clint, that looks and works great! And your photos are even more impressive 😉

      • Thanks Amy, very much appreciated your kind words 🙂

  7. Thanks for share a valuable information of portfolio plugins. Before a one month ago I search many plugins for filterable portfolio ( in shortcodes), but didn’t find any genuine plugin that work fine in latest WordPress version.

  8. Pretty long post with great information. Learning more about portfolio is good.

  9. Wow,this is awesome.You provides such a beautiful pieces of designs.

  10. having completed profile and portfolio sites for client I wanted to pass on some insights I have gained. The major one to remember is that the people looking at your client’s site are recruiters and they generally do not want to spend more time than they need to in reviewing a potential candidate. This means as a designer you have to make sure the navigation is quick and simple and they can get to the information they want easily. I have found that the Divi theme works very well by creating a one page site with a sidebar navigation linked to the different sections. Use the Divi portfolio module so they quikcky filter and can click through to the projects which you will have created on separate pages..

    btw keep up the good work … I love the blogs..

  11. Dear Brenda
    I always read your posts. They are clear and helpful, and I would like to thank you for your shared insights.
    I have two problems. I’m a DIVI fan. Therefore I followed your suggestion to use DIVI to create a good portfolio. Your link http://elegantthemes.com/preview/Divi/centered-logo-dark/ display a beautiful layout, but I’m not able to find this layout within the DIVI templates. Could you or someone else give me advise.
    The second problem appeared with Auto Grid Responsive Gallery. It leads to Envato which is absolutely confusing.
    With my best regards
    Jon

    • Jon, with respect to the Logo – dark site… I suspect this is just a matter of using the fullwidth section – portfolio ..but I havent tested it yet..will look at this tomorrow.. I agree though .. Looks cool

  12. I had tried a bunch of free plugins and editing my own portfolio. The Go Portfolio is exactly what I wanted. Should have come here first! Thanks!

  13. Great write up! “The truth of the matter is anyone who creates things for a living can make use of a portfolio. I’m talking web designers and developers, here. Writers and artists. Architects and engineers. Musicians and dancers. Anyone, anywhere who makes things for a living needs to have a digital space to represent their work.”

    I couldn’t agree more!! It amazes me that so many people undermine the power of e-portfolios. Personally, I’ve found great success in using Portfolium.
    (https://portfolium.com) It allows you to visually showcase your work in an organized and beautiful way. I brought it into my last job interview using my iPad. The interviewers (aka my current employers) were very impressed!

  14. Jon, with respect to the Logo – dark site… I suspect this is just a matter of using the fullwidth section – portfolio ..but I havent tested it yet..will look at this tomorrow.. I agree though .. Looks cool

  15. Anyone knows divi can combine with behance api ? I want to use divi theme to showcase my portfolio, it takes time if I have to repost my portfolio on behance to my own site. I saw on codecanyon, someone sell plugin behance for wordpress. is it support with divi theme if I buy that plugin. I don’t want to restyle again. because I am not expert for HTML and CSS.

  16. Hi!
    I am totally new in the field of building a website, basically never made one..! Have been reading up on a lot of theme reviews and trying to understand if this is a task I can venture into. My my blog reviews sustainable products, and I have shortlisted some themes, where Divi is #1. One thing I´ve found out is how relatively “easy” Divi is compared to other themes, and was wondering if Ajax media portfolio plugin can be used with the Divi theme? Crossing my finger that someone in this thread understand this far better than me and can enlighten me on this issue:-)

  17. Thank you so much for this post: I’ve been searching high and low for this information!

  18. Divi is the most powerful theme I have eve seen. Thanks to eleganttheme for giving us that type of work.

  19. I am transitioning over to Divi from Optimize Press, absolutely loving the new plugin that allows the page builder to be used on other themes

  20. Can anyone help me to find masonry Portfolio plugin for divi theme…

  21. Yes…absolutely very wonderful details for a startup who wants to launch their portfolio website. I personally like Divi which is best option for quick SEO friendly portfolio’s. Thanks a lot…

401,632 Customers Are Already Building Amazing Websites With Divi. Join The Most Empowered WordPress Community On The Web

We offer a 30 Day Money Back Guarantee, so joining is Risk-Free!

Sign Up Today

Pin It on Pinterest