# Interactive Real Estate — Full LLM Context

> The #1 WordPress plugin for creating interactive images with SVG hotspots. Transform static property images into clickable, filterable floor plans, apartment maps, and 360° building viewers — no coding required.

**Website:** https://ireplugin.com
**WordPress.org:** https://wordpress.org/plugins/interactive-real-estate/
**Contact:** interactiverealestateplugin@gmail.com
**Support:** https://ireplugin.com/contact

---

## What Is Interactive Real Estate?

Interactive Real Estate is a WordPress plugin that lets you overlay clickable SVG polygon shapes on any image. Visitors hover or click on apartments, floors, building zones, or map areas to see details, open modals, follow links, or trigger custom JavaScript. It is built for real estate developers, construction companies, property agencies, and anyone who needs to make a static image interactive.

The plugin manages a full data model: projects → blocks → floors → flats → flat types. A single project can contain multiple buildings (blocks), each with multiple floors, each with multiple individual flats. All of this is managed in a custom WordPress admin panel powered by Vue 3.

---

## Core Architecture

- **Backend:** PHP, WordPress REST API + AJAX, custom database tables (projects, floors, blocks, flats, types, reservations)
- **Admin Panel:** Vue 3 + TypeScript SPA mounted in WordPress admin (`#irep-vue-app`)
- **Frontend Shortcodes:** Vue 3 components bundled separately, rendered via WordPress shortcodes
- **SVG Canvas:** Custom interactive SVG polygon editor built in Vue, supporting zoom/pan/edit
- **Licensing:** Freemius SDK (free, premium, gold tiers)

---

## Shortcodes

### `[irep_project id="123"]`
The main interactive building viewer. Renders an image with SVG polygon overlays. Visitors click on any flat/floor/zone to open a detail modal. Supports multi-floor navigation, flat status colors, zoom/pan, tooltips, and a filterable sidebar.

### `[irep_flats id="123"]`
A standalone filterable, paginated list of flats for a project. Can be displayed in grid, list, or mixed layout. Supports price range, area range, floor filter, room count filter, status filter, and more. Can be embedded anywhere independently of the map view.

### `[irep_360 id="123"]`
The 360° building viewer (requires Building 360 add-on). Renders a drag-to-spin exterior rotation of the building with SVG polygon overlays at every angle. Includes the same filterable sidebar as `irep_project`.

---

## Feature List

### Free Tier Features
- Create unlimited polygon shapes on images
- Basic tooltip display on hover
- Flat status: available / reserved / sold
- Dynamic multiple tooltip variants (3 styles)
- Project import / export (JSON)
- Shortcode-based embedding
- Compatible with all WordPress themes and page builders

### Premium Tier Features (everything in Free plus)
- Unlimited projects and flats
- Custom SVG path colors: fill, hover, reserved, sold, stroke, stroke width
- Zoom and pan on the SVG canvas (Ctrl+/Ctrl−, Space+drag)
- Modal popup on flat click with full flat details
- Link following: navigate to a URL on polygon click
- Run custom JavaScript on polygon click
- Currency symbol customization ($, €, £, ₾, and any other)
- Shareable direct links to individual flats
- Container border radius customization

### Gold Tier Features (everything in Premium plus)
- Client inquiry / reservation forms (visitors can request a callback for a flat)
- Custom flat statuses beyond available/reserved/sold
- Flats list shortcode `[irep_flats]` with advanced filtering
- Primary brand color customization across all UI elements

---

## Add-ons

### Building 360 Module
**Shortcode:** `[irep_360 id="YOUR_PROJECT_ID"]`

Adds an immersive drag-to-spin 360° building exterior viewer. Key capabilities:
- Frame-by-frame building rotation with smooth easing and image pre-loading
- Clickable SVG polygon overlays at every rotation angle — each frame has its own layer
- Smart snap-to-polygon: when the user releases the drag, the viewer snaps to the nearest angle that has polygon data
- Flat status colors, price, area, and availability all stay in sync as the building rotates
- Built-in filterable flat sidebar: selecting a flat from the list rotates the viewer to the correct angle automatically
- Switchable floor-plan view within the same shortcode
- Works with the same projects, floors, blocks, and flats already managed in the dashboard
- Mobile-friendly: touch drag support

