Creating A Portfolio in WordPress

Guide and tutorial to learn how to build a gallery on your WordPress for free, with all steps for creating a portfolio on your site

Updated on April 11, 2024
Creating A Portfolio in WordPress

In this guide and tutorial, you’ll learn how to build a gallery on your WordPress for free, with all steps for creating a portfolio on your site.

Creating A Portfolio In WordPress Sites Using Our Visualmodo Themes

In this tutorial on the Visualmodo knowledge base, we will show how to create a portfolio in WordPress. With a page builder element simply and easily with our WordPress themes, place it on the page to show your users your latest works/projects/photos.

Before creating a portfolio on the WordPress site, navigate to Wp Dashboard > Visualmodo > Theme options > Post Types > and build your portfolio post type, as shown in the attached image below. Several post types (set it as 1 or more according to your site style), the name, slug, plural name, and save the changes. After that, refresh the page to load the new WordPress dashboard ‘Projects’ area.

Firstly, it is time to create your portfolio posts. You can write them up just like your design your pages (using the page builder elements to design any layout you like) or blog posts, and do not forget to add a featured image on each post before saving.

NOTE: you can edit the portfolio body content area using the visual composer page builder just like you did for your WordPress site pages using the elements. Please look here to enable the visual composer page builder on this portfolio/projects editor post type.

If you want to add a portfolio posts filter on the page, you’ll show these posts. You need to create ‘categories’ and apply these categories for the portfolio posts (just like you did on your blog posts for example) on how to build a gallery in WordPress.

How to call/add these portfolio posts to my pages?

After all, you must ensure you have the Visual Elements (Borderless) Plugin activated on your WordPress site. The Visual Elements plugin is a Visualmodo WordPress Plugin that all our clients gain for free.

This plugin will add more elements to your Visual Composer Page builder element (As soon as you activate the Visualmodo theme on your site, you will receive a notification on your WordPress dashboard asking you to click and install this plugin).

To use a portfolio element, log in on your WordPress dashboard and go to your ‘Pages’ area. In this area, find the page where you want to apply this portfolio element and click the ‘edit’ button. In the editor window, you will need to click on Page Builder, and on ‘Add Element’ in a page builder, select the ‘Portfolio’ element, like this one on the attached photo below:

Using Visualmodo Borderless WordPress Plugin
Call Portfolio Posts Using WPBakery Page Builder WordPress Plugin Posts Grid Element
Call Portfolio Posts Using Elementor Website Builder WordPress Plugin

Customization of the portfolio element in WordPress

Secondly, when you select the ‘Portfolio’ element, a window will open so you can choose your portfolio layout. You will be able to apply animation for this element. Select the columns layout. In addition, the portfolio items’ style.

Remove space between portfolio items. Remove the link to the single portfolio item. (NOTE: if you want your site users to click on an image, it’s open a lightbox.

With only the image and title. It would help if you marked the option for removing the link for a single portfolio item. Your user will be redirected to the portfolio post page if you don’t keep it. When clicking on the portfolio item on a page).

The display mode, if you want the filter or not, a title or the filter, the number of the posts, and the order. In conclusion, after you finish your customizations, click the ‘Save’ button to apply it on a page.

Creating a full-width portfolio in WordPress

Finally, in case you want to create a portfolio area with a full-width layout. (getting all the screen sizes) like on this page of our Sport WP Theme demo. You must follow this video tutorial to make your portfolio page builder section (where the portfolio elements are located) a full-width section (Stretch row and content).

Creating A Portfolio In WordPress Sites Using Our Themes by Visualmodo. I hope this guide and tutorial help you how to build a gallery on your WordPress for free, with all steps for creating a portfolio on your site.

Can’t find what you’re looking for?

Contact Support