Embedding on Your Website#

If you have an existing website, you can integrate RecSystems booking to give visitors a seamless experience. Here are your options.

Integration Options#

Option 1: Link (Recommended)#

Add prominent links to your booking site:

• Book Now buttons
• Navigation menu item
• Footer link

Option 2: Embed#

Display your booking site within your website:

• Iframe embedding
• Appears as part of your site

Linking to Your Booking Site#

Simple Link#

Add an HTML link:

<a href="https://yourbusiness.recsystems.com">Book Now</a>

Styled Button#

Create a prominent button:

<a href="https://yourbusiness.recsystems.com" 
   style="background: #1a5276; color: white; 
          padding: 15px 30px; text-decoration: none;
          border-radius: 5px; font-weight: bold;">
  Book Your Rental
</a>

Where to Add Links#

• Homepage hero section
• Navigation menu
• Service pages
• Footer
• Contact page

Link Tips#

• Make buttons prominent
• Use action words (Book Now, Reserve Today)
• Place above the fold
• Use consistent styling

Embedding Options#

Basic Iframe#

Embed your full booking site:

<iframe 
  src="https://yourbusiness.recsystems.com" 
  width="100%" 
  height="800px"
  frameborder="0">
</iframe>

Responsive Iframe#

For mobile-friendly embedding:

<div style="position: relative; padding-bottom: 75%; height: 0; overflow: hidden;">
  <iframe 
    src="https://yourbusiness.recsystems.com"
    style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
    frameborder="0">
  </iframe>
</div>

Embed Considerations#

Pros:

• Booking appears on your site
• Visitors don't leave
• Integrated experience

Cons:

• May have scrolling issues
• Mobile can be tricky
• Harder to maintain
• SEO implications

Best Practices#

Link Approach (Recommended)#

Why linking is often better:

• Clean, reliable experience
• Mobile-optimized automatically
• Easier to maintain
• Better performance
• Full functionality guaranteed

Make it seamless:

• Use custom domain (book.yourbusiness.com)
• Match branding/colors
• Link opens in same tab
• Clear return path

Navigation Placement#

Add to main navigation:

• Book Now or Reservations
• Right side of nav (prominent)
• Highlight or different color

Call-to-Action Buttons#

Effective CTAs:

• Book Your Adventure
• Reserve Now
• Check Availability
• Start Booking

Placement:

• Above the fold on homepage
• End of service descriptions
• In the header (sticky)
• Footer for completeness

Website Platforms#

WordPress#

Link method:

• Add button block
• Set link to booking URL

Menu link:

• Appearance → Menus
• Add Custom Link
• Enter booking URL

Squarespace#

Button:

• Add Button block
• Set Click Action to external URL
• Enter booking URL

Navigation:

• Add external link to navigation

Wix#

Button:

• Add Button element
• Link to booking URL

Menu:

• Add external link to menu

Shopify#

Button:

• Add button to section
• Link to booking URL

Navigation:

• Add link to menu

Tracking and Analytics#

Track Clicks#

Add UTM parameters to track:

https://yourbusiness.recsystems.com?utm_source=website&utm_medium=button

Google Analytics#

If you use GA on both sites:

• Track referrals from your site
• Monitor booking conversions
• See which links perform best

Testing Your Integration#

Checklist#

• [ ] Links work on desktop
• [ ] Links work on mobile
• [ ] Buttons are visible
• [ ] Booking flow completes
• [ ] Return navigation makes sense

Test Scenarios#

1. Click from homepage → booking works
2. Click from mobile → booking works
3. Complete a test booking
4. Verify confirmation received

Troubleshooting#

Link not working#

• Check URL is correct
• Verify no typos
• Test in incognito mode

Iframe issues#

• Check source URL
• Verify dimensions
• Test responsiveness
• Consider link instead

Mobile problems#

• Test on actual devices
• Check iframe sizing
• Link approach often better for mobile

---

Related Articles:

• Your Online Booking Page
• Using Your Own Domain