A drop-in replacement for a plain Elementor section or container that ships with its own design system baked in. On a normal page build, a section or container starts as an empty box — no border treatment, no considered spacing, no color story — and every one of those decisions has to be made and applied by hand before it reads as a finished design. The Advanced Section widget skips that blank-canvas stage entirely: pick a Design Preset and the section arrives already looking like a considered piece of a real website, not a generic container waiting to be styled.
Choosing a preset
Six presets are available — Default, Minimal, Glass, Gradient, Dark, and Magazine — and each one loads its own bundled CSS the moment it’s selected. This matters because it means the visual language isn’t something you’re building up control-by-control in the Style tab; it’s a coherent decision made once, at the top of the widget, that cascades through borders, spacing rhythm, background treatment, and typography weight all at once. Glass, for instance, applies a frosted, translucent panel treatment well suited to sitting over a photographic background; Dark inverts the whole color story for a section that needs to visually separate itself from a predominantly light page; Magazine leans into denser, editorial-style spacing more common in publishing layouts than typical marketing sites. Because each preset genuinely changes the visual identity rather than just tweaking a handful of colors, switching between them mid-build is a legitimate way to explore a page’s direction before committing to a final look.
Structuring the content
Beneath the preset choice, the Content & Layout section handles how the section’s inner columns are arranged — typically an image side paired with a content side, the single most common layout pattern across marketing and landing pages (a feature explained next to its screenshot, a testimonial next to a photo, a benefit next to an icon). The Order Settings section is a smaller but genuinely useful control: it lets you decide which inner element — the image, the heading, the body text, the buttons — actually appears first in the underlying markup, independent of where it visually sits. This matters for two real reasons. First, alternating image-left/image-right sections down a page reads better when each one’s markup order matches its visual order rather than being forced into an identical structure with just a mirrored layout. Second, and more importantly, screen readers and other assistive technology follow the document’s source order, not its visual order — so a section that’s visually image-then-text but structurally text-then-image can genuinely confuse a non-visual visitor’s experience of the page, and Order Settings exists specifically so you don’t have to choose between the visual layout you want and an accessible reading order.
Independent style control per region
Once the preset and structure are set, the widget breaks styling into four separate concerns rather than one monolithic style panel: a dedicated Image Column style section, a separate Content Column style section, a Text section covering the heading and body typography, a Buttons section, and a Divider style section for any decorative rule between sections. Each of these inherits sensible defaults from whichever preset you picked, but every single value remains fully overridable — so a team that likes 90% of the Glass preset but wants their own accent color on the buttons doesn’t need to abandon the preset and rebuild from scratch; they just override the one control that matters to them.
Use it for
This widget is the natural first choice for feature sections, split-content blocks pairing an image with copy, and any layout where the content is fundamentally a classic marketing pattern — a benefit explained next to a visual, a testimonial next to a portrait, a product highlight next to a screenshot. Reach for it before a plain Elementor section or container whenever the content fits that shape, since the alternative is manually recreating a comparable level of visual polish from an empty container using the Style tab’s raw controls, which takes considerably longer and rarely ends up as visually cohesive as a preset that was designed as one connected system.
Practical tips
- Preview all six presets against your actual content before committing — the same copy and image can read completely differently under Minimal versus Magazine, and it’s much faster to swap presets than to manually rebuild a section’s look from scratch after the fact.
- Use Order Settings deliberately on alternating sections down a page (image-left, then image-right, then image-left again) — it’s a small detail that makes a scrolling page feel considered rather than templated.
- If you’re building a page with a strong existing brand palette, start from Minimal or Default rather than Glass, Gradient, or Dark — the more opinionated presets carry stronger built-in color and texture choices that can fight with an established brand system rather than complement it.