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. For information on how to integrate SharpSpring and Wix, refer to Wix Integration Overview.

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. For more information on creating forms in SharpSpring, refer to SharpSpring Forms Overview.


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. In a browser tab, log in to Wix.
  2. Locate the desired Wix site to edit.
  3. Click Site Actions > Edit Site.
  4. In the Wix Website Editor window that appears, click  plus2.png  Add > Text.
  5. Click a paragraph element.
  6. Drag-and-drop the element to where the SharpSpring form will be located on the page.
  7. In Wix's top toolbar, click Save.
  8. In Wix's top toolbar, click Publish.
      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. In the Wix Website Editor browser tab, move the cursor off of Publish.
  2. In Wix's top toolbar, hover the cursor over Publish.
  3. Click View Site.
  4. Locate the added paragraph element.
  5. Right-click the element.
  6. Select Inspect.
  7. In the developer console pop-out window that appears, click  devtool.png  Select.
  8. Click the added paragraph element.
  9. Locate the highlighted code in the Elements window.
  10. Above the highlighted code, copy the ID in the parent <div> tag.
  11. Paste the ID in a text editor of your choice.
    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.

Retain the pasted ID. You will need it later.


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. In another browser tab, log in to SharpSpring.
  2. In SharpSpring's top toolbar, click
    Content > Forms.
  3. In the left panel, click
    12cog.png  Options > Manage Forms.
  4. Click the name of the desired form.
  5. On the right side of the form page, click
    12cog.png  Options > Embed Code.
  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. In Wix's top toolbar, click
    Settings > Tracking and Analytics.
  3. Click New Tool > Custom.
  4. Paste the copied SharpSpring form embed code in the Paste the Code Snippet Here text field.
  5. In your text editor, copy the obtained element ID.
  6. In the Wix browser tab, locate the ss_form.target_id = ''; line in the pasted form embed code.
  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?