Follow the steps below to embed the simple widget on your Squarespace site.
- In the Nonprofit Admin Portal, click the "Widget" tab in the menu on the top of the dashboard.
- You'll see a preview of your widget below.
- Next, associate your widget with one of your customized fundraising pages. The widget will adopt your campaign’s styling and donation frequency. In addition, donations from the widget will be associated with this fundraising page in data you get from our platform.
- Select preset suggested donation amount options for the widget ($25, $50, $100, $250) or set a custom amount.
- Click "Get Embed Code" then select the "div" element of the code. It will look like this:<div data-widget-src='https://38293fbc.ngrok.io/donate/helen-keller-foundation?ref=sd_widget' id='give-lively-widget'></div>
- Click here and follow the instructions provided by Squarespace.
- Paste the div element from above into the Code element on the page where the widget will appear.
- Copy the script element from the embed code. The section starts and ends with "script" and will look like this:<script>gl=document.createElement('script');gl.src='https://secure.givelively.org/widgets/branded_donation/helen-keller-foundation.js?show_suggested_amount_buttons=false&show_in_honor_of=undefined';document.getElementsByTagName('head').appendChild(gl);</script>
- On the lefthand menu of the page in Squarespace, go to "Settings", then "Advanced", then click "Code Injection" and paste the script code into the "Header" section.
Please contact us at firstname.lastname@example.org if you have any problems setting up your simple widget.