Setup PCO Model forms with Squarespace

This is a simple tutorial for setting up Planning Center embedded modal with Squarespace so you can have a cool popup like below for both Giving and Forms:

 Explinations are at the bottom of each picture below.

Explinations are at the bottom of each picture below.

 
 
 
 In your admin menu Click "Settings"

In your admin menu Click "Settings"

 Then Click "Advanced

Then Click "Advanced

 Then Click "Code Injection"

Then Click "Code Injection"

Screen Shot 2017-11-17 at 10.59.39 AM.png

Copy and Paste the code below into the "Header" section. Then click the webpage back button to get back to your main menu.

<script src="https://js.churchcenter.com/modal/v1"></script>
 Click on "Pages"

Click on "Pages"

 Click the + to add a "Link".

Click the + to add a "Link".

 Make sure you Check "Open in New Window" or the form won't work in Mobile Safari&nbsp;

Make sure you Check "Open in New Window" or the form won't work in Mobile Safari 

Put "Give" or whatever you want your link for the form to say in the "Link Title".
Paste this code in "Link" box:

Giving: This is for your giving form.

https://yourcbcfamily.churchcenteronline.com/giving?open-in-church-center-modal=true"

Forms: Get the number for the form you want to use from the address bar in your browser when you are looking at the form in Planning Center. The form number for my "Favorite Pie" form is "1745"

Screen Shot 2018-07-31 at 11.03.57 AM.png

Change form number  "1745" in the link below to match the number in the form url for your form on Planning Center Online.

https://yourcbcfamily.churchcenter.com/people/forms/1745?data-open-in-church-center-modal=true

You can use these address fields in buttons and any links once you have added the code injection in the header.

Change the yourcbcfamily.churchcenteronline.com part to your unique church url. 

Now click "Save".

You should have a working popup form now. If it's not working check to make sure you are using the https:// version of your site. And check that SSL is turned on in "Settings / Security & SSL" like this:

Screen Shot 2017-11-17 at 11.18.02 AM.png

I hope this helps your church help broken people find hope! If you are still stuck contact PCO Support