Skip to main content
All CollectionsFrequently Asked Questions
How do I use the embedded Contact Form?
How do I use the embedded Contact Form?

Embed your Contact Form on different website platforms like WordPress and Squarespace.

Jan Santos avatar
Written by Jan Santos
Updated over 3 years ago

When you're ready to start taking new leads on your website, and have those leads come directly into Studio Ninja without manual entry, you can use the embedded Contact Form.

To start using the embedded Studio Ninja Contact Form,

  1. Go to Settings

  2. Click on Contact Form in the right column

  3. Click Add new form or edit an existing one

  4. Go through each tab at the top - Build, Style, Configure

  5. Once the form is completed and ready to publish, click Save and Embed

You can now copy and paste the embed code from Studio Ninja to your website platform or Content Management System.

Learn how to embed your Studio Ninja contact form if you are using two of the most popular platforms, WordPress and Squarespace.

WordPress

1. After setting up your Contact Form, click the Copy to Clipboard button to copy the embed code from Studio Ninja.

2. Login to your WordPress Admin Panel, and click Pages in the menu.

3. Find the page where you'd like to add the contact form. You can either:

  • Add a new page, or

  • Edit an existing page

4. Paste the embed code that was previously copied. The steps below are different depending on whether you are using the Default Layout or Advanced Layout editor.

A. If you are using the Default Layout editor:

  • Click the Text tab on the right

  • Paste the embed code in the section where you'd like the Contact Form to appear, and click Save.

B. If you are using the Advanced Layout editor (WordPress custom theme):

  • Go to the Content Elements tab and click the Code Block element

  • Drag and Drop the Code Block to the desired area on your page

  • Click either the Edit Element button to edit the contents OR the entire block.

  • Paste the previously copied embed code into the Content field, and click Save.

5. Once the embed code has been pasted, click Preview in the right-hand-side Publish panel to check how the Contact Form is displaying.

6. If you're happy with how it looks, click Save Draft and Publish to complete the update.

Your Studio Ninja embedded Contact Form is now viewable on your website and ready to take new leads.

SquareSpace

1. Login to your Squarespace account.

2. Click Pages in the menu.

3. Select the page where you want to insert the Contact Form.

4. Click Edit to edit the content on this page.

5. Find an area on the page where the Contact Form should be placed.

6. Click the ‘+’ button to insert.

7. Select the Embed block from the list of components.

8. Click the “</>” button in the popup.

9. Paste the previously copied embed code. Click Set to save.

10. Click Done in the top left corner to check whether you’re happy with the result.

Note: Because the Studio Ninja script is disabled by the Squarespace editor, you may see a "Script Disabled" notification at the bottom which causes a scrollbar to appear on the side.

11. If your website is already set to Public (under Settings > Site Availability), all changes which are Done in the editor will be published live.

If your website is not yet set to Public, then you can go to Settings in the menu, click on Site Availability, and then select Public.

Your Studio Ninja embedded Contact Form is now viewable on your website and ready to take new leads.

Did this answer your question?