Booking Button

1. Customize it
Please use the full marina address on Snag-A-Slip.
Example: https://www.snagaslip.com/chesapeake-bay-marinas/baltimore-marinas/oasis-marinas-harbor-east

This will be required for sites like Wix.

Background Color

Text Color


2. Add the base Booking Button JS
Add this code before </body>
3. Use this code wherever you'd like the button to appear
4. Enjoy your new Booking Button!

(Alternative) For Wix sites: Add this as HTML Code

Button Documentation
Call the sasBookingButtons() JavaScript Function whenever data-attributes are updated after button creation.
data-url

The full Marina URL on Snag-A-Slip Required

Example:
data-url="https://www.snagaslip.com/chesapeake-bay-marinas/baltimore-marinas/oasis-marinas-harbor-east"

data-length Boat Length (LOA) (ft) Optional
Max: 1000
data-beam Boat Beam (ft) Optional
Max: 500
data-draft Boat Draft (ft) Optional
Max: 500
data-power

Power Type (1-8) Optional

  • 1 — Double 30
  • 2 — Double 50
  • 3 — Single 20
  • 4 — Single 30
  • 5 — Single 50
  • 6 — Single 100 - 1 Phase
  • 7 — Single 100 - 3 Phase
  • 8 — No Power Required
data-color

Button Color Optional

  • orange
       
    (Default)
  • polar
       
  • razzmatazz
       
  • custom — (Allows data-bgcolor and data-txtcolor)
data-bgcolor

Background Color Optional
Requires data-color="custom"

  • Any hexadecimal color — (Example: #ff6800)
data-txtcolor

Text Color Optional
Requires data-color="custom"

  • Any hexadecimal color — (Example: #ffffff)
data-size

Button Size Optional

  • normal — 100% x 40px. Will fill its parent.
  • fixed — 240px x 40px (Default)
  • small — 160px x 40px
  • nano — 100px x 40px