The Project Widget allows you to add, style, and control images anywhere on your Elementor-powered pThe Project Widget allows you to add, style, and manage project showcases anywhere on your Elementor-powered page. It’s ideal for displaying project details like titles, images, and categories with customizable styling options and responsive settings.
Whether you’re designing a portfolio, service page, team section, or case study showcase, the Project Widget makes it easy to present projects with precision and style.
Key Features:
Add up to three responsive project items
Choose from multiple layout styles
Control visibility for different devices
Customize box styling, spacing, border, and shadows
Fully responsive and optimized
🚀 How to Enable the Project Widget
To start using the Project Widget, follow these steps:
The widget is now available in the Elementor editor.
Navigate to your WordPress dashboard.
Go to Topper Pack → Widgets.
Locate the Project widget from the list.
Toggle the switch to “On” to enable it.
🧩 How to Use the Project Widget in Elementor
Step 1: Add the Widget to Your Page
Open your desired page using Elementor Editor.
Search for “Project” in the Elementor widget panel.
Drag and drop the Project TP widget onto your page canvas.
🔄 Tip: It includes the TP badge, which means it’s from the Topper Pack.
Step 2: Select Project Style
After inserting the widget, scroll to the Style → Styles panel.
Choose a layout style from the predefined style library. This controls how your projects are visually arranged and displayed.
Step 3: Upload and Configure Projects
Under the Style → Project section:
Use the Enable Project toggle to activate each project slot (Project One, Two, Three).
Set visibility settings:
Use the Project Visibility dropdown to control where the project appears (Desktop, Tablet, Mobile).
Adjust the Gap and Direction (left/right alignment) for spacing and layout flow.
Add project titles and categories under the Content → Project Details section.
Step 4: Style the Project Box
Go to the Style → Box section:
Choose Box Direction (row, column).
Set Alignment, Gap, and Background Type.
Adjust Border Type, Border Radius, and add Box Shadow.
Manage Margin and Padding for each side (top, bottom, left, right).
✅ Final Preview and Save
Once your project settings and style options are applied:
Project
The Project Widget allows you to add, style, and control images anywhere on your Elementor-powered pThe Project Widget allows you to add, style, and manage project showcases anywhere on your Elementor-powered page. It’s ideal for displaying project details like titles, images, and categories with customizable styling options and responsive settings.
Whether you’re designing a portfolio, service page, team section, or case study showcase, the Project Widget makes it easy to present projects with precision and style.
Key Features:
🚀 How to Enable the Project Widget
To start using the Project Widget, follow these steps:
The widget is now available in the Elementor editor.
Navigate to your WordPress dashboard.
Go to Topper Pack → Widgets.
Locate the Project widget from the list.
Toggle the switch to “On” to enable it.
🧩 How to Use the Project Widget in Elementor
Step 1: Add the Widget to Your Page
Step 2: Select Project Style
Step 3: Upload and Configure Projects
Step 4: Style the Project Box
✅ Final Preview and Save
Once your project settings and style options are applied: