How to Embed Your Club's Playtomic Booking Page Correctly

To ensure your club's Playtomic booking page is successfully embedded on your website, specific settings and configurations must be in place. This article walks you through the necessary steps, common mistakes to avoid, and troubleshooting tips.

Requirements for Embedding Playtomic Booking

1. Set the Correct Website URL on Your Profile
   Your club's actual website (e.g., https://my-awesome-club.com) must be listed in your Playtomic profile.
   • Club Admin Access: Navigate to Playtomic Manager, then go to Settings > Venue > Basics > Website to update the website URL.
   • Playtomic Employee Access: Playtomic staff can update the website URL for any club via Backoffice.
2. Use the White-Label URL Format for Embedding
   The URL for embedding must follow the white-label format: https://playtomic.io/wl/{tenant_id}. This ensures compatibility with your website.

Common Issues and Solutions

Incorrect configurations often lead to embedding issues. Below are some of the most common mistakes and how to resolve them.

1. Club’s Website URL Is Not Set to the Correct Website

If a social media link is listed as the website, you’ll need to replace it with your actual website URL.

• Solution: Update the URL in Playtomic Manager under Settings > Venue > Basics > Website. If this section is not visible, check that the admin has the appropriate permissions.

2. URL Format or Domain Is Incorrect

Inconsistent formatting or domain mismatches are frequent sources of errors. Your website URL should match the origin, including protocol (https vs. http) and domain (with or without www).

Example Mistakes:

• ✅ Correct: https://my-awesome-club.com
• ✅ Correct with Subpage: https://my-awesome-club.com/plaza
• ❌ Incorrect: http://my-awesome-club.com (missing the "S" in HTTPS)
• ❌ Incorrect: https://www.my-awesome-club.com (incorrect www prefix)
• ❌ Incorrect: https://www.my-awesom-club.com (typo in the domain name)

3. Incorrect <iframe> src Attribute in Embed Code

The src attribute of the <iframe> embed must be set to the white-label URL format, not your club's main URL.

White-Label URL Format

• Correct Format: https://playtomic.io/wl/{tenant_id}
• Incorrect Format: https://playtomic.io/{club_short_name}/{tenant_id}

Using the wrong URL structure will prevent the embedded booking page from loading correctly.

Examples of <iframe> src values for My Awesome Club:

• ✅ Correct: https://playtomic.io/wl/abcdef-ghij-klem-nopqrstuvwx
• ❌ Incorrect: https://playtomic.io/my-awesome-club/abcdef-ghij-klem-nopqrstuvwx

Troubleshooting Tips

If you’re experiencing issues after following the above instructions:

• Verify the URL: Ensure it matches your actual website’s domain and protocol.
• Use the Correct Embed URL: Double-check that the white-label URL is being used in the src attribute of your <iframe>.
• Permissions: If sections of Playtomic Manager aren’t visible, ensure you have the necessary admin permissions.

By following these steps and correcting any errors, you’ll ensure that your club's booking page integrates seamlessly with your website.