Want to showcase your top blog posts or highlight content that matters most? The HappyAddons Featured Post widget for Elementor makes this easy. Whether you’re promoting new posts or guiding users to must-read content, this widget gives you full control over layout, design, and functionality.
Here’s how to set it up — no coding needed.
What You Need Before You Begin
Make sure you’ve installed and activated the following:
- Elementor (Free or Pro)
- HappyAddons
- HappyAddons Pro
Once that’s done, you’re ready to go.
Step 1: Add the Featured Post Widget
- Open your WordPress dashboard.
- Go to the page you want to edit and click “Edit with Elementor.”
- In the Elementor panel, search for “Featured Post.”
- Drag and drop the widget into your desired section.
That’s it — now the fun part begins.
Step 2: Choose a Layout That Works
The widget offers three built-in skins:
- Classic
- Standard
- Outbox
Each skin displays a featured image with the post content below it. Use the “Featured Image” toggle to turn the image on or off. You can also set custom image resolutions for full control over the layout.
Step 3: Add a Badge to Catch Attention
Want to label a post as “New” or “Hot”? You’ve got two options:
- Badge Taxonomy – Pulls the badge from your post’s category, tag, or product label.
- Custom Badge – Type in any word you want (e.g., “New”) to display it on the post.
You can style the badge’s position, colors, borders, and typography under the Style > Badge tab.
Step 4: Control the Title and Metadata
You can choose how the post title looks:
- Set an HTML tag like H3 or H4 for SEO structure.
- Enable meta elements like Author, Date, and Comments.
- Add icons next to each meta item.
- Customize the separator (e.g., dot, slash, or pipe).
Step 5: Set the Excerpt and Read More Button
Want to show a preview of the post? Enter a number in the Excerpt Length field to control how many words appear.
You can also customize the “Read More” button:
- Change the label text
- Open the link in a new tab
- Hide it if you want a cleaner layout
Step 6: Filter Posts with Query Settings
This widget gives you full control over which posts appear.
- Post Type – Choose Posts, Pages, or any custom post type.
- Manual Selection – Search for and select specific posts you want to feature.
- Query ID – Add a custom ID if you want to use the same query across widgets or apply custom code filters.
Step 7: Customize the Style (Fully Responsive)
🔹 Item Box
- Add padding and margins
- Set a background (solid or gradient)
- Use box shadow and border radius for design depth
🔹 Image Styling
- Apply image overlay effects
- Set width, height, and position
- Customize normal and hover states
🔹 Content Styling
- Adjust padding inside the content box
- Control typography for titles and excerpts
- Style meta section with icons and spacing
🔹 Button Design
- Set padding, margin, border radius
- Customize text and background for normal and hover states
- Use gradient backgrounds and border colors for a branded look
Final Tips
- Keep your layout mobile-friendly using Elementor’s responsive controls.
- Make sure your title hierarchy follows SEO best practices (H2 for main sections, H3 for sub-sections).
- Use the manual post selection feature to curate high-converting content.
Conclusion
The HappyAddons Featured Post widget is a simple yet powerful tool for boosting content visibility and driving user engagement. Whether you’re building a blog, magazine layout, or custom homepage, this widget offers everything you need to feature your best posts with style.
