A portfolio is a set of pictures usually bound in book form or loose in a folder. The guideline below about the Portfolio List widget will get you to walk in the right way to use the widget developed by Element Pack.
Moreover, I’ll show you the way in different phases of how you can insert & use the widget to design layout for the content (text, image, and video, etc.) you want to work with and style as well.
To Insert Widget
Inserting widget, it is just a matter of drag and dropping. Before inserting the Elementor Portfolio List Widget, you’ve to make sure, you’ve activated 3rd party plugin ‘Portfolio’ and added items. As you see in the screenshot above.
Content Tab
Using the content tab, you’ll be able to make a layout of a particular part of a website. And in this regard, some handy sections in the tab will assist you a lot.
Layout
Here, you’ll find two controls Horizontal Layout and Pagination. If you, with the default vertical layout, want to get a Horizontal Layout, Just go to the Content Tab >Horizontal Layout.
After selecting the Horizontal Layout, you’ll be provided Columns controls. From there, you can set columns (two, three, four) and also you can set the Pagination for the Portfolio List Widget.
Query
This section works for setting the source location of data that you need to display by the reference like Author, Categories, Tags, and Formats. The references can be different in accordance with the source location. Read more
For example,
A. Go to Source ➤ next, select data location( Manual Selection)
B. Then, select categories from the Categories field.
C. After that, set the limit of the carousel items.
D. Order By control is here to arrange the data you want to display through Random, Title, Date, or Categorically
E. And you can also set the order with ascending or descending.
Additional
This section will allow you to manipulate Title, Title HTML Tag, Excerpt, Excerpt Limit, Show Category, etc.
Go to the Content Tab > Additional
Style Tab
It is time to work with Style Tab. The tab will confidently have you style the web content (text, image, video, etc.) of the page you want to design with the WordPress portfolio list.
Styling with the Style tab in Elementor will always give you a fantastic experience.
Let’s have a look.
Items
In this section, you’ll be allowed to set a gap between the column and the raw, border type and radius, alignment, background color, and padding. Take a look at the photo. Follow the Style Tab > Items> Content.
Thumbnail
From this section here, you’ll be able to set size, background-color, box-shadow, etc. of the thumbnail image. Most importantly, advanced radius of the Elementor Portfolio List Widget.
Go to the Style Tab > Thumnail
Title, Excerpt & Category
The sections mentioned in the title will allow you adding text color, spacing, typography to each element of the Title, Excerpt & Category.
Go to the Style Tab > Title > Excerpt > Category
Pagination
In the mode of Normal, Hover, and Active, the Pagination section will permit you to add text color, background type, offset, spacing, etc. Just check them all.
Go to the Style Tab > Pagination.
So far, in this article, you’ve known about how to use Portfolio List and what’s the work of the widget. To get more ideas, you can visit our demo page.
Video Tutorial
Watch this quick video on the Portfolio List Widget to get the whole idea with visuals.