Live Event Seating Pro – documentation

Welcome to the official documentation for the Live Event Seating Pro plugin. Consequently, this guide will walk you through everything from initial setup to advanced feature configuration. Whether you’re just getting started or looking to master a specific feature, you’ll find the answers you need right here.

Table of Contents

  1. Installation & Activation
    • Prerequisites
    • Installing the Plugin
  2. Initial Setup (Required Steps)
    • Step 1: Create a WooCommerce “Ticket” Product
    • Step 2: Create Your First Event
    • Step 3: Display the Seating Plan with a Shortcode
  3. The Seating Plan Builder: A Detailed Guide
    • The Canvas & Navigation (Zoom, Pan, Resize)
    • Adding & Deleting Elements (Tables, Seat Blocks, etc.)
    • The Inspector Panel: Editing Element Properties
    • Importing & Exporting Layout Templates
  4. Advanced Features & Configuration
    • Setting Up Tiered Pricing (Variable Products)
    • Enabling “Book as Whole Table Only”
    • Setting a Booking Window
  5. Event Day Management: The QR Code System
    • How Tickets are Generated
    • Using the Ticket Scanner
    • Manual Ticket Check-in
  6. Global Settings
    • Finding the Settings Page
    • Configuring Booking Logic & Colors
  7. Customizing Text Labels
  8. Manually Setting Booking Status
  9. General Admission (GA) Areas with Capacity Control
  10. Freeform Drawing Tools (Decorative & GA)
  11. Precision 360° Rotation Slider
  12. WYSIWYG Seat Block Builder
  13. Blocking Individual Seats (Seat Holds)
  14. Selecting Multiple Elements
  15. Moving a Group of Elements
  16. Duplicating and Deleting a Group
  17. Choosing a Layout Mode
  18. Using the Smart Alignment Guides
  19. Real-Time Availability Polling (Frontend)
  20. Using the Sections Feature
  21. Frequently Asked Questions (FAQ)
  22. Need Woocommerce for this plugin

1. Installation & Activation

Prerequisites

Before you begin, please ensure you have the following installed and activated on your WordPress site:

  • WordPress 5.8 or higher
  • WooCommerce 6.0 or higher
  • PHP GD Graphics Library: This is a standard PHP extension required for QR code generation. If you encounter issues with QR codes, please contact your web host and ask them to enable the gd extension.

Installing the Plugin

  1. Download the plugin .zip file from your purchase confirmation email or your account page.
  2. In your WordPress dashboard, navigate to Plugins > Add New.
  3. Click the “Upload Plugin” button at the top of the page.
  4. Click “Choose File” and select the .zip file you downloaded.
  5. Click “Install Now” and then “Activate Plugin”.

2. Initial Setup (Required Steps)

Follow these three steps to get your first seating plan live.

Step 1: Create a WooCommerce “Ticket” Product

Every seat sold is managed by a WooCommerce product.

  • For a Single Price:
    1. Go to Products > Add New.
    2. Give it a name, like “Gala Dinner Ticket”.
    3. In the “Product data” section, keep it as a “Simple product”.
    4. Set a “Regular price”. This will be the price for one seat.
    5. Publish the product.
  • For Tiered Pricing (e.g., VIP, Standard):
    1. Please see the “Setting Up Tiered Pricing” section in the advanced guide below. You must use a “Variable product”.

Step 2: Create Your First Event

  1. Navigate to the Events menu in your WordPress dashboard and click Add New.
  2. Give your event a title (e.g., “Annual Charity Gala 2024”).
  3. Scroll down to the “Event Seating Settings” box.
  4. From the “Link to WooCommerce Product” dropdown, select the product you created in the previous step.
  5. Now, use the “Seating Plan Builder” to design your layout. (See the detailed guide below).
  6. Click “Publish” or “Update” to save your event and its layout.

Step 3: Display the Seating Plan with a Shortcode

  1. While editing your event, find the “Event Seating Settings” box.
  2. Copy the automatically generated Shortcode (it will look like [event_seating_plan id=”123″]).
  3. Paste this shortcode into the main content area of your event post, or onto any other page or post where you want the seating map to appear.

That’s it! Your interactive seating plan is now live on your website.


3. The Seating Plan Builder: A Detailed Guide

The builder is where you bring your venue to life.

The Canvas & Navigation

  • Canvas: The main grid area where you will place your elements.
  • Resize: To make the canvas larger, click and drag the handle in the bottom-right corner.
  • Pan (Move the View): Hold Shift + Left-Click and drag, or use your Middle Mouse Button to move the canvas around.
  • Zoom: Use the + and – buttons in the bottom-right corner to zoom in and out. The middle button resets the view.

Adding & Deleting Elements

Use the buttons at the top of the builder to add elements to your canvas:

  • Add Circle/Rect Table: Adds a table for guests.
  • Add Seat Block: Adds a block of seats in rows, perfect for theaters.
  • Add Stage / Add Image: Adds decorative, non-bookable elements to your map.

To delete an element, simply click on it and then click the “Delete” button in the Inspector Panel on the right.

The Inspector Panel: Editing Element Properties

When you click on any element on the canvas, the Inspector Panel will appear on the right, showing only the relevant options for that element.

  • Label: The public name of the element (e.g., “VIP Table 1,” “Orchestra Section”).
  • Element Color: Sets a custom background color for the table, stage, or seat block.
  • Price Tier: (Requires a Variable Product) Assigns a specific price tier to this element. All seats within it will be sold at this price.
  • Dimensions (Width/Height/Radius): Precisely control the size of your elements.
  • Seats/Rows: Define the capacity of a table or the structure of a seat block.
  • Book as Whole Table Only: (For tables only) If checked, this table must be booked as a single unit. Individual seats cannot be selected.
  • Actions (Duplicate, Rotate): Quickly copy an element or rotate rectangular elements by 90 degrees.

Importing & Exporting Layout Templates

  • Export: Once you have a layout you want to reuse, click the “Export Layout” button. This will save a .json file of your design (without any booking data) to your computer.
  • Import: On a new event, click “Import Layout”, select the .json file you previously saved, and your entire seating chart will be instantly recreated.

4. Advanced Features & Configuration

Setting Up Tiered Pricing (Variable Products)

  1. Go to Products > Add New.
  2. Change the “Product data” dropdown to “Variable product”.
  3. Go to the “Attributes” tab and click “Add”.
  4. Name: Price Tier (or similar).
  5. Values: Enter your tiers separated by a pipe |. Example: VIP | Standard | Balcony.
  6. Check the “Used for variations” box and click “Save attributes.”
  7. Go to the “Variations” tab. From the dropdown, select “Create variations from all attributes” and click “Go.”
  8. For each variation that appears, expand it and set a price.
  9. Save the product. Now you can link this Variable Product to your event and assign these tiers in the builder.

Enabling “Book as Whole Table Only”

  1. In the seating plan builder, click on a table.
  2. In the Inspector Panel, check the box labeled “Book as Whole Table Only”.
  3. Save the event. On the frontend, this table will now be a single clickable item.

Setting a Booking Window

  1. While editing your event, find the “Event Seating Settings” box.
  2. Use the date pickers for “Booking Open Date” and “Booking Close Date”.
  3. If left blank, booking is open indefinitely. If dates are set, the seating plan will only be visible to customers within that date range.

5. Event Day Management: The QR Code System

How Tickets are Generated

After a customer successfully completes a purchase, a single “Master Ticket” with a unique QR code is generated for their entire order. This is:

  • Displayed on the on-screen Order Confirmation (“Thank You”) page.
  • Sent to the customer in their Order Confirmation email.
  • Visible to you in the Admin Order Details page.

Customers can show the QR code on their phone or a printout. The ticket also includes a list of all seats in their order and key payment details.

Using the Ticket Scanner

  1. Navigate to Events > Ticket Scanner in your WordPress admin. (For The Events Calendar, it will be under their “Events” menu).
  2. The page will request permission to use your device’s camera. Allow it.
  3. Point the camera at the customer’s QR code.
  4. The system will provide an instant on-screen result:
    • Success: Confirms the check-in and shows guest details.
    • Already Used: Shows an error with the time of the first scan to prevent fraud.
    • Invalid: Shows an error if the QR code is not from your system.

Manual Ticket Check-in

If a scan fails (e.g., cracked phone screen), you can use the “Manual Ticket Entry” field on the scanner page. Simply type in the Master Ticket Code (e.g., LESO-123-45678) and click “Verify Code.”


6. Global Settings

To configure global options for the plugin, navigate to Seating Plan > Settings in your WordPress admin menu.

Here you can control:

  • Booking Logic: Enable/disable the “Orphan Seat” rule, set the maximum number of seats per order, and define the seat lock time.
  • Seat Colors: Use color pickers to customize the colors for Available, Selected, and Booked seats to match your brand.

7. Global Settings

Make your labels more readable or match your brand’s style. For any element with a label (Tables, Stages, Seat Blocks), you can set:

  • Text Color: Use the color picker to select a custom color for the label text.
  • Font Size: Enter a pixel value to increase or decrease the size of the label text.

8. Manually Setting Booking Status

This is an essential tool for managing your event inventory without creating a formal order.

  • How it works: For any bookable element (Tables or Seat Blocks), a “Status” dropdown will appear in the inspector.
  • Available: This is the default. The element and its seats are available for customers to book.
  • Booked / Unavailable: If you select this, the entire element (and all seats within it) will be instantly marked as “Booked” on the frontend. This is perfect for:
    • Reserving seats for VIPs or special guests.
    • Blocking off tables for staff or technical equipment.
    • Holding seats that were sold offline.

This manual override gives you complete control to block off any part of your seating chart from public sale.

You can now create and sell tickets for standing-room sections, festival fields, or any area that doesn’t have assigned seats. The system will automatically track the number of tickets sold and prevent overselling.

9. How to Add a General Admission Area:

  1. Edit Your Event: Go to the event where you want to add a GA section. Scroll down to the Seating Plan Builder.
  2. Choose a Shape: In the builder controls, you will see two new buttons:
    • [Add GA Rectangle]: Click this to add a standard rectangular GA area to your canvas.
    • [Add GA Freeform]: Click this to start drawing a custom-shaped GA area (see Freeform Drawing Tools below for drawing instructions).
  3. Position and Resize: Drag the new GA area to position it. If it’s a rectangle, you can resize it using the Width and Height fields in the Inspector.
  4. Set the Capacity: With the GA area selected, the Inspector panel will appear on the right. Find the “Capacity” field and enter the maximum number of tickets that can be sold for this area.
  5. (Optional) Assign a Price Tier: If you want this GA area to have a different price from your default ticket, select a Price Tier from the dropdown. This requires you to have a Variable Product linked to the event.

How it looks for customers:
On the frontend, customers will see the GA area on the map with its name and the number of available tickets (e.g., “450 / 500 Available”). When they click it, a quantity selector will appear in the summary box, allowing them to choose how many GA tickets they wish to purchase.

10. Freeform Drawing Tools (Decorative & GA)

Your venue layouts are no longer limited to basic shapes. Use the polygon tool to draw decorative elements like stages and dance floors, or to create custom-shaped General Admission areas.

How to Draw a Freeform Shape:

  1. Select the Drawing Tool:
    • For a decorative shape, click the [Add Freeform Shape] button.
    • For a General Admission area, click the [Add GA Freeform] button.
  2. Start Drawing: Your cursor will turn into a crosshair. Click anywhere on the canvas to place your first point.
  3. Add More Points: Move your mouse and click again to place the next point. A line will follow your cursor, showing you the shape as you build it.
  4. Finish the Shape: You have two easy ways to finish:
    • Double-click to place your final point and complete the shape.
    • Click the Starting Point: Once you have at least three points, a small circle will appear at your starting point. Clicking this circle will close and complete the shape.

After finishing, the shape becomes a standard element. You can select it, drag it, and use the Inspector to change its Label, Color, or Price Tier.


11. Precision 360° Rotation Slider

You can now rotate elements with complete freedom, allowing for more realistic and optimized layouts. This feature is available for tables, seat blocks, images, stages, and GA rectangles.

How to Rotate an Element:

  1. Select an Element: In the builder, click on any table, seat block, or other rotatable element.
  2. Find the Rotation Control: In the Inspector panel on the right, you will see a new “Rotation” control.
  3. Rotate Your Element: You have two ways to set the rotation:
    • Slider: Drag the slider handle to rotate the element in real-time on the canvas. This is great for quick visual positioning.
    • Number Input: For perfect accuracy, type a precise degree value (from 0 to 360) into the number box next to the slider.

The element’s rotation is saved automatically. This is perfect for angling tables to fit in a corner or aligning seat rows with a curved wall.


12. WYSIWYG Seat Block Builder

The builder for theater-style rows (“Seat Blocks”) is now a true “What You See Is What You Get” (WYSIWYG) editor. You no longer have to guess what your layout will look like.

How it Works:

This feature is enabled automatically. There are no new steps to learn!

  1. Add a Seat Block: Click the [Add Seat Block] button as you normally would.
  2. See the Seats: Instead of a simple grey box, the builder will now instantly draw a grid of circles, representing every single seat within that block.
  3. Edit in Real-Time: When you select the block and change the RowsSeats per RowWidth, or Height in the Inspector, you will see the grid of seats on the canvas update instantly.

This provides immediate visual feedback, making it much faster and easier to design complex seating arrangements with confidence. The “Element Color” option has been removed for this element type, as there is no longer a background to color. You can still style the section’s Label using the text styling options.

13. How to Block and Unblock Seats

The entire process is handled within a special editing mode in the Seating Plan Builder.

Step 1: Activate “Block Seats” Mode

Navigate to your event’s Seating Plan Builder. In the top control bar, you will find the [Block Seats] button.

  • Click the [Block Seats] button.
  • The button will turn a solid dark color (or blue), indicating that Block Mode is active.
  • Your mouse cursor will change to a pointer when you hover over individual seats, letting you know you can interact with them.

Step 2: Click to Block or Unblock Seats

While in Block Mode, you can simply click on any individual seat within a table or a seat block to toggle its status.

  • To Block a Seat: Click on any green (available) seat. It will instantly turn grey, marking it as blocked and unavailable for public sale.
  • To Unblock a Seat: Click on any grey (blocked) seat. It will instantly turn green again, making it available for customers to purchase.

Step 3: Exit “Block Seats” Mode

When you are finished blocking or unblocking seats, simply click the active [Block Seats] button again.

  • The button will return to its normal appearance.
  • Your cursor will go back to normal.
  • You can now resume editing your layout as usual (e.g., dragging and rotating entire elements).

What Your Customers Will See

This feature is completely seamless for the end-user. Any seat that you have marked as “blocked” in the admin panel will appear as unavailable on the live seating map on the frontend. Customers will not be able to click on it or add it to their cart.

Important Tip: Blocking Individual Seats vs. Blocking Whole Elements

The [Block Seats] tool is for controlling individual seats within an element (like one seat at a 10-person table).

If you need to make an entire element (like a whole table or an entire seat block) unavailable, select the element and use the “Status” dropdown in the Inspector panel on the right, setting it to “Booked / Unavailable.”

14. Selecting Multiple Elements

There are two easy ways to select more than one element at a time.

Using the Marquee (Selection Box)

This is the fastest way to select a group of elements in a specific area of your canvas.

  1. Click and Hold: Position your mouse on an empty area of the canvas, outside of any element.
  2. Drag to Draw: Click and drag your mouse. A blue selection box (a “marquee”) will appear.
  3. Cover the Elements: Expand the box to cover the elements you want to select. An element only needs to be partially touched by the box to be included.
  4. Release: Release the mouse button. All elements inside the box will now be selected, indicated by a red border around each of them.

Using Shift + Click

This method is perfect for adding or removing individual elements from a selection, especially if they are far apart.

  1. Select Your First Element: Click on any element to select it.
  2. Hold the Shift Key: Press and hold the Shift key on your keyboard.
  3. Click Other Elements:
    • Clicking on any unselected element will add it to your current selection.
    • Clicking on any already selected element will remove it from your current selection.

You can combine these methods! For example, use the marquee to select a large group, then hold Shift and click to deselect one or two items from that group.

Note on the Inspector: The property Inspector on the right will only appear when exactly one element is selected. When multiple elements are selected, the Inspector is hidden to avoid confusion, but you can still perform group actions like moving, duplicating, and deleting.

15. Moving a Group of Elements

Once you have multiple elements selected, moving them together is simple.

  1. Select Your Group: Use either the marquee or Shift + Click to select the elements you want to move.
  2. Click and Drag: Position your mouse over any one of the selected elements.
  3. Move the Group: Click, hold, and drag your mouse. The entire group of selected elements will move together, maintaining their relative positions.
  4. Release: Release the mouse button to place the group in its new location.

16. Duplicating and Deleting a Group

You can perform actions on all selected elements at once.

To Duplicate a Group:

  1. Select the elements you wish to duplicate.
  2. The Inspector panel will appear on the right, showing only the actions available for a multi-selection.
  3. Click the [Duplicate] button.
  4. A copy of every selected element will be created and slightly offset. The new copies will be automatically selected, ready for you to drag into position.

To Delete a Group:

  1. Select the elements you wish to delete.
  2. You have two options:
    • Click the [Delete] button in the Inspector panel.
    • Press the Delete or Backspace key on your keyboard.
  3. All selected elements will be removed from the canvas instantly.

17. Getting Started: Choosing a Layout Mode

When you first create a seating chart for a new event, you will be prompted to choose a layout mode. This is the foundational structure of your chart and cannot be changed later for that event.

1. Single Layout Mode

The Single Layout mode is the simplest way to build a chart and is ideal for venues that consist of a single, open space like a wedding hall, conference room, or small theater.

When to use it:

  • Your event takes place in one room.
  • You don’t need to logically separate areas like “Balcony” vs. “Floor”.
  • You want to quickly add tables and chairs to a single canvas.

How it works:
Once you select “Single Layout,” you will be taken directly to the main builder canvas where you can immediately start adding tables, rows of seats, stages, and other elements using the toolbar.


2. Use Sections Mode

The Use Sections mode is a powerful feature for organizing complex venues into logical, manageable areas. This is the recommended choice for theaters, auditoriums, stadiums, or any event with distinct pricing or seating zones.

When to use it:

  • Your venue has multiple floors or rooms (e.g., “Main Floor,” “Mezzanine,” “Balcony”).
  • You have distinct areas with different pricing tiers (e.g., “VIP Section,” “General Admission”).
  • Your chart is very large, and you want to provide a cleaner, zoomable experience for customers.

How it works:

  1. Select “Use Sections” from the initial modal.
  2. You will start in the Venue Overview. This is a top-down view of your entire venue space.
  3. Use the “Add Section” or “Add Freeform Section” buttons to draw the outlines of each area (e.g., draw a large rectangle for the “Orchestra” and another for the “Balcony”). You can name and color each section using the Inspector panel on the right.
  4. To add seats and tables, double-click on a section. This will “zoom in” and take you to that section’s dedicated canvas.
  5. Inside a section, use the toolbar to add tables, rows of seats, etc., just as you would in the Single Layout mode. These elements now belong to that section.
  6. Click the “Back to Venue” button in the top-left to return to the main overview.

On the frontend, customers will see the Venue Overview first. Clicking a section will smoothly zoom them into that area to select their seats.

18. Using the Smart Alignment Guides

The Smart Alignment Guides help you create clean, professional layouts with perfect alignment. The guides appear automatically while you are dragging elements.

How they work:

  1. Select an Element: Click on any table, seat block, or other element on the canvas.
  2. Drag the Element: As you click and drag the element, you will see up to six dashed blue lines appear:
    • Three Vertical Lines: Marking the left edge, center, and right edge of your selection.
    • Three Horizontal Lines: Marking the top edge, center, and bottom edge of your selection.
  3. Align with Other Objects: Move the element until its guide lines snap visually with the edges or center of other elements on the canvas.
  4. Multi-Select Alignment: This feature also works when you have multiple elements selected. The guides will show the boundaries of the entire group, making it easy to move a whole block of tables while keeping them aligned.

The guides disappear automatically when you release the mouse button.


19. Real-Time Availability Polling (Frontend)

This feature works automatically on the frontend to ensure your customers always see the most up-to-date seat availability.

How it works for the User:

  • When a customer is viewing a seating chart, the chart silently checks with the server every 20 seconds.
  • If another person has booked a seat or has a seat held in their cart, that seat will automatically turn gray and become unselectable on everyone else’s screen.
  • This happens in the background without requiring the user to refresh the page.

What you need to know as an Admin:

  • This feature is enabled by default and requires no configuration.
  • It helps prevent overselling seats and reduces customer confusion, especially during high-traffic sales periods.
  • The polling interval is set to a reasonable 20 seconds to balance real-time accuracy with server performance.

20. Using the Sections Feature

The Sections feature is a powerful tool designed for creating complex layouts for venues with multiple rooms, floors, or distinct areas (e.g., Balcony, Orchestra, Floor Level). It allows you to build your chart in a more organized, hierarchical way.

1. Getting Started: Choosing Your Layout Mode

When you create a new event and open the “Seating Plan Builder” for the first time, you will be prompted to choose a layout mode:

  • Single Layout: Best for simple venues like a single room or hall. You add all tables and seats directly to one main canvas.
  • Use Sections: Best for complex venues. You first create the main areas (Sections) and then add tables and seats inside each one.

Important: This choice is permanent for this specific event. Once you add an element, you cannot switch modes.

2. The Venue View: Your Main Blueprint

After choosing “Use Sections,” you will start in the Venue View. Think of this as the main blueprint of your entire venue.

  • Purpose: To add and arrange the main areas (Sections) of your venue.
  • Available Tools: In this view, your primary tools are:
    • Add Section: Adds a standard rectangular section.
    • Add Freeform Section: Allows you to draw a section with any shape (e.g., an L-shaped room, a curved balcony).
    • Add Stage / Add Image: You can also add venue-wide elements like a main stage or background images that are not inside any specific section.

How to Add a Section:

  1. Click “Add Section” to create a rectangle. You can move, resize, rotate, and change its properties (label, color) in the Inspector panel on the right.
  2. Click “Add Freeform Section” to start drawing mode.
    • Click on the canvas to place the first point.
    • Continue clicking to add more points to create your shape.
    • To finish, either double-click or click on the very first point you made.
    • Press the Esc key at any time to cancel drawing.

3. The Section View: Adding the Details

Once you have created a section, you need to add tables and seats inside it.

  • How to Enter a Section: Double-click on any section shape in the Venue View.
  • What Happens: The builder will zoom in, and the canvas will now show the contents of only that section. The toolbar will change, and an indicator will appear at the top showing which section you are currently editing.
  • Purpose: To add and arrange the seating elements (tables, seat rows, GA areas) for that specific area.
  • Available Tools: Inside a section, you have the full set of tools:
    • Add Circle/Rect Table
    • Add Seat Rows
    • Add Stage, Image, or other shapes
    • Add General Admission Areas
  • Positioning: All elements you add are positioned relative to the section itself. If you go back to the Venue View and move the entire “Balcony” section, all the seats inside it will move with it automatically.

4. Navigating Back and Forth

  • To Exit a Section: Click the “< Back to Venue” button in the top-left of the toolbar. This will take you back to your main venue blueprint.
  • To Enter a Section: Simply double-click the section you want to edit from the Venue View.

This workflow allows you to focus on one area at a time without being distracted by the rest of the venue, making the management of large, complex layouts simple and efficient.

21. Frequently Asked Questions (FAQ)

  • Q: Can I reuse a layout for multiple events?
    • A: Yes! Use the “Export Layout” and “Import Layout” buttons in the builder to create reusable templates.
  • Q: Why isn’t the QR code working?
    • A: Your server most likely needs the PHP GD Graphics Library enabled. Please contact your web host and ask them to enable the gd extension for PHP.
  • Q: How do I offer VIP and Standard pricing?
    • A: You must use a WooCommerce “Variable Product”. Please see the detailed guide in section 4 above.