Skip to content

Install SparkLayer on Wix

Applies toWix

Setting up SparkLayer on Wix

Before you start

Site members, SKUs, payments and shipping in Wix
(this flows forward)

Install

Add the app and create your SparkLayer account
(this flows forward)

Connect

Label B2B contacts so they sync
(this flows forward)

Widgets

Added for you; match them to your brand
(this flows forward)

Next steps

Prices, customer groups, a test order, launch

New to SparkLayer? How SparkLayer works explains the basics, and Storefront widgets shows what the widgets do.

What happens after you install

You don't need a developer. Once you've installed the app, invite our team as a collaborator and we complete the storefront install for you: B2B pricing and the buy widget on product pages, the B2B My Account area and the B2B cart. You do the rest in your Wix dashboard and the SparkLayer Dashboard. Two optional extras use code: CSS to match your brand, which you can copy from our example, and JavaScript options, which are marked "for your developer".

Before you start

Check these in your Wix dashboard before you install. It's also worth reading Wix limitations.

  • Site members allowed. B2B customers sign in as site members. Go to Settings,Site Member Settings,Signup & Login Security and, under Who can be a site member, choose Everyone who signs up.
  • A unique SKU on every product you sell to B2B customers. SparkLayer stores B2B prices by SKU, so a product without one can't be bought. See Add SKUs to your products.
  • A payment method set up in Settings,Accept Payments.
  • Shipping rules set up in Settings,Shipping and Delivery, so orders can be placed.

Once SparkLayer is running, you'll mostly use three areas of Wix: Catalog,Store Products,Products for products and SKUs, Customers & Leads,Contacts for B2B customers, and Sales,Orders for B2B orders.

Add SKUs to your products

  1. In Wix, go to Catalog,Store Products,Products and open a product. The product list has a SKU column, so you can spot products without one.
  2. For a product without variants, enter a SKU in the Inventory and shipping section.
  3. For a product with variants (such as colour or size), turn on Manage pricing and inventory for each product variant. Then edit the variants in the Product variants section, enter a different SKU for each variant and click Apply.
  4. Save the product.

To add SKUs to many products at once, use Wix's product import or bulk edit.

Install SparkLayer

Add the app from the Wix App Market, then create your SparkLayer account.

  1. Open the SparkLayer for Wix app (opens in a new tab) in the Wix App Market. Or, in Wix, go to Apps,App Market and search for SparkLayer.
  2. Add the app and choose the Wix site to install it on.
  3. Create your SparkLayer account: enter your Email Address, Full Name, Company Name, Company Website and a Password, then click Create Account. If you already have an account, sign in instead.
  4. Keep a note of the email address and password. You'll use them to sign in to the SparkLayer Dashboard (opens in a new tab).
  5. Confirm the SparkLayer billing plan in Wix to start your free trial. Billing for SparkLayer runs through your Wix account.

Connect your store

SparkLayer connects to your Wix store as soon as you install the app. It then syncs your products, and every contact with the b2b label, from Wix. To finish connecting, mark your B2B customers.