### Price History Add-on
Tracks every flat price change with a timestamp. Key capabilities:
- Automated logging: every price change made in the admin dashboard is silently recorded
- Front-end price history charts shown directly inside the flat detail popup
- XML export for government reporting (designed for Polish real estate law compliance, dane.gov.pl format)
- Helps satisfy EU consumer protection laws that require price change transparency
- No manual entry required after initial setup

---

## How It Works — Step by Step

### Creating a Project
1. In WordPress admin, go to **Interactive Real Estate > New Project**
2. Enter a project title and upload a background image (floor plan, building photo, site map, etc.)
3. Click **Add Project** to create the entry

### Drawing Polygons
1. Click anywhere on the image in the canvas editor to start a polygon
2. Click to place each vertex of the polygon shape
3. Close the shape by clicking the first (red) circle
4. To edit, click an existing polygon and drag its vertex circles
5. Use Ctrl+ / Ctrl− to zoom; hold Space and drag to pan while zoomed

### Configuring Flats
1. After drawing, assign each polygon to a flat, floor, or block in the data panel
2. Set flat details: name, area (m²), price, number of rooms, floor, status
3. Add custom fields for any additional data
4. Flat types group apartments of the same layout/area to avoid duplicate entries

### Embedding the Shortcode
1. In the lower-left corner of the editor, find your unique shortcode (e.g., `[irep_project id="123"]`)
2. Copy and paste it into any WordPress page, post, or widget
3. Compatible with Classic Editor, Gutenberg (Shortcode block), Elementor, Beaver Builder, Divi, WPBakery, Brizy

### Project Export / Import
- Export: go to **All Projects**, hover a project, click **Export** → saves a `.json` file
- Import: go to **Interactive Real Estate > Import**, upload the `.json` file
- The JSON includes: polygon coordinates, tooltip content, color schemes, all settings
- Use Media Remapping during import if moving to a new server

---

## Customization Options

| Setting | Description |
|---|---|
| Path fill color | Default polygon fill color |
| Path hover color | Color on mouse hover |
| Reserved color | Polygon color for reserved flats |
| Sold color | Polygon color for sold flats |
| Stroke color | Polygon border color |
| Stroke width | Polygon border thickness |
| Container border radius | Rounded corners on the viewer container |
| Currency symbol | Any character: $, €, £, ₾, etc. |
| Tooltip style | 3 built-in variants |
| Primary color | Global UI accent color (Gold) |

---

## Page Builder Compatibility

✔️ Classic Editor
✔️ Gutenberg (Shortcode block)
✔️ Elementor (Shortcode widget)
✔️ Beaver Builder
✔️ Divi (Code module)
✔️ WPBakery
✔️ Brizy

---

## Translation / Internationalization

The plugin is fully translatable using **Loco Translate**:
1. Install Loco Translate from the WordPress plugin directory
2. Go to **Loco Translate > Plugins > Interactive Real Estate**
3. Click **New Language**, choose your target language
4. Translate strings, save, and sync
5. Change site language in **Settings > General > Site Language** to activate

Supported translation file formats: `.po` and `.mo`

---

## Developer Hooks

### Action: `irep_flat_saved`
Fires after a flat is created or updated.
```php
add_action('irep_flat_saved', function ($flat_id, $project_id, $old_price, $new_price, $request_price) {
    // Sync with CRM, trigger notifications, log price changes
}, 10, 5);
```
Arguments: `flat_id` (int), `project_id` (int), `old_price` (float), `new_price` (float), `request_price` (bool)

### Action: `irep_reservation_created`
Fires after a visitor submits a callback/inquiry form for a flat.
```php
add_action('irep_reservation_created', function ($reservation_id, $created_reservation, $project_id, $flat_id) {
    // Send to CRM, email notification, analytics
}, 10, 4);
```
Arguments: `reservation_id` (int), `created_reservation` (object|null), `project_id` (int), `flat_id` (int)

### Filter: `irep_flat_mapped`
Applied to each flat before it is returned in the REST response. Use to inject custom fields.
```php
add_filter('irep_flat_mapped', function ($flat) {
    $flat['custom_badge'] = !empty($flat['offer_price']) ? 'Special Offer' : '';
    return $flat;
});
```

---

## Pricing

All prices in USD.

### Annual Plans (renews yearly, cancel anytime)

| Plan | Price | Projects | Flats | Key Extras |
|---|---|---|---|---|
| Free | $0 | 1 | 25 max | Basic features |
| Premium | $99.99/year | Unlimited | Unlimited | Colors, zoom/pan, modals, scripts |
| Gold | $199.99/year | Unlimited | Unlimited | All Premium + forms, custom statuses, flats list shortcode |

