Topic
Design
17 articles on design.
All Design articles
-
Bricks mixed grid: Create a flexible boxed/stretched two-column layout
Make your featured images pop while keeping text content neatly boxed. This tutorial walks you through a flexible two-column mixed grid layo...
-
Elementor CSS grid: Create a flexible boxed/stretched two-column layout
Text contained in the boxed area, image stretching to the screen edge — a visually striking layout that’s easier to build in Elementor than...
-
Mastering split grid layout in Bricks builder
Split grid layouts bring a modern, dynamic feel to any site. This tutorial shows you exactly how to build them in Bricks Builder — one of th...
-
The easy way to create equal width columns in Elementor using Flexbox
Struggling to get equal-width columns in Elementor? This guide shows you a clean Flexbox approach using CSS variables — responsive by defaul...
-
Creating a breakout grid layout in Bricks builder
A hero section that stretches edge-to-edge while other content stays boxed gives pages a polished, full-bleed feel. Here’s how to build it c...
-
Advanced two-column grid: Boxed content & stretched image
Take the classic boxed/stretched two-column layout further with CSS Grid. This tutorial builds on the Flexbox approach to give you more layo...
-
Build a magazine-style loop grid in Elementor
Tired of cookie-cutter loop grids? This tutorial walks you through a magazine-style layout in Elementor that makes your content stand out fr...
-
Alternate loop template in Elementor that reverses per row
Build an Elementor loop grid where two templates alternate per row and reverse their order on each new row. More dynamic than it sounds — an...
-
Align footer to bottom of page
A footer floating mid-page is a frustratingly common WordPress issue. This quick tutorial fixes it with a minimal CSS snippet that works reg...
-
Two-column layout with split widths (70/30) in Elementor
An asymmetric 70/30 split gives your content breathing room while the second column stretches beyond the boxed area. Here’s how to build thi...
-
Create a slide-out social menu in Elementor
Add floating social icons to your Elementor site without a plugin. This tutorial builds a slide-out sidebar menu for both social links and s...
-
Enhance your Elementor search widget with custom SVG images
The default Font Awesome search icon isn’t always the right fit. This tutorial shows you how to swap it for your own custom SVG in the Eleme...
-
Align button to bottom in Elementor CTA widget
Getting the CTA button to sit at the bottom while text stays at the top trips up a lot of Elementor users. This tutorial shows you the clean...
-
How to create a two-column layout: boxed-width content and stretched image
Want text in the boxed content area and an image that bleeds to the screen edge? This tutorial builds the layout step by step in Elementor.
-
Build an Elementor Horizontal Accordion without extra addons
Elementor’s accordion is vertical by default, but with a few CSS tweaks you can flip it horizontal. No extra addons needed — this tutorial s...
-
Add a free tooltip to the elementor pricing table
Tooltips are a clean way to explain pricing features without cluttering your table. This tutorial shows you how to add them to Elementor’s P...
-
Elementor Gallery Custom Aspect Ratio (Easy Fix)
Elementor Pro’s Gallery Widget offers several aspect ratio presets — but not every one you might need. This tutorial shows you how to set a...
