How to Install Justuno on Bigcommerce Blueprint Themes

Instructions for installing Justuno on Bigcommerce store equipped with a Blueprint Theme (in lieu of a Stencil Theme)

If you are using a Stencil theme please use this article

At a Glance:

1. Instructions for General Embed code

2. Adding the cart code (optional but recommended)

3.Adding Cart Conversion tracking script (optional but recommended)

4. FAQ

 

Instructions for General Embed code:


1. Go to your Bigcommerce store and find the apps section on the left then hit marketplace. Only the BigCommerce store owner will have access to install a new app.

 

LWR_Recording (9)



2. Enter the BigCommerce app Marketplace and search for the Justuno app. Once you have found it click 'install'. 
More details on installing an app within the BigCommerce app store can be found here:

Installing an app within the BigCommerce app Marketplace

3. You will then be prompted with the create account form.

If you already have an account, please click 'sign in' at the bottom and you can get logged in with your existing Justuno credentials. 


Here is what this page will look like:

BCinstall2



4. When you are logged into your Justuno account head to the settings section on the bottom left hand corner and select 'embed code'

LWR_Recording (10)

Your Embed Code will be found at the top of this page:

bcinstall3


4. Go back to your Bigcommerce dashboard and find Storefront Design. Under Design Options head to the themes tab and click HTML/CSS options

Edit HTML/CSS in themes section



5. Once you are in the html editor head to the left hand side and in the upper section scroll down till you find footer.html.

find footer.html



6. Paste the embed code on the bottom of the footer html page. Hit save and your all set! You can now use the app store to get into your Justuno Dashboard! Important note: Deleting your app within Bigcommerce does not cancel your account! You must walk through canceling your account within Justuno to ensure that billing will stop.

Where embed code should go




Adding the cart code (optional but recommended) 

Please follow the below instructions to enable visitor cart tracking for use with promotion rules and personalization.

Copy the following code into the template snippet called CartItem.html

<script type="text/javascript">
// Justuno related cart capture code
var ju_cart_arrary = ju_cart_arrary || [];
var juitem_pid = %%GLOBAL_ItemId%%;
var juitem_pr = parseFloat(('%%GLOBAL_ProductPrice%%').replace('$',''));
var juitem_prtotal = parseFloat(('%%GLOBAL_ProductTotal%%').replace('$',''));
var juitem_qty = Math.ceil(juitem_prtotal/juitem_pr);
var juitem_nm = "%%GLOBAL_ProductName%%";
ju_cart_arrary.push({ itemid: juitem_pid, quantity: juitem_qty, price: juitem_pr, name: juitem_nm });
</script>
Find CartItem.html

Copy the following code into the template file called Cart.html

<script type="text/javascript">
var ju_cart_arrary = ju_cart_arrary || [];
window.juapp=window.juapp||function(){(window.juapp.q=window.juapp.q||[]).push(arguments)}
juapp(
'cartItems',
'',
ju_cart_arrary
);
</script>
Cart code image

 

If you are using the "Show Cart Suggestions" feature in your Bigcommerce store.

Copy the following code into the template file called FastCartThickBoxContent.html located in the Snippets folder.

<script>
window.juapp=window.juapp||function(){(window.juapp.q=window.juapp.q||[]).push(arguments)}  
try {
    
    // first parse the img html to get item ID
    var ju_item_img_html = '%%GLOBAL_fastCartProdImg%%';
    var ju_item_name_html = '%%GLOBAL_fastCartProdLink%%';
    var juitem_pid = ju_item_img_html.substring(ju_item_img_html.lastIndexOf("/products/") + 10, ju_item_img_html.lastIndexOf("/images/"));
    var juitem_nm = ju_item_name_html.replace(/<[^>]+>/g, '');
var juitem_qty = %%GLOBAL_fastCartQuantity%%;
var juitem_pr = parseFloat(('%%GLOBAL_fastCartProdTotal%%').replace(/[^\d.-]/g, ''))/juitem_qty;

    juapp(
      'cartItemAdd',
      juitem_pid,
       {
        name:juitem_nm,
        quantity:juitem_qty,
        price:juitem_pr
       }
    );
} catch(e){}
</script>​
Other template files

 

 

Adding Cart Conversion tracking script (optional but recommended)

Please follow the below instructions to enable conversion tracking for use with promotion rules and analytics.

Copy the following code into the "Advanced Settings" > "Affiliate Conversion Tracking" section of your Bigcommerce dashboard underneath the code you just copied from above.

<script type="text/javascript">
window.juapp=window.juapp||function(){(window.juapp.q=window.juapp.q||[]).push(arguments)}
juapp(
'order',
'%%ORDER_ID%%',
{total:%%ORDER_AMOUNT%%,subtotal:%%ORDER_SUBTOTAL%%,currency:'USD'}
);
</script>

 

affiliate conversion tracking

 

FAQ:

Why am I still seeing the message "No conversion tracking code found on site"?

If the embed code is not detected within Justuno, please refresh your dashboard and the notification will go away! It can take up to 24 to 48 hours for the code to be detected. 

It will also persist if there are no conversions associated with the promotion within the specified time frame.

 

How do I install in Stencil?

For stencil themes, you will only need to add the Justuno app within the BigCommerce app marketplace and this will install Justuno along with the cart code and conversion tracking automatically! No additional steps will be needed
More details can be found here: Installing Justuno on a BigCommerce Stencil theme

 

I cannot install the Justuno app within BigCommerce

  • Make sure that the user that is trying to install the app is logged in as the owner as only the owner can install a new app in BigCommerce
  • Try clearing your cache or opening again in an incognito window as sometimes this will cause app installation issues. You may also try to login a different browser and see if this will install the app successfully.