Create Single Template

With Elementor Pro you can design the detail view of every property individually. WP-ImmoMakler provides specialized widgets for this purpose that cover all aspects of a property — from the image gallery and data sheets to the contact form.

Requirements

• Elementor Pro version 3.20.0 or later
• WP-ImmoMakler (any edition)

Note

In your website’s backend (wp-admin), disable the Plugin handles list and detail views option under WP-ImmoMakler → Settings → Theme Builder if you want Elementor Pro to fully control the presentation.

Option A: 1-Click HTML version (quick start)

The 1-click widgets display WP-ImmoMakler’s proven HTML templates — including the gallery, data, map, contact form, and everything else that belongs to a complete detail view.

1. Open the Theme Builder

   Navigate to Elementor → Theme Builder and create a new template of type Single Post via Add New Template.

2. Choose an empty template

   Close the template library to start with a blank template.

3. Set the preview property

   To have the editor show real data instead of placeholders, set the preview property — see Set the preview property below.

4. Insert the widget

   In the widget sidebar, search for the WP-ImmoMakler: 1-Click HTML Version category and drag the Property Detail View (complete) widget onto the page.

   

5. Set the condition

   Click Publish, then Add Condition, and in the selection menu under the WP-ImmoMakler group choose the condition Property. This applies the template to all property detail pages.

   

6. Done

   The detail view is now displayed using the WP-ImmoMakler HTML template.

   

Use your own page title

The Property Detail View (complete) widget offers a Show heading option (default: on). Turn it off to hide the heading (h1) output by the HTML template — for example when you want to design the page title yourself or your theme already outputs it.

Use your own gallery

The Property Detail View (complete) widget offers a Show image gallery option (default: on). Turn it off to hide the gallery built into the HTML template — for example when you want to place your own gallery (such as the Property Photo Gallery widget) above the title.

Control the summary

The Show summary option (default: on) shows or hides the summary (post excerpt) below the subtitle. You can enter the text manually or have it generated automatically with the AI feature active (PLUS). If no excerpt is stored, nothing is output.

Option B: Custom template

For full design freedom, build the detail view from individual WP-ImmoMakler widgets. Each widget represents a specific aspect of the property and can be freely positioned and styled.

1. Open the Theme Builder

   Create a template of type Single Post as described above.

2. Set the preview property

   To have the editor show real data instead of placeholders, set the preview property — see Set the preview property below.

3. Set up the page layout

   Choose a blank template. Create the desired page structure with containers — for example, a main area with gallery and data on the left, contact form and contact person on the right.

4. Add the gallery

   Drag one of the gallery widgets onto the page:

   Widget	Description
   Property Photo Gallery	Full image gallery with Slideshow and Static mode, lightbox and all Customizer options configurable per widget instance
   Gallery Grid	Compact grid view without slideshow, with lightbox

   The Property Photo Gallery widget provides the same options you know from the Customizer — on a per-widget-instance basis. See Configure the gallery below.

5. Add property data

   Add the desired data widgets:

   Widget	Displays
   All Property Data	Freely configurable data table with all property fields
   Area List	All area information (living area, plot area, etc.)
   Price List	All price information (purchase price, base rent, additional costs, etc.)
   Features	Property features as an icon list
   Energy Certificate	Energy certificate data as a data table
   Key Figures Icon List	Any data fields as an icon list
   Key Figures Tiles	Key figures as visual tiles

6. Insert description texts

   Use an Elementor Text widget with the Property: Description texts Dynamic Tag to display the property description from the real estate software. In the Dynamic Tag you can select the desired text field (property description, location, features, additional information, etc.).

7. Add the map

   Drag the Area Map widget onto the page. It displays the property’s location on Google Maps or OpenStreetMap.

8. Design the contact area

   Widget	Description
   Property Contact Form	Inquiry form with automatic property assignment
   Contact Details	Name, phone, email of the contact person
   Contact Person Photo	Photo of the contact person

9. Downloads and links

   Add the Downloads and Links widget to display PDF exposés, floor plans, and external links (e.g., virtual tours).

10. Videos and virtual tours

    Widget	Description
    Videos	Embedded YouTube/Vimeo videos
    Virtual Tours PLUS	360-degree tours
    Energy Certificate Diagram PLUS	Graphical energy certificate scale

11. Set the condition

    Click Publish, then Add Condition, and choose the appropriate condition from the WP-ImmoMakler group:

    Condition	Description
    Property	Template applies to all properties
    Reference property	Template applies only to reference properties

Configure the gallery

The Property Photo Gallery widget offers the same options per widget instance as the Image Gallery section in the Customizer. Here is an overview of the most important groups:

Area	Options
Image selection	All images, floor plans only, without floor plans
Gallery type	Slideshow (Swiper-based gallery with lightbox) or Static (image grid without slider, lightbox on click)
Slideshow layout	Vertical (thumbnail strip below), Horizontal (thumbnail strip right), No thumbnails, Carousel
Transition effect	Slide (default) or Cross-Fade
Transition duration	100–2000 ms (default 400 ms)
Autoplay	Automatic cycling with configurable delay in seconds
Aspect ratios	Main and thumbnail images independently configurable (16:9, 3:2, 4:3, 1:1, Golden Ratio, Original; static additionally 2:1 and 3:1)
Thumbnail size	40–400 px width (controls the number of thumbnails visible at once)
Mobile thumbnails	Show or hide on devices ≤ 768 px
Carousel height	Pixel or viewport unit (px, vw, vh, svh, lvh, dvh)
Static grid	Rows and columns independently configurable per layout variant
Gallery height (static)	Automatic or fixed
More photos indicator	Counter overlay on the last thumbnail (+N) or button below the gallery (“Show all N photos”)
Hover animation (static)	None / Gentle zoom-in (default) / Brighten — visual feedback when hovering over images with the mouse
Spacing + rounding	Gap between images, border radius (each image individually or only the gallery outer edges)
Navigation colour	Colour picker for arrow buttons and pagination dots (Slideshow mode)

