You can embed a Makerble Referral Form in your website.

• This means that people can complete your referral form without needing to leave your website

• The alternative is to create buttons on your website that link to your Referral Forms

Steps

Part 1: Get the Embed Code for the form

1. Select My Apps in top menu

2. Select Contacts

3. You arrive in the Contacts App

4. Select More Options

5. In the dropdown options select Public Referral Forms

6. You arrive on the Public Forms page

7. 

   Click the Embed this code button below the Public Form you want to embed

8. This copies the Embed Code to the clipboard

Part 2: Paste the Embed Code into a webpage on your website

Wordpress

1. Follow the Part 1 instructions to get the Embed Code for your Public Form

2. Press the + button in Wordpress to add a new block to a page

   

3. Select Shortcode

4. The Shortcode block appears on the page

   

5. Paste the Embed Code from Makerble into this field

   

6. Press the Update button in the top right corner of the page to save the page

   

7. Your Makerble Public Form is now displayed on your web page with its own vertical scrollbar

   

8. If you want the full length of the Public Form to be displayed, adjust the heigh on Makerble from the Public Forms page and then generate new Embed Code and follow these steps again

   

Squarespace 7.1

Watch the walkthrough: https://makerble.slack.com/files/U044FAH0LBT/F04CELLV231/screenshare_-_2022-11-29_1_27_56_pm.webm

1. Follow the Part 1 instructions to get the Embed Code for your Public Form

2. Click the Add Block button

   

3. In the popup that appears, select Add Block

   

4. Select Embed

5. This adds an empty block to your page

   

6. Click the pencil icon to edit the block

7. Select Code Snippet in the popup

   

8. Click the Embed data button

9. A text area appears

   

10. Paste your form’s Makerble Embed Code into this section

    

11. Click elsewhere on the page to close the popup

12. A preview of your form appears

    

13. Use the arrows at the edge to drag and resize the form

    

14. Resize the form to the size you want it displayed

    

15. You can also resize it vertically

    

16. Press Done in the top left corner to save the page

17. You will see your form displayed

    

18. You might need to follow Squarespace’s instructions to disable scripts in preview

Squarespace 7.0

• Follow the Part 1 instructions to get the Embed Code for your Public Form

• When you add the Embed Code the embedded form is previewed slightly differently

• However, even though the form is previewed as appearing larger than the blue outline of the form, the form will still display properly on the finished web page

Websites powered by Drupal, Episerver, Joomla, Sitecore, Umbraco, Wagtail, WildApricot, Wix, Weebly and other CMSs (Content Management Systems) that support embedding

In Part 1: Get the Embed Code for the form

• Follow the Part 1 instructions to get the Embed Code for your Public Form

• Adjust the Height and Width of the Embedded Form using the number fields

• Then press Embed this form to generate fresh code

In Part 2: Paste the Embed Code into a webpage on your website

• Use the Embed block option that’s available to you

• If it looks like the form is taking up too little or too much space on the page (as shown in the example below)…

  

• … You need to resize the form. You can resize the form on the Manage Public Forms page

  

• Change the Height and Width

• Then press Embed this form again. This will generate new code and copy it to your clipboard. Embed this new code in your website