In this article, I will help you add a portfolio page to your website with the help of Elementor Page Builder. Also for this, you need to check to see if you have JetElements plugin installed. This is a multifunctional WordPress Elementor theme add-on which contains the very widget we will need today. If you’re all packed and ready, let’s proceed.
- Open Elementor and look for the Portfolio widget in the search field over on the left.
- Grab it and drop it on a new section.
- It will give you a basic layout consisting of six sections.
- On the left, you will see Content Settings. Here you have a number of options for the layout: masonry, grid, justify, and list.
- Under this block of settings you will see the Items tab where you can add the images.
- The next step is customizing every single item in the Items tab.
- Here you can change images, titles, and descriptions as well as make every item clickable.
- Then you will be able to add links and activate two options: open the link in a new window and add nofollow.
- Also here, you have a category field where you can type in the name of the category that this portfolio will have.
- After naming this category, you will see a filter pop up at the top of your images. Please note, you can add several categories to one image. Just separate multiple categories with a comma.
- Now go back to the Settings tab.
- You will see the Preset option. It helps you choose the style preset that applies to your portfolio items. It can be seen once you hover over the item. This widget offers you four options – try each of the options and choose the one you like the most.
- Then you can proceed with the other fields of the block. Depending on the layout type you’ve chosen, there will appear different settings. For example, for masonry and grid you can set a certain number of columns, for justify you can set the item height, and for the list you won’t see any additional settings.
- The next step is the View More button. It is a feature that allows you to hide a number of items. If you have too many items and want to save some space on the page, you can set the value for the number of items per page.
- However, remember that it shouldn’t be fewer than the total number of items in your portfolio.
- In addition, you can change the name of the button.
- Now you can go to the Style section to style up your portfolio.
- In the first block, you can increase or decrease the item margin, set the border radius, the border type, and padding.
- Then move to the filters settings. They include different filters container settings and filters items styles.
- The latter option offers you to choose a separator icon and edit its parameters.
- Lower, you will see the style settings for the links themselves (color, typography, and so on).
- The next tab is called Content. It is all about the portfolio items.
- Here you can change various parameters of the container, image, title, description, button, and set their order. Also, there are settings for the category, including the option for showing the category list on the items.
- And the last tab of the Style section is your View More button. It allows you to customize its color, typography, and size.
Final Word
And that’s it – you’re done with the styling of your portfolio! Now you know how to add a portfolio and customize it with the help of JetElements plugin. Thank you for reading and I hope you enjoyed it!
Top 5 Elementor Themes
Read Also
How To Create And Shape Up Your Portfolio With Elementor Builder
JetElements: Build a Better Website With Our New Elementor Add-on
Elementor Tip: Pie Chart Circle Progress on WordPress with Elementor Page Builder