Template Builder

Create custom WooCommerce page templates with Elementor's visual editor. No coding required.

Overview

The Template Builder is the core feature of Magical Shop Builder. It uses a hybrid approach that works with both Elementor Free and Elementor Pro:

• With Elementor Free: Uses a custom post type (mpd_template) to store templates. The plugin handles rendering via its own system.
• With Elementor Pro: Can also integrate with Theme Builder locations for seamless workflow.

The system is built on 4 core classes:

Class	Role	Size
Builder	Orchestrator — manages the template building workflow	552 lines
Manager	Handles template CRUD operations, uses mpd_template custom post type	837 lines
Conditions	Evaluates which template to show based on rules	764 lines
Renderer	Renders templates at WooCommerce hook priority 998	458 lines

Template Types

Magical Shop Builder supports 7 template types, covering every major WooCommerce page:

Creating Templates

Follow these steps to create a new template:

Template Conditions

Conditions are the most powerful feature of the Template Builder. They determine when a template is displayed. Each template can have include and exclude rules.

Available Condition Types

There are 9 condition types you can use to target specific pages or products:

Condition	Value	Description
all	—	Apply to all items of this template type
product_type	simple, variable, grouped, external	Target specific product types
product_category	Category slug	Target products in specific categories
product_tag	Tag slug	Target products with specific tags
specific_product	Product ID	Target a single product
product_in_stock	yes / no	Target based on stock status
product_on_sale	yes / no	Target sale products
user_role	administrator, customer, etc.	Target based on user role
user_logged_in	yes / no	Target logged in or logged out users

Include vs. Exclude Logic

Include conditions define where a template is shown. If a page matches any of the include conditions, the template is eligible to render on that page.

Exclude conditions override includes and have higher priority. Even if a page matches an include condition, it will be skipped if it also matches an exclude condition.

Template Priority

When multiple templates match the same conditions, priority determines which one wins. Lower number = higher priority.

Templates can be reordered in the admin dashboard by dragging them into the desired order. The template with the highest priority (lowest number) that matches the current page's conditions will be used for rendering.

Pre-Built Layouts

Magical Shop Builder comes with pre-built layout structures for each template type. These give you a professional head start so you don't have to design from scratch:

• Each template type has multiple pre-designed layouts to choose from
• Layouts can be imported with one click when creating a new template
• Layouts are stored locally and can also be fetched from a remote server
• Remote server: https://mp.wpcolors.net/ (using mpd-layout-server/v1 API)
• Layouts are cached for 1 day to improve performance

Editing Tips

• Use the widget categories in the Elementor panel — they auto-expand based on template type
• Single Product templates show product title, price, gallery, etc. widgets
• Cart templates show cart table, totals, coupon form widgets
• Preview products in the editor using the built-in preview product selector
• Templates support Elementor's responsive design tools