### Lifetime Plans (one-time payment)
Available for both Premium and Gold — no renewal fees ever.

### License Packs
Discounted multi-site packs: 1 site, 5 sites, 10 sites. For larger installations, contact support.

### Payment Methods
Visa, Mastercard, American Express, PayPal.

### Refund Policy
7-day money-back guarantee if the plugin has a bug or issue that cannot be resolved.

### What Happens at Expiry
The plugin continues to work after license expiry but updates and email support are no longer provided.

---

## Frequently Asked Questions

**What does this plugin do?**
It makes property images interactive by letting you draw clickable polygon zones on any image. Visitors click to see flat details, open modals, follow links, or trigger scripts.

**What is an interactive image?**
An image with clickable areas (polygons) that respond to hover or click by showing details, redirecting to a page, or executing JavaScript.

**Can I show multiple floor plans / building layers?**
Yes. Upload multiple images (one per floor or building section) and let visitors navigate between them.

**Does it work with any WordPress theme or page builder?**
Yes. It uses shortcodes and is compatible with all themes and the most popular page builders.

**Can I customize polygon colors?**
Yes (Premium). You can set fill, hover, reserved, sold, stroke colors and stroke width.

**What happens if my license expires?**
The plugin keeps working on your site. You lose access to updates and email support.

**Can I cancel my subscription?**
Yes, anytime from your account page at https://ireplugin.com/account.

**Do I need a separate license for WordPress Multisite?**
Yes, each site in a multisite network needs its own license.

**Is there a free version?**
Yes, on WordPress.org. Limited to 1 project and 25 flats, basic features only.

---

## Live Demos

- Cottages: https://ireplugin.com/demos/cottages
- Hotel: https://ireplugin.com/demos/hotel
- Big Hotel: https://ireplugin.com/demos/big-hotel
- Entertainment Spaces: https://ireplugin.com/demos/entertainment-spaces
- Blocks: https://ireplugin.com/demos/blocks

---

## Documentation Pages

- Introduction: https://ireplugin.com/doc/intro
- Installation: https://ireplugin.com/doc/installation
- How to add clickable zones (SVG): https://ireplugin.com/doc/how-to-add-clickable-zones-to-building-images-with-svg
- Shortcode placement: https://ireplugin.com/doc/shortcode-placement
- Project import/export: https://ireplugin.com/doc/project-import-export
- How to translate: https://ireplugin.com/doc/how-to-translate-interactive-real-estate
- Price History add-on: https://ireplugin.com/doc/price-history-addon
- Building 360 add-on: https://ireplugin.com/doc/building-360-addon
- Custom action hooks: https://ireplugin.com/doc/action-hooks

---

## Blog Posts

- Why the Interactive Real Estate Plugin Is a Game Changer for Building Companies: https://ireplugin.com/blog/why-the-interactive-real-estate-plugin-is-a-game-changer-for-building-companies
- How to Add Interactive Floor Plans to WordPress (Step-by-Step): https://ireplugin.com/blog/how-to-add-interactive-floor-plans-to-wordpress
- Building 360 Module — Immersive 360° Property Viewer for WordPress: https://ireplugin.com/blog/building-360-module-immersive-property-viewer-for-wordpress

---

## Target Users

- Real estate developers and construction companies showcasing apartment buildings
- Property agencies that want buyers to self-explore floor plans online
- Developers building custom WordPress real estate sites
- Agencies building client sites that need interactive property maps
- Hotel and hospitality businesses showing room layouts interactively
- Any business that needs clickable zones on a static image (maps, seating charts, site plans)

---

## Key Differentiators

- **No coding required** — polygon editor works entirely in the browser
- **SVG-based** — scales perfectly on all screen sizes, no pixelation
- **Full data model** — not just an image map, but a real database of projects/floors/flats with statuses and prices
- **Developer-friendly** — action hooks, REST API, filterable flat data
- **Add-ons for advanced use cases** — 360° viewer and price history tracking extend the core plugin without bloating it
- **Works alongside any theme** — shortcode-based, no theme lock-in

---

## Social / Community

- X (Twitter): https://x.com/ireplugin
- WordPress.org reviews: https://wordpress.org/plugins/interactive-real-estate/