Portfolio Category

Estimated reading: 3 minutes 153 views

The Portfolio Category widget allows you to display portfolio categories in a customizable grid or slider layout using Elementor. Each category can include an image, title, and optional description, helping visitors quickly navigate to different sections of your portfolio.

This widget is useful for organizing portfolio projects by category and presenting them visually with custom layouts, image styles, and optional slider functionality.

General Overview


The Portfolio Category widget helps you showcase portfolio categories with full control over:
  • Number of categories displayed
  • Included and excluded portfolio categories
  • Category grid layout and columns
  • Custom layout elements (image, title, description)
  • Category images and styling
  • Optional slider functionality
  • Slider navigation and autoplay behavior

Widget Controls


The widget settings are divided into several sections inside the Content tab in Elementor.

1. General Section

null
  • Extra Class: Add a custom CSS class for additional styling or advanced customization.

2. Query Section

null
  • Excerpt Length: Controls how many words are displayed in the portfolio excerpt.
  • Author: Filter portfolio items by selecting specific authors.
  • Categories: Select categories to include in the portfolio grid.
  • Exclude Categories: Select categories that should not appear in the portfolio grid.
  • Include Posts: Manually select specific portfolio posts to display.
  • Exclude Posts: Remove selected posts from the grid.
  • Order By: Sort portfolio items by ID, title, date, or other available options.
  • Order: Choose ascending or descending order.

3. Layout Section

null
  • Post Items: Drag-and-drop layout builder to enable or disable portfolio elements such as feature image, title, excerpt, read more button, categories, tags, and author.
  • Post Overlay Items Options: Enable or disable elements that appear in the overlay when hovering over an accordion item.
  • Post Overlay Items: Configure which elements appear inside the overlay.
  • Top Meta: Configure metadata displayed above the portfolio content such as categories, author, or date.
  • Bottom Meta: Configure metadata displayed below the portfolio content.
  • Post Heading Tag: Choose the HTML heading tag used for portfolio titles (H1–H6).

4. Image Section

null
  • Thumbnail: Choose the image size used for category images.

5. Slider Settings Section

null
  • Slide Option: Enable or disable slider functionality for displaying categories.
  • Slides Per View: Define how many slides are visible at once.
  • Slides Per View (Tablets): Define how many slides are visible on tablet devices.
  • Slides Per View (Mobile): Define how many slides are visible on mobile devices.
  • Space Between Slides: Set the spacing between slides.
  • Center Slides: Enable centered slide alignment.
  • Loop Slides: Enable continuous looping of slides.
  • Autoplay Slides: Enable automatic slide transitions.
  • Autoplay Speed: Define the delay between automatic slide transitions in milliseconds.
  • Enable Navigation Arrows: Show or hide slider navigation arrows.
  • Enable Pagination: Show or hide slider pagination dots.

Styling Options


All elements of the Portfolio Category widget can be customized using Elementor’s Style tab.
  • Category item background colors and hover effects
  • Typography and alignment for category titles
  • Description text styling
  • Image border radius, padding, and margins
  • Image shape styles such as squared, rounded, or circular
  • Slider navigation arrow styling
  • Pagination dot styling

Summary


The Portfolio Category widget provides an organized way to display portfolio categories and guide visitors to different sections of your work. It supports:
  • Dynamic portfolio category queries
  • Custom category layout elements
  • Flexible grid column layouts
  • Optional slider display
  • Slider navigation and autoplay controls
  • Complete styling customization through Elementor

This widget is ideal for creating category-based portfolio navigation, project directories, and visually organized portfolio homepages.

Leave a Reply

Your email address will not be published. Required fields are marked *

Share this Doc

Portfolio Category

Or copy link

CONTENTS