The Contact Section 2026 widget is a full contact-page builder with five built-in design styles and three layout variants — section header, a connectable contact form (via your favorite form plugin), contact info cards, working hours, social links, a trust/response stat, and an embeddable map, all in one section. Works identically in Elementor and the WordPress block editor.
Overview
Instead of piecing together a contact page from a heading widget, a shortcode widget, and a Google Maps embed, Contact Section 2026 gives you one widget that ties everything together — a section header, a form panel that plugs into whichever form plugin you already use, a repeater of contact-info cards (address/phone/email/hours/website/custom), a working-hours mini card with an “Open now” badge, social link icons, a trust/response-time stat card, and a responsive map embed.
Every part of it is restyled instantly by switching the Design Style dropdown — no custom CSS required.
5 Design Styles
- Bento Grid — crisp white cards, sharp grid alignment, confident typography. The clean SaaS-product look.
- Glassmorphism — frosted-glass translucent panels over a dark, gradient-blurred backdrop. Premium fintech/crypto feel.
- Dark Minimal — near-black canvas, a single lime accent color, high contrast. Dev-tools/AI-native feel.
- Aurora — soft gradient-mesh backgrounds, rounded corners, warm color blends. Modern AI/tech branding feel.
- Neo-Brutalist — hard 2px borders, flat solid colors, offset drop-shadows, no gradients. Bold agency energy.
3 Layouts
- Split (Form + Info) — the contact form on one side, the info/hours/social/map/trust column on the other.
- Centered (Form only) — just the form, centered on the page, with the map (if enabled) spanning full-width below it.
- Info Cards (no form) — no form panel at all; contact info, working hours, social links, map, and trust block render as a card layout.
The Contact Form section only appears on the Split and Centered layouts. The Contact Info, Working Hours, Social Links, and Trust Block sections only appear on the Split and Info Cards layouts — Centered shows the form (and optional map) only.
Content Settings
| Section | Setting | What it does |
|---|---|---|
| Design Style | Style Preset | Bento Grid / Glassmorphism / Dark Minimal / Aurora / Neo-Brutalist |
| Design Style | Layout | Split (Form + Info) / Centered (Form only) / Info Cards (no form) |
| Section Header | Show Section Label | Toggles the small eyebrow label above the headline |
| Section Header | Label Text | Text shown in the eyebrow label, e.g. “Get In Touch” |
| Section Header | Headline | Main heading text |
| Section Header | Headline Highlight | Exact word(s) from the headline to style with the accent color/gradient |
| Section Header | Headline Tag | H1 / H2 / H3 / H4 — the actual heading tag rendered |
| Section Header | Description | Supporting paragraph under the headline |
| Contact Form | Form Title / Form Subtitle | Heading and supporting line shown above the form panel |
| Contact Form | Form Plugin | Choose which installed form plugin powers the form — HT Contact Form, Contact Form 7, WPForms, Fluent Forms, Gravity Forms, or Ninja Forms |
| Contact Form | Select Form | Dropdown of your published forms from the chosen plugin |
| Contact Form | Custom CSS Class | Optional extra class added to the form wrapper div |
| Contact Form | (no plugin installed) | Shows an install/activate prompt for HT Contact Form instead of the form controls |
| Contact Info | Info Items (repeater) | Icon Type (Address / Phone / Email / Hours / Website / Custom Icon), Label, Value (supports line breaks), and an optional Link URL per item |
| Map | Show Map | Toggles the embedded map |
| Map | Map Embed URL | The src URL from a Google Maps or OpenStreetMap embed code |
| Working Hours | Show Working Hours | Toggles the working-hours mini card |
| Working Hours | Title | Heading text for the hours card |
| Working Hours | Hours Rows (repeater) | Day(s) and Time pairs, e.g. “Mon – Fri” / “9:00 – 18:00” |
| Working Hours | Show “Open now” Badge | Toggles a small status badge on the hours card |
| Working Hours | Badge Text | Text shown inside the badge, e.g. “Open now” |
| Social Links | Show Social Links | Toggles the social-icons mini card |
| Social Links | Title | Heading text for the social card, e.g. “Follow Us” |
| Social Links | Social Items (repeater) | Network (Facebook / X-Twitter / LinkedIn / Instagram / YouTube / GitHub) plus its URL |
| Trust Block | Show Trust Block | Toggles the response-time stat card |
| Trust Block | Label | Small heading above the stat, e.g. “Why teams choose us” |
| Trust Block | Highlight Stat | The big number/stat, e.g. “< 1 hr” |
| Trust Block | Stat Description | One line describing the stat, e.g. “Average first response time” |
| Trust Block | Show Star Rating | Toggles a 5-star rating line |
| Trust Block | Footer Text | Closing trust line, e.g. “Rated 4.9/5 by 2,400+ customers” |
Style Settings
Every content element above has a matching Style-tab section:
- Section — background and padding.
- Card / Tile (shared) — background, border, corner radius, box shadow, and tile label styling, shared across the info, hours, social, and trust cards.
- Section Label — typography, color, background, corner radius, and padding.
- Headline — color, plus a separate solid or gradient color for the highlighted word(s).
- Description — typography and color.
- Form Tile — background, corner radius, and title and subtitle typography.
- Form Fields — background, text color, border, focus border, placeholder color, and label color and typography, all applied through CSS variables so it works with any connected form plugin.
- Submit Button — background or gradient, text color, corner radius, padding, and typography, plus a separate hover background and text color.
- Contact Info — icon background, color, and size, plus label and value typography and color.
- Working Hours — row typography and color, plus typography and colors for the “Open now” badge.
- Social Links — icon size and corner radius, with separate normal and hover color, background, and border.
- Trust Block — tile background, stat number and description typography and color, star color, and footer typography and color.
- Map — height and corner radius.
All colors accept either a solid color or a gradient.
Frequently Asked Questions
Do I need Elementor Pro to use this?
No — Contact Section 2026 works with the free version of Elementor, plus the WordPress block editor. No Pro upgrade required.
Can I use a different layout for each design style?
Yes — Design Style and Layout are independent settings. Any of the 5 styles can be paired with any of the 3 layouts.
Where does the form actually submit to, and is there spam protection?
The widget doesn’t process form submissions itself — the Contact Form section connects to a form plugin you choose (HT Contact Form, Contact Form 7, WPForms, Fluent Forms, Gravity Forms, or Ninja Forms) and renders that plugin’s own form via shortcode. Submission handling, storage, email notifications, and spam protection (reCAPTCHA, honeypot, etc.) are all managed by whichever form plugin you select. If no supported plugin is active yet, the widget shows a prompt to install or activate HT Contact Form.
Is this widget accessible?
Yes — WCAG 2.1 AA, with a labeled contact-information landmark, proper focus states on interactive elements, and semantic heading tags (choose H1–H4 to match your page’s outline).
How to Add This Section
- Elementor: search “Contact” in the widget panel under the HT Mega 2026 category, drag it onto your page.
- WordPress Block Editor: click the block inserter (+), search “Contact Section 2026” under the HT Mega category, insert it, then edit the settings in the block sidebar.
