All Collections
Customize the Appearance of your Schedule
Sharing your passes for purchase on your website
Sharing your passes for purchase on your website

Share links to the Purchase a Pass page and/or embed Punchpass on your website

Sharon avatar
Written by Sharon
Updated over a week ago

If you offer online pass purchases via Punchpass/Stripe, you can payments online right on your website -- just like you can with your online schedule. So your customers can purchase passes from you without ever leaving your site.

Ways you can share your Purchase a Pass page

1. The Simplest Approach: Add a Button

We recommend adding a Button on your site and linking it to your custom URL. That way your customers can just click the button to buy a pass and/or see your schedule.  One button handles both your schedule and your pass purchases, so it's easy peasy for you to set up & for your customers to navigate.

To find your custom URL, just go to Manage Settings > Public Schedule.

2. Embedding the Purchase a Pass page

Click on Manage Settings > Embedding Punchpass to find your custom code for your business.

To embed your entire Purchase a Pass page on your website, you'll want to copy the embed code from the Your Passes for Purchase section.


3. Allow pass purchases by adding buttons to the top of your embedded schedule

If you would prefer to allow pass purchases right from your embedded schedule, you can add buttons to the top of your schedule. This will allow you to create a single web page where your customers can access the schedule AND purchase passes.

Depending on what features you offer, these additional buttons will automatically show:

To add these buttons to the top of your embedded schedule, you will place additional embed code ABOVE the schedule embed code. Your custom embed code for these buttons is shown on Manage Settings > Embedding Punchpass.

4. What if I don't have a website or I can't embed on mine?

No website? No problem!

We also provide Punchpass-hosted online schedule & payments pages with your logo. You can direct your customers to this page from your Facebook page, from a button on your website....or even from an email! You can find it by going to Manage Settings > Public Schedule. Navigation buttons are automatically shown to direct your customers between your schedule and pass purchase pages.

Examples of Embedding Punchpass

We have included a few examples of how you might embed Punchpass on your website below!

Wix

If you are using Wix.com to host/build your website*, we have created a demo site to show you what Punchpass schedules and calendars look and act like when embedded on the platforms.

Please check out the demo below and you'll find instructions as well as an example embedded schedule.

*Looking for an easy to use service for your website? We definitely recommend trying Wix.com We hadn't used it before setting up the demo site, and it's an impressive service. Very easy to use. They have some nice free fitness themes that you can then modify.

Wordpress

We have written a support article specific to Wordpress (see the article list above.) You are able to embed your schedule on Wordpress.org websites - if you use Wordpress.com then there is no way to embed the schedule. Contact us if you aren't sure!

See our Wordpress Embed Article


Squarespace

The trick with Squarespace is you want to add a Code block (NOT an Embed block.) After identifying where you'd like to add your schedule to your web page, select the code block option to add it to your page. You'll then paste your custom embed code into the block settings.

Other Sites

Every web host is a little different - some will make it easy, some won't. In general, you are going to be adding an iFrame to your site. Think of an iFrame as a little box that can display content from another website. The code looks like this:

<iframe name="frame2" src="https://yourstudioname.punchpass.com/calendar?embed=true" height="700" width="100%" frameborder="0" allowfullscreen></iframe>

Did this answer your question?