Skip to main content

How to use the Widget Editor and add to your Website

Here's how to create a widget and add it to your website

Oz Osbaldeston avatar
Written by Oz Osbaldeston
Updated over 2 weeks ago

Creating a submission form widget allows you to embed a customised form directly into your website. This seamless integration enhances user experience and ensures consistent branding. If you want to use a URL instead of a widget, simply use the Share Link option. Follow these steps to create and implement a submission form widget:

How to Create a Submission Form Widget

Step 1: Access the Widget Option

  1. Navigate to Projects in your Organisation Settings or dashboard.

  2. Select the specific Project for which you want to create a widget for and select the View/Share button.

  3. Click on Generate Widget Code option within the settings menu.

Customise the Widget

  1. Title: Add or edit the widget’s title to match your desired heading or action e.g "Submit Here".

  2. Colors:

    • Text Colour: Choose a colour that aligns with your branding.

    • Background Colour: Select a background colour for the widget.

    • Border Colour: Set the border colour to complement your design.

  3. Layout Options:

    • Radius: Adjust the border radius to control how rounded the widget edges are.

    • Padding: Customise the spacing within the widget.

    • Border Width: Define the thickness of the widget border.

  4. Use the Preview tab to see how the widget will look when embedded on your website.

Generate and Copy the Widget Code

  1. Tick the "Code" box to view the HTML code for the widget.

  2. Click the "Copy Widget Code" button to copy the code to your clipboard.

Embed the Widget on Your Website

  1. Open your website’s HTML editor or CMS (e.g., WordPress, Wix, or Squarespace).

  2. Paste the copied widget code into the desired section of your website (e.g., a sidebar, footer, or dedicated page).

  3. Save and publish your changes.

Final Tips

  • Test the Widget: After embedding, visit your website to ensure the widget displays correctly and functions as intended.

  • Adjust as Needed: Return to the Widget settings to make design tweaks if necessary.

  • Keep It On-Brand: Use colours, fonts, and styles that align with your organisation’s branding.

By creating a widget, you provide users with an interactive and visually integrated way to complete submission forms directly on your website, enhancing convenience and engagement.

Did this answer your question?