Squarespace Integration

This website builder supports all of Philantro's fundraising features.

The Philantro platform is designed to enable you to collect online donations, provide donor self-service, peer fundraising and event ticketing directly on your squarespace website. This approach ensures your nonprofit's brand is forefront at all times and helps foster trust and a frictionless conversion. To achieve this seamless integration, Philantro needs to be able to communicate with your squarespace website. The following integration method enables this constant feedback loop so that when you add donation campaigns etc in Philantro, your donors see those campaigns on your website.

Topics On This Page

How helpful was this article?

Code Injection Integration Method

Squarespace may freely alter their dashboard and menu settings at anytime without notice. If the steps we outline below no longer apply, please consult Squarespace's documentation about Code Injection.

In the Home menu, click Settings, click Advanced, then click Code Injection.
Add the Integration Code to the field for the Footer.
After adding your code, click Save.

Contact Support about this Topic

Integration Code

On line 7 in the code snippet below, replace "XXXXXXXXX" with your Philantro Organization ID.

Add the following code snippet to your code injection section for the footer. This is the most effective way to integrate Philantro. This snippet is how Philantro and your website communicate with one another.


                
                <script>
                (function() {
                const s = document.createElement('script');
                const ph = document.getElementsByTagName('script')[0];
                s.type = 'text/javascript'; s.async = true;
                s.src = 'https://philantro.s3.amazonaws.com/pdf/philantro.js';
                window.options = {OID: ''};
                ph.parentNode.insertBefore(s, ph);
                })();
                </script>

Contact Support about this Topic

Choosing the Right Donation Form

Now all that is left is for you to select the right donation form to use on your website. Philantro has two, the Modal Donation Form and the Embedded Donation Form, each with their own unique implementation. Use the links below to explore the pros and cons of each one along with examples.

Contact Support about this Topic

Donation Form Link

On the highlighted lines of the code snippets below, replace "WEBSITE" with your website address.

With the following link, you can add a donate call-to-action to your navigation menu as well as use it to solicit donations via email, articles and blog content.


                
                Replace WEBSITE with your website address
                #_givealways


                
                Link Example
                If your website address was https://www.philantro.org
                https://www.philantro.org#_givealways

Live Example Contact Support about this Topic

Embedded Donation Form

Use our Design Guide to ensure your donors encounter a user-friendly donation page.

This method will add a fully embedded donation form to a designated page on your website. You can also upload customized CSS (Cascading Stylesheet) to align the donation form with your website's aesthetics.

Navigate to the Page or Section you want your donation form to appear on.
Add a "Code" element to the page, preferably a full sized section.
In the Code content editor that appears, add the code snippet below.
Save your changes.


                
                Remember to style it to match your website.
                
<div id="ph-root"></div>


                
                An super basic styling example.
                
This will add a rounded border around the donation form.
                
<div style="padding: 10px 20px; border-radius: 10px; background-color:white;">
                <div id="ph-root"></div>
                </div>

Contact Support about this Topic

Topics On This Page

Code Injection Integration Method

Integration Code

Choosing the Right Donation Form

Donation Form Link

Embedded Donation Form

Sustainable Fundraising Tips and Techniques