Full details on each option are in the Customizer docs for Slideshow and Static gallery — the same terminology applies to the Elementor widget.

Tip

If you want the widget to display exactly the Customizer default without any further configuration, simply leave the widget options at their defaults — they match the Customizer preset.

Dynamic Tags for the detail view

In addition to the specialized widgets, you can use Dynamic Tags in any Elementor widget — for example, in headings, text blocks, images, or buttons. All WP-ImmoMakler tags appear in the tag selection dialog under the WP-ImmoMakler group.

Text tags

Tag	Description
Property: Title	Property title from the real estate software
Property: Status	Current status (active, sold, rented, etc.)
Property: Marketing type	Sale or rental
Property: Description texts	Free-text fields (property description, location, features, etc.)
Property: Value: Property data	Value of any data field (e.g., year of construction, floor)
Property: Name (multilingual): Property data	Label of a data field
Property: Value: Areas / Property: Name (multilingual): Areas	Area values and labels
Property: Value: Prices / Property: Name (multilingual): Prices	Price values and labels
Property: Value: Energy certificate / Property: Name (multilingual): Energy certificate	Energy certificate data and labels
Property: Value: Contact data	Contact person fields (name, phone, email, etc.)

Image tags

Tag	Description
Property: Featured image	Main image of the property (for Image widget or background image)
Contact person photo	Photo of the contact person
Single property photo	Single image by its position in the gallery
Property photos	All photos (for Gallery widget or Carousel)
Floor plans	Floor plans only

URL tags

Tag	Description
Property: Link to detail view	Permalink of the property
Property: Link to PDF print view	URL of the automatically generated PDF
Property: First PDF attachment	URL of a manually uploaded PDF attachment
Property: Link to extra gallery page	URL of the standalone gallery view

Using Display Conditions

Display Conditions are especially useful in the detail view to show sections only when the corresponding data is available — avoiding empty areas on the page. You find the conditions in the Advanced tab of a widget or container, in the WP-ImmoMakler group, and combine them with an operator (Is not empty / Is empty).

Example: A property without videos should not show an empty video section — condition Video + Is not empty.

Condition	Recommended use
Images present	Show/hide the Gallery widget
Videos present	Show/hide the Videos widget
Links / Downloads present	Show/hide the Downloads section
PDF present	Show/hide the PDF download button
Energy data present	Show/hide the Energy Certificate section
Contact person present	Show/hide the Contact Person section
Description fields present	Show/hide individual text sections
Property data present	Show/hide specific data rows or tiles
Virtual tours present PLUS	Show/hide the Tours widget

Taxonomy-based conditions

Taxonomy conditions let you create different layouts for different property types:

• Marketing type: Different price display for sale vs. rental
• Property type: Different data fields for flats vs. plots
• Status: Special display for reference properties
• Usage type: Commercial properties presented differently from residential ones
• Country: Country-specific field assignments

Showing related properties

If you want to display additional properties below the detail view (e.g. via Elementor’s Loop Grid or Posts widget), you naturally don’t want the currently displayed property to show up there again. Elementor Pro has its own setting for this — you don’t need a query ID from WP-ImmoMakler.

1. Add a Loop or Posts widget

   Add a Loop Grid or Posts widget below your detail view and configure it to display properties (post type Property).

2. Exclude the current property

   In the widget, open the Query tab and select Current Post under Exclude By.

3. Optional: show only available properties

   To exclude already sold or rented properties, add the term Property Status: open under Include By > Terms in the same tab.

4. Done

   The currently displayed property no longer appears in the loop.

Deprecated: immomakler_exclude_current query ID

Up to version 5.66, we recommended the query ID immomakler_exclude_current (Advanced > Query ID tab) for the same purpose. It has been deprecated since version 5.67 and will be removed in a future major version.

Existing templates continue to work unchanged — there is no time pressure. Switch them over whenever convenient: clear the Query ID field and instead select Current Post under Exclude By in the Query tab. Elementor’s own setting can be combined with the widget’s other exclusion options and keeps the Query ID field free for other purposes.

The query ID only takes effect on property detail pages anyway; on other pages, the query remains unchanged.

Set the preview property

When editing the template, Elementor displays placeholder data by default. To have the editor show a real property, set the preview property in the page settings — ideally right at the start so you can work with real data as you build:

1. Click the gear icon (Page Settings) in the editor panel footer.

2. Open the Preview Settings section.

3. Under Preview dynamic content as, select Property and search for an existing property.

4. Click Apply & Preview. The template will now be displayed with the data of that property.

Tip

Recommended approach: Start with the 1-Click HTML version to familiarize yourself with the available data. Then gradually build a custom template by replacing individual sections with specialized widgets. You can control the visibility of both templates via Theme Conditions to test them side by side.

You might also be interested in

• Elementor Pro Overview
• Create Archive Template
• Gallery: Slideshow configuration
• Gallery: Static view