Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

Version 1 Current »

First of all, download the zip archive with the two files and extract this zip archive:

  1. wizart-floating-button.js

  2. wizart-entry-point-button.js

Version 7.0

Please enable Developer Mode (click the link to see how). Having activated the Developer mode, download the files of your site. You can see the site.region file (this is your main file). If you are using a template for the Online Store, in this file, you can find the following two necessary strings:

  1. {.equal? collection.typeName "index"} (this is for the Homepage)

  2. {.equal? collection.typeName "products"} (this is for Products)

After extracting the zip archive, add the two files from the zip archive into the ‘scripts’ folder of your site.

  • Integration on the Homepage
    After ‘index’ you need to add the following code:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="application/javascript" src="https://d35so7k19vd0fx.cloudfront.net/production/integration/floating-button.min.js"></script>
<squarespace:script src="wizart-floating-button.js" combo="true" />

On the Homepage, add the token to:

var floatingButton = new window.WFloatingButton({

    token: "your_token",

    element: document.getElementsByTagName("body")[0]

});

Also, you can add settings for your button. Follow these instructions to customize the button.

Be careful, in the default code, there are scripts that add jquery library, please check that you don’t have any errors!

Don’t forget to add the token from your PIM account.

  • Integration on a Product Page
    After ‘products’ you need to add the next code:

<script type="application/javascript" src="https://d35so7k19vd0fx.cloudfront.net/production/integration/entry-point.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<squarespace:script src="wizart-entry-point-button.js" combo="false" />

On a Product Page, add the token to:

var api_token = "your_token";

Also, you can add settings for your button. Follow these instructions to customize the button.

Be careful, in the default code, there are scripts that add jquery library, please check that you don’t have any errors!

Don’t forget to add the token from your PIM account.

Look at the screenshot to see how it should look at the end: (default template) 

Version 7.1+

Unfortunately in version 7.1, Squarespace doesn’t support Developer mode, so you can’t access the code files of your site. However, you can add the code to your site using the default free code injector or a premium one. In the zip archive, you can find the necessary code to insert the custom javascript code. By default use Page Settings > Advanced.

  • Homepage

In the Page Header Code Injection, you need to add:

<script type="application/javascript"   src="https://d35so7k19vd0fx.cloudfront.net/production/integration/floating-button.min.js"></script>

And then the code from the wizart-floating-button.js embedded in the <script> tag.

On the Homepage, add the token to:

var floatingButton = new window.WFloatingButton({

    token: "your_token",

    element: document.getElementsByTagName("body")[0]

});

Don’t forget to add the token from your PIM account.

  • Product Page
    In the Page Header Code Injection, you should add:

    <script type="application/javascript" src="https://d35so7k19vd0fx.cloudfront.net/production/integration/entry-point.min.js"></script>

And then the code from the wizart-entry-point-button.js embedded in the <script> tag.

On a Product Page, add the token to: 

var api_token = "your_token";

Don’t forget to add the token from your PIM account.

  • No labels