Articles in this section

Adding SharpSpring Forms to Wix Sites

Avatar
Jon Walker
  • Updated
Follow
Wix is a website development platform that allows for many different external integrations.

You can add SharpSpring forms to your Wix sites.

This article will detail how to add SharpSpring forms to Wix sites.


Article Contents

     Available with:    
  Marketing Automation ✓  
  CRM Ultimate ✓  
  CRM PRO ✓  
  CRM Free ✓  
       
  Toolbar:    
01NavMarketing.png
       
  Users:    
  Administrators ✓  
  Company Managers ✓  
  Marketing Managers ✓  
  Sales Managers    
  Salespersons    
  Jr. Salespersons    
 


Integrating SharpSpring with Wix

Before you can add a SharpSpring form to Wix, you will need to integrate SharpSpring and Wix. This requires creating a Wix site and utilizing SharpSpring tracking code. Refer to Wix Integration Overview for information on how to integrate SharpSpring and Wix.

Be aware that, in order to integrate Wix with SharpSpring, you will need to have a premium package with Wix. If you do not have a premium package with Wix, you will be unable to utilize code on Wix sites.


Creating SharpSpring Forms

After you have integrated SharpSpring with Wix, you can begin adding SharpSpring forms to Wix. This requires that you first create a form in SharpSpring. Refer to SharpSpring Forms Overview for more information on creating forms in SharpSpring.


Adding Elements to Wix Sites

You can add SharpSpring forms to Wix sites.

There is no direct way to add the form, and forms will need to be recoded from text elements that are placed onto the Wix site.

To add elements to a created Wix site, do the following:

  1. Open a new tab in your browser.
  2. Log in to Wix in that browser tab.
  3. Locate the desired Wix site to edit.
  4. Click Site Actions > Edit Site.
  5. Click  plus2.png  Add > Text in the window that appears.
  6. Click a paragraph element.
  7. Drag-and-drop the element to where the SharpSpring form will be located on the page.
  8. Click Save in Wix's top toolbar.
  9. Click Publish in Wix's top toolbar.
      Click to enlarge.
Important: Though you can add any element, SharpSpring recommends using a paragraph text element. Other elements may run into coding issues. Use other elements at your own discretion.
 
Note: When adding text elements, consider entering text into the element that states that the form will go in the element. This provides a way to keep this element from being erroneously modified in the future.
 


Obtaining Element IDs

Once an element has been placed on the Wix site, you will need to obtain its particular ID. This ID will later be used to display the form in the element itself.

To obtain a Wix site element's ID, do the following:

  1. Move the cursor off of Publish in the Wix Website Editor browser tab.
  2. Hover the cursor over Publish in Wix's top toolbar.
  3. Click View Site.
  4. Locate the added paragraph element.
  5. Right-click the element.
  6. Select Inspect.
  7. Click  devtool.png  Select in the developer console pop-out window that appears.
  8. Click the added paragraph element.
  9. Locate the highlighted code in the Elements window.
  10. Copy the ID in the parent <div> tag above the highlighted code.
  11. Paste the ID in a text editor of your choice.

Retain the pasted ID. You will need it later.

    Click to enlarge.
Note: SharpSpring offers Professional Services to assist with custom coding.
Note: When copying the element ID, do not copy the quotation marks.

 


Obtaining SharpSpring Form Embed Codes

The element ID needs to be added to a SharpSpring form embed code for the form to display on Wix sites. This requires that you first create a SharpSpring form.

To locate a created form's embed code, do the following:

  1. Open a new tab in your browser.
  2. Log in to SharpSpring in that browser tab.
  3. Click Forms in SharpSpring's left toolbar.
  4. Click the name of the desired form.
  5. Click  12more.png  Actions > Embed Code on the right side of the form page.
  6. Copy the embed code.
   Click to enlarge.


Modifying SharpSpring Form Embed Code in Wix

Once you have the Wix site element ID and the SharpSpring form embed code, you can merge the two together into one code. This code will then automatically display the desired SharpSpring form at the location of the inserted element on the Wix site.

To add SharpSpring form embed code and target element IDs to Wix, do the following:

  1. Return to the Wix Website Editor browser tab.
  2. Click Settings > Tracking and Analytics in Wix's top toolbar.
  3. Click New Tool > Custom.
  4. Paste the copied SharpSpring form embed code in the Paste the Code Snippet Here text field.
  5. Copy the obtained element ID in your text editor.
  6. Locate the ss_form.target_id = ''; line in the pasted form embed code in the Wix browser tab.
  7. Remove the two forward slashes // on the ss_form.target_id = ''; line.
  8. Paste the element ID within the single quotation marks '' on the ss_form.target_id = ''; line.
  9. Enter a name for the pasted embed code in the Name text field.
  10. Leave the Add Code to Pages and Place Code In sections as their default settings.
  11. Click Apply.
  12. Close the Tracking Tools and Analytics modal window.
   Click to enlarge.
Note: Keep the code name simple, such as SharpSpring Form Code.

After you have successfully entered and modified the form embed code, you can move the paragraph element as needed.

While it appears as a text block in the Wix Website Editor, it will appear as the desired SharpSpring form on the live page.

Related articles

×

Why was this help article not helpful?

Still didn't find what you are looking for?