To see your progress, open the app in Wix at Apps,Manage Apps (it's listed as SparkLayer B2B & Wholesale). It shows Your Wix store is connected to SparkLayer, the setup tasks still to do, and a Go To Dashboard button.

In the SparkLayer Dashboard, click Open Setup on Home (opens in your SparkLayer Dashboard in a new tab) to see the steps still to do. Integrations,Platform (opens in your SparkLayer Dashboard in a new tab) shows Wix as Your platform.

If the SparkLayer Dashboard shows We need you to confirm your SparkLayer plan, you can carry on setting up.

Mark customers as B2B

SparkLayer only syncs Wix contacts with the b2b label. Each customer must also be a site member, so they can sign in.

  1. In Wix, go to Customers & Leads,Contacts. Click Create New to add a contact, or open an existing one.
  2. Make sure the contact has a name, email address and a complete address, with every address field filled in. Keep a note of the email address: the customer signs in with it.
  3. Under Labels, click Add Label, type b2b and click Add.
  4. For a customer in a customer group other than the base customer group, add that group's label too. It's b2b- followed by the group's handle, as shown on the group's page at Customers,Groups (opens in your SparkLayer Dashboard in a new tab). For example, a VIP customer has the labels b2b and b2b-vip.
  5. Under Member info, click Set Contact as Member. Wix emails the customer a Create New Password link, and their member status changes to Site Member. Customers can also use Forgot password? on your store's sign-in page.

Once you've created a label in Wix, don't edit it. See Wix limitations for how Wix handles a renamed b2b label.

Addresses sync once

When a contact is labelled b2b for the first time, SparkLayer copies their address once. If a required field (such as name, address line or postcode) is missing, the address isn't synced at all, and no sync error is logged. After that, address changes in Wix don't sync to SparkLayer, and changes in the customer's SparkLayer address book don't sync to Wix.

Check a customer has synced

  1. In the SparkLayer Dashboard, go to Customers (opens in your SparkLayer Dashboard in a new tab).
  2. Search for the customer by name or email.
  3. If they're listed, they've synced. Click View to check their details: under Identifiers, the Platform ID is their Wix contact ID, the one at the end of the contact's page URL in Wix, after /contacts/view/.

If some customers couldn't sync, a banner at the top of Customers (opens in your SparkLayer Dashboard in a new tab) says so: click Show errors to see who and why. See Product and customer sync for more.

Add the widgets

On Wix, our team completes the storefront install for you: B2B pricing and the buy widget on product pages, the B2B My Account area and the B2B My Cart. There's no code for you to add. When a B2B customer signs in, product pages show their B2B prices and a way to order. See Storefront widgets for what each widget does.

If prices disappear when a B2B customer signs in, the storefront install probably isn't complete. Check you've invited our team, or contact us.

Invite our team as a collaborator

To let us complete the install, invite us to your Wix site:

  1. In Wix, go to Settings,Roles & Permissions and click Invite collaborators.
  2. Enter our support address, support@sparklayer.io.
  3. Give us these roles: Website Manager, CMS Editor, Marketing Manager and Customer Relations Manager.
  4. Send the invite, then let us know through support.

If the invite doesn't reach us, create an invite link in the same place and send it to us instead.

Match the widgets to your brand (optional)

The widgets work as they are, with generic fonts and colours. To use your own colours and fonts, add a short piece of CSS (style code) to your site. Copy the example below and change the colours and font names, or ask your developer. Our support team can also help.

How you add the CSS depends on your editor. For the full list of variables, see Customising the design.

  1. In your Wix dashboard, go to Settings,Custom Code and click Add Custom Code.
  2. Paste the CSS into Paste the code snippet here and give it a Name.
  3. Under Add Code to Pages, choose All pages and Load code on each new page.
  4. Save the code. It's listed under Head with Applied on: All pages, and you can edit it at any time.

Next steps

Once your customers are syncing, set up your prices and rules in the SparkLayer Dashboard.

  1. Create a price list. Go to Pricing,Price lists (opens in your SparkLayer Dashboard in a new tab) and click Create price list. Enter a Name, a Handle and the Currency, then save. You can't change the handle or currency later. See Managing pricing.

    More detail

    For prices worked out from Wix, tick Enable automatic pricing and choose Wix Default Price as the Pricing source. Then tick Apply a percentage variation and set it, for example 50% Decrease. Depending on your Wix tax setup, SparkLayer can also allow for tax when it works out automatic prices.

    For exact prices, upload a CSV instead. This also lets you set quantity pricing.

    When you create the price list, you're asked whether to assign it to your default B2B customer group. You can change this later.

  2. Set up your customer groups. Go to Customers,Groups (opens in your SparkLayer Dashboard in a new tab). The base customer group, with the label b2b, applies to every B2B customer. At a minimum, assign it a price list; you can also choose its payment methods and order limits. To give some customers different rules, click Create customer group and add the new group's label to those contacts in Wix. You can manage a group's rules once at least one customer is in it. See Customer groups.

  3. Place a test order. Sign in to your store as your test B2B customer and open a product that has a SKU. You should see your B2B prices. Add items, check out, and try each payment method you offer. The order appears in Sales,Orders. See How B2B orders arrive in Wix.

  4. Invite your customers. Work through the steps at Home,Setup (opens in your SparkLayer Dashboard in a new tab), then let customers know. Open a contact in Customers & Leads,Contacts and send a message from the Inbox tab, or select several contacts and click Send Email Campaign. The Launch checklist has example messages.

These steps match Get started on other platforms. When you're ready to go live, work through the launch checklist:

How B2B orders arrive in Wix

Every order goes to Sales,Orders in Wix. Its payment status depends on the payment method the customer chose:

Payment methodWhat the customer doesOrder in Wix
Pay on AccountChecks out without entering payment details.Unpaid. Mark it as paid once you've received payment.
Pay by InvoiceChecks out without entering payment details.Unpaid. Mark it as paid once you've received payment.
Pay Online by CardGoes to the Wix checkout and pays straight away, with any payment method you've set up in Wix (such as card or PayPal). Sometimes called pro-forma payment.Paid, ready to fulfil.
Request for QuoteSubmits the order without choosing a payment method.Unpaid. Mark it as paid once you've received payment.

In customer groups, Pay Online by Card is called Card at checkout, Pay by Invoice is Pay by invoice and Pay on Account is Payment on account.

Every order placed through SparkLayer also gets the tag b2b in Wix. Use it to filter orders, segment them or trigger automations.

More settings on Wix

Pre-orders and pre-order limits

SparkLayer supports pre-orders (also called back orders) on Wix, so B2B customers can order products that aren't in stock yet. You turn them on for each product in Wix.

  1. In Wix, open the product and turn on Track inventory.
  2. Turn on Pre-order.
  3. Optionally, enter a Pre-order message, such as "Back order", to tell customers when the product will ship.
  4. Under Pre-order limit, choose No limit, or Limit to and enter a number, such as 50. On a product with variants, the limit applies to each variant.

B2B customers then see a pre-order message on the product page and can buy the product. See Stock display for how SparkLayer shows stock.

Wix Payments only supports pre-orders that are delivered within 12 months of purchase and aren't part of a crowdfunding campaign.

Tax

SparkLayer uses the tax rules you've set up in Wix. To choose how tax is charged at checkout, go to Settings,Tax. Under How would you like to collect tax?, choose Tax should be added at checkout or Tax is already included in my prices. See Wix's guide to including tax in the product price (opens in a new tab).

SparkLayer shipping

By default, B2B orders use your Wix shipping methods. To use SparkLayer's own shipping rules instead:

  1. In Wix, go to Settings,Shipping, Delivery & Fulfillment. You need at least one shipping region, such as the UK or USA.
  2. Click Manage Your Apps below the shipping region.
  3. Turn on Spark Layer Shipping and click Save.
  4. In the SparkLayer Dashboard, go to Settings,Shipping (opens in your SparkLayer Dashboard in a new tab), tick Use SparkLayer shipping rates and create your shipping methods. See Shipping rules.

Sales agents

Sales agent ordering works on Wix, so your sales team can sign in and place orders for B2B customers. Sales agents need the Starter plan or above: Starter includes 1, Growth 2 and Pro 5.

  1. Set the sales agent up as a Wix contact with a complete address and the b2b label, so they sync to SparkLayer.
  2. In the SparkLayer Dashboard, go to Customers,Agents (opens in your SparkLayer Dashboard in a new tab) and click Add sales agent.
  3. Choose the contact under Customer, then choose a Role:
    • Sales agent: can place orders and manage addresses, shopping lists and company access on behalf of customers.
    • Sales administrator: all sales agent permissions, plus editing order prices and creating new customers.
  4. Click Add agent.

JavaScript options (for your developer)

JavaScript options are small scripts that change how the widgets behave. You don't need any of them to get started. Some settings are made in JavaScript, using Spark Options.

On Wix, add them in Settings,Custom Code: click Add Custom Code and paste in the script. Each example below sets window.sparkWixOptions, so if you use more than one, combine their settings into one script.

window.sparkWixOptions accepts the same options as the Core Script's window.sparkOptions, where Wix supports them. Use the exact option names from Core Script options. For example:

OptionWhat it does
termsAndConditionsLinkThe link to your terms and conditions at checkout.
checkoutCustomElementsExtra fields at checkout, such as a delivery date.
accountRedirectWhere to send signed-in customers who open a matching page.
displayDisplay settings, such as darkTheme.
translationsYour own wording for SparkLayer's text, by language. See Languages and international.
languageThe language SparkLayer uses.
paymentMethodsOrderThe order payment methods are shown in.
cartRedirectWhere to send signed-in customers, with the cart open.

FAQs and troubleshooting

Was this page helpful?

Last updated