Skip to main content

How to Set up the Website Widget to Collect Contacts

How to configure the website widget in your Check This Out account to collect guest phone numbers for text marketing through your website.

N
Written by Nicholas Wickes
Updated over a week ago

  1. Log into your Check This Out account

  2. From the left-side menu, click Settings.

  3. At the top of the settings page, click Integration. You’ll see a set of configuration options for your website widget.

  4. Modify the “headline”. This is the title message guests see when the widget appears.

  5. Select your brand colors by clicking on the colored rectangles.

    1. Use the color dropper to match your brand’s palette or type in color code for:

      1. Button color

      2. Button text color

      3. Background color

6. Introductory Text: Update the widget pop-up body text prompting visitors to enter their number on your site.

7. Success Message: Customize the confirmation message that appears after a visitor completes phone verification.

8. Choose Display Option

  • Button Widget: Static button guests click to open the form.

  • Auto Popup: Automatically appears when users scroll on your homepage.

9. Always click Update after making changes to save your widget configuration.

10. Copy the HTML code snippet provided.

11. Paste this code into the header of your website.

  • Can be done via platforms like Squarespace, WordPress, or Wix.

  • Ask your developer or website manager if unsure.

How to add CTO Website Widget code to Wix, Wordpress, and Squarespace

This outlines general instructions for adding the Check This Out HTML code to your website through Web Development Platforms. These platforms can be tricky and instructions may differ based on platform subscription levels. If you are running into issues with uploading this code please reach out and we will troubleshoot with you.

How to add Website Widget code to Wix

  1. Go to Settings in your site's dashboard.

  2. Click the Custom Code section.

  3. Click + Add Custom Code at the top right.

  4. Paste the HTML code snippet in the text box.

  5. Enter a name for your code.
    ​Tip: Give it a name that is easy to recognize so you can quickly identify it later. (eg. CTO Widget)

  6. Select from two options under Add Code to Pages:

    1. All pages: This adds the code to all of your site's pages, including any new pages that you create in the future.

      1. Choose whether to load the code only once per visit, or on each page your visitor opens.

    2. Choose specific pages: Use the drop-down menu to select the relevant pages.

  7. Place your code under Place Code in:

    1. Head - Choose this for the Website Widget.

    2. Body - start

    3. Body - end

  8. Click Apply.

Please note: These instructions may differ based on platform subscription levels. If you are running into issues with uploading this code please reach out and we will troubleshoot with you.

How to add CTO Website Widget code to Wordpress

  1. Go to your Site Home

  2. Click Plugins

  3. Search "Insert Headers And Footers"

  4. Paste the HTML script into the Head

  5. Done

Please note: These instructions may differ based on platform subscription levels. If you are running into issues with uploading this code please reach out and we will troubleshoot with you.

How to add CTO Website Widget code to Squarespace

  1. Go to Settings in your site's dashboard.

  2. Click the Search Icon in the top right corner of the pop-up

  3. Search “Code Injection”

  4. Paste script into the section titled Head

  5. Click Save then exit

Please note: These instructions may differ based on platform subscription levels. If you are running into issues with uploading this code please reach out and we will troubleshoot with you.

Did this answer your question?