help center

On this page

Portfolio widget

Last Update: January 14, 2024

The Portfolio Widget allows you to display your posts, pages, and custom post types in an attractive, filterable grid.

Note: The Portfolio widget ONLY works with posts, pages, and custom post types. The Portfolio widget does NOT work with Galleries.


Content

Layout

  1. Columns: Set the number of columns displayed in the widget
  2. Posts count: Set the exact amount of posts to be displayed in the widget
  3. Image Resolution: Set the size of the images
  4. Item ratio: Set the ratio of the items
  5. Show title: Choose whether to show or hide the title. The title will display while hovering over the images
  6. Title HTML tag: Wrap the title with a tag, either H1…H6, span, div or paragraph

Query

Source: Select the source from which the widget will display the content. Options include posts, pages, custom post types if available, manual selection, current query, and related. Depending upon which source you’ve chosen for the query, you’ll be given options which allow you to filter the results.

Include
  1. Include By: Term or Author, then use Search and Select to choose which ones to use
  2. Date: Select from All, Past Day, Past Week, Past Month, Past Quarter, Past Year, Custom (Choose Before or After dates) 
  3. Order By: Set the order in which the posts will be displayed. Options include: Date, Title, Menu Order, or Random
  4. Order: DESC (descending) or ASC (ascending)
  5. Ignore Sticky Posts: Yes or No
  6. Query ID: Give your Query a custom unique ID to allow server side filtering
Exclude
  1. Exclude By: Current Post, Manual Selection, Term, or Author, then use Search and Select for Manual,Term, or Author choices
  2. Avoid Duplicates: Yes or No – Choose Yes to avoid displaying duplicate posts on the frontend only. Elementor looks for duplicates at the page level (not at the widget level) given that there cannot be duplicates in a Posts widget.
  3. Offset: Use this setting to skip over posts (e.g. “2” to skip over 2 posts)
  4. Date: All, Past Day, Past Week, Past Month, Past Quarter, Past Year, Custom (Choose Before or After dates)
  5. Order By: Date, Title, Menu Order, or Random
  6. Order: DESC (descending) or ASC (ascending)
  7. Ignore Sticky Posts: Yes or No
  8. Query ID: Give your Query a custom unique ID to allow server side filtering by entering a value in the field or by using Dynamic Tags. See the developer docs for more information on how to use this advanced feature.

Filter Bar

  1. Show: Set whether to show or hide the filter bar above the portfolio
  2. Taxonomy: Choose the taxonomy from which to display the posts. Options include: Categories, Tags, and any custom post type taxonomies

Style

Items

  1. Item Gap: Set the exact gap between the items
  2. Rows Gap: Set the exact gap between rows of items
  3. Border Radius: Set the border radius for the images to control corner roundness

Item overlay

  1. Background Color: Set the background color of the overlay when you hover over the image
  2. Color: Set the post’s Title color. The title appears within the overlay when you hover over the image
  3. Typography: Customize the typography of the Title

Filter bar

  1. Color: Set the color of the Filter Bar text
  2. Active Color: Set the color for the Filter Bar’s active text
  3. Typography: Customize the typography of the Filter Bar text
  4. Space Between Items: Set the space between the items in the Filter Bar
  5. Filter Spacing: Set the spacing between the Filter Bar and the images

Advanced

Set the Advanced options that are applicable to this widget

Note: Featured images must be used in your posts for any images to show up in the Portfolio widget.

BmCR8jgJ86Wzi0GGk8NfhsOp78SPMvsApvzpjOknEymXoFgSK 5C0lfGEaTgGS XtTMOWmHgXkKoUyaMaGak6NEKsmYaoRhipbFJgd3UCAc8iQoeWsy 9xvj6mNt IlSOAd4spuz Portfolio widget 1

Have more questions? We’re more than happy to assist.

Link is copied to clipboard!
On this page

Is this article helpful?

Share this article