Integration Guide

BeSeat Booking Integration Guide

This guide will help you integrate the BeSeat booking widget into your website, share your booking link, and use QR codes to accept bookings from your customers.

Overview

BeSeat provides three main ways to accept bookings:

1. Direct Booking Link - Share a direct URL with your customers
2. QR Code - Print or display QR codes for easy mobile access
3. Website Integration - Embed the booking form directly into your website

Accessing Your Integration Settings

To access your integration options:

1. Log in to your BeSeat account
2. Navigate to Settings → Integration
3. You’ll see all available integration options

Note: Only account owners and administrators can access integration settings. Staff members do not have permission to view or modify these settings.

Method 1: Direct Booking Link

The simplest way to share your booking system is through a direct booking link.

How to Use

1. Copy your booking link from the Integration tab
2. Share it via:
   • Email campaigns
   • Social media posts
   • SMS messages
   • Business cards
   • Email signatures

Customising Your Booking Form

Before sharing your link, you can customise the appearance of your booking form:

1. Go to Settings → Company → Widget
2. Customise colours, fonts, and branding
3. Your booking link will automatically reflect these changes

Method 2: QR Code

QR codes make it easy for customers to access your booking system using their mobile phones.

Generating Your QR Code

Your QR code is automatically generated based on your booking link. You can:

• View the QR code in the Integration tab
• Download the QR code as a PNG image
• Print it for physical use

Best Practices for QR Code Usage

✓ Print on table tents or menus - Place QR codes on each table for easy access
✓ Display at your entrance - Help customers book while waiting
✓ Add to business cards - Make it easy to share your booking system
✓ Share on social media - Include QR codes in your social media posts
✓ Include in email signatures - Add QR codes to your professional emails

Tips for Effective QR Code Placement

• Ensure the QR code is large enough to scan easily (minimum 2cm × 2cm)
• Place it in well-lit areas
• Test the QR code before printing in bulk
• Provide clear instructions (e.g., “Scan to book a table”)

Method 3: Website Integration

Embed the BeSeat booking form directly into your website using an iframe.

Standard Integration Code

Copy and paste this code into your website where you want the booking form to appear:

<iframe
  src="YOUR_BOOKING_URL"
  allow="payment"
  width="100%"
  height="700"
  style="border:none;">
</iframe>

Responsive Integration Code (Recommended)

For better mobile experience, use this responsive code:

<div style="position: relative; width: 100%; height: 0; padding-bottom: 75%;">
  <iframe
    src="YOUR_BOOKING_URL"
    allow="payment"
    style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none;">
  </iframe>
</div>

Important: Payment Attribute

The allow="payment" attribute is essential and must not be removed. This attribute enables:

• Apple Pay integration
• Google Pay integration
• Browser-saved card autofill

Without this attribute, customers will not be able to use these convenient payment methods.

Integration Steps

1. Copy the integration code from your Integration tab
2. Paste it into your website HTML where you want the booking form to appear
3. Replace YOUR_BOOKING_URL with your actual booking link (found in the Integration tab)
4. Test the integration on both desktop and mobile devices
5. Publish your website to make it live

Customisation Options

You can adjust the iframe appearance by modifying:

• Width: Change width="100%" to a specific pixel value or percentage
• Height: Adjust height="700" for the standard code, or padding-bottom: 75% for responsive code
• Border: The code includes style="border:none;" to remove borders, but you can customise this

Testing Your Integration

After integrating the booking widget:

1. Test on desktop - Ensure the form displays correctly
2. Test on mobile - Verify responsive design works properly
3. Test the booking flow - Complete a test booking to ensure everything works
4. Test payment methods - Verify Apple Pay, Google Pay, and card payments work correctly

Troubleshooting

Booking Form Not Displaying

• Verify the iframe URL is correct
• Check that your website allows iframes (some security settings block them)
• Ensure the allow="payment" attribute is present

Payment Methods Not Working

• Confirm the allow="payment" attribute is included in your iframe code
• Check that your browser supports the Payment Request API
• Verify your payment settings in BeSeat are configured correctly

QR Code Not Scanning

• Ensure the QR code is printed at sufficient size (minimum 2cm × 2cm)
• Check that the QR code image is clear and not distorted
• Verify the booking URL is accessible

Security Considerations

• Your booking link is unique to your business branch
• Only share your booking link through trusted channels
• The iframe integration is secure and does not expose sensitive data
• All payment processing is handled securely by BeSeat

Next Steps

• Customise your booking widget appearance
• Set up automated booking reminders
• Configure your business hours and availability
• Learn about advanced booking settings

Need Help?

If you encounter any issues with integration:

• Contact our support team
• Check the Integration tab in your BeSeat dashboard for your unique booking URL and codes