DEV3 Hearth – 3D Restaurant & Food WordPress Theme for Elementor & WooCommerce

DEV3 Hearth is a WordPress theme for restaurants, bistros, cafés, bakeries and wood-fired kitchens. The home page is a scroll-driven 3D story rendered live in WebGL: a dish on a handmade stoneware plate on a dark plank table, lit like food photography, with steam rising and embers drifting from an unseen wood fire. Between chapters the garnish (basil, tomatoes, peppercorns, olive oil, rosemary) bursts out of the dish in slow motion, orbits and settles into the next course: pasta, grilled fish, then a chocolate tart under a dusting of sugar. The story ends on two glasses being filled with wine.

There is no public live demo. Watch the video tour at the top of this page, or step through the screenshots at desktop, tablet and phone sizes.

The 3D scroll story

• The scene is procedural three.js, made in code. There are no licensed food photos to replace and no hero video to download before the text appears.
• The story is built from ordinary Elementor containers. Switch on Use as 3D chapter on a container and it becomes a camera stop. The demo home page has six: Welcome, The pass, The fire, Sweet, The cellar and Your table.
• Each chapter can blend scene state: which course is on the plate, steam, embers, the wood-fire glow, the key light, powdered sugar on the dessert, and how full the wine glasses are.
• Two presets: Hearth: the table (25 dishes, 4 table woods, 5 plate glazes, red, rosé or white wine, napkin colour) and Hearth: a single dish (dish, variant, extra topping, camera angle, drag to turn).
• Upload your own .glb model (Draco, KTX2 and meshopt supported) to show a real dish scan instead.

Built for restaurants

• Menu board. Dishes are a Menu post type with a price, dietary tags (V, VG, GF, DF, N), a pairing note, a chef's-special switch and an optional link to the matching WooCommerce product. The Hearth: Menu board widget adds section tabs, dietary filters, three layouts, an allergen footnote and a Print the menu button that prints the menu alone in black on white.
• Opening hours and an "Open now" badge. Enter your hours once in the Customizer. They drive a live "Open now · until 22:00" badge in the header and footer, the Hearth: Opening hours widget and the booking slots, all in your site's timezone.
• Table booking. The Hearth: Table booking widget shows a guests stepper, a 14-day date strip with closed days disabled, and time slots generated from your hours. It fills a Contact Form 7 form, so bookings arrive as ordinary emails and still work without JavaScript. A second form handles private dining.
• Chefs, events and reviews. Chef profiles, events (wine tastings, supper clubs) linked to seat products, and sample reviews, each with structured data. The site outputs Restaurant JSON-LD with opening hours and hasMenu, plus MenuItem.

WooCommerce online ordering

• Dishes are WooCommerce products. Pasta and pizza are variable products with Portion and Extras attributes shown as label swatches.
• The product page has a live 3D dish. Pick a large portion or add burrata and the model changes as you choose.
• The cart and checkout show your pickup or delivery note from the Customizer, and the order-notes field asks "Pickup or delivery, and when?".
• Gift cards (four amounts) and event seats are virtual products.
• AJAX mini-cart drawer, quick view and a saved-dishes wishlist. The classic and block Cart and Checkout are both styled.

Edit everything

• Every demo page is built with the free Elementor plugin. The DEV3 widget category adds 3D Scene, 3D Product Viewer, Kinetic Heading, Marquee, Magnetic Button, Counter, Hover-Reveal List, Image Trail, Testimonials, Pricing Table, Team, Timeline, Before/After, Post Type Grid, Product Grid/Carousel, Category Showcase, Countdown, FAQ, Contact/Map and Form, plus the three Hearth widgets.
• Every widget has a block-editor twin. The theme also adds a 3D Chapter block and 27 block patterns, so a site works without Elementor.
• Customizer: colours (cream, charcoal-olive, terracotta, ember), self-hosted fonts (Fraunces, Figtree, Caveat), header style, 3D quality, loader, cursor, smooth scroll, grain, chapter rail, footer, shop and blog. Saving also updates Elementor's Global Colors and Fonts.
• Elementor Pro is supported (header, footer, single, archive and product Theme Builder locations) but not required.
• A child theme is included for your own CSS and PHP.

Performance and accessibility

• The 3D engine loads only on pages with a scene: about 209 KB gzip including three.js, plus about 20 KB for the Hearth scenes in one lazy chunk. Other pages load about 12 KB of JavaScript.
• Quality is chosen per device. The low tier uses fewer embers and less garnish, smaller shadow maps and no glass refraction.
• Visitors with reduced motion, Save-Data or no WebGL see a still poster image instead of the live scene.
• The page text stays in the HTML for search engines and screen readers. Copy over the 3D sits on a scrim so it stays legible.
• Skip link, focus rings, keyboard menus, an ARIA-live cart and pressed states on filters and slot buttons. Includes an RTL stylesheet, a .pot file and wpml-config.xml.

What's in the download

• dev3-hearth.zip: the theme (the demo package is built in)
• dev3-hearth-child.zip: the child theme
• dev3-theme-toolkit.zip: the DEV3 Theme Toolkit plugin (Elementor widgets and blocks, post types, WooCommerce extras, demo importer)
• dev3-hearth-demo-content.zip: the demo package, for reference
• Documentation/: the HTML guide

The one-click demo imports the pages, 27 dishes in 7 menu sections, 4 chefs, 4 events, 4 sample reviews, 16 WooCommerce products, 6 journal posts, 3 forms, the menus and the theme settings. Every image is generated by the theme's own 3D scenes, and the restaurant, people and events are fictional.

Requirements

• WordPress 6.0 or newer (tested up to 6.8) and PHP 7.4 or newer
• Elementor (free) is recommended; Elementor Pro is optional
• WooCommerce for online ordering, Contact Form 7 for the booking and contact forms
• The DEV3 Theme Toolkit plugin (included; WordPress prompts you to install it)

Support

Six months of support are included: installation, demo import and questions about the theme's features. Read how we built Hearth for the design decisions behind the 3D story.