How to customize the Shipped widget?

If you would like to update the default settings for the Shipped widget, such as enabling Shipped Green, you need to add an additional script to your online store.

The reason for this is to maintain optimal speed for Shipped widget. Other companies add this setting in their merchant dashboard, but it greatly reduces the speed and therefore impacts conversion.

Use the following properties and instructions to update the Shipped widget default settings.

Properties

Properties	Description	Syntax *( represents the default setting)**
Shipped Green	To enable or disable Shipped Green offer to your customers	Enable: `isGreen: true,` Disable*: `isGreen: false,`
Shipped Shield	To enable or disable Shipped Shield offer to your customers	Enable*: `isShield: true,` Disable: `isShield: false,`
Widget Default State (Advanced)	Set Shipped Shield/Green widget default to opt-in state. Shipped Shield/Green is automatically added to the order.	Enable* (Recommended): `isOffByDefault: false,` Disable: `isOffByDefault: true,`
For Merchant Paid (Advanced)	Only show information about Shipped Shield/Green; customers will not be able to add or remove Shipped Shield/Green from their orders. If you have enabled Merchant Paid setting and only want to pay for Shipped Shield/Green when a customer has declined the offer, keep this set as disabled.	Enable: `isInformational: true,` Disable*: `isInformational: false,`
Mandatory Opt-in (Advanced)	Customers are required to add Shipped Shield/Green; they will not be able to remove Shipped Shield/Green from their orders.	Enable: `isMandatory: true,` Disable*: `isMandatory: false,`

Creating the Shipped configuration code

<script>
      shippedConfig = {
        "the appropriate properties from above"
        }
</script>

For example, if you have Shipped Green enabled, the code would be the following.

<script>
      shippedConfig = {
        isGreen: true,
        }
</script>

Inserting the Shipped configuration code

Shopify

From the left menu navigation, go to Online Store > Themes.
In the "Live theme" section, location "Actions" dropdown and select "Edit code".
Select theme.liquid
Right before </head>, add in the Shipped configuration code.
Click "Save".

Shopify Plus

From the left menu navigation, go to Online Store > Themes.
In the "Live theme" section, location "Actions" dropdown and select "Edit code".
Select checkout.liquid
Right before the Shipped widget code you've added, insert the Shipped configuration code.
Click "Save".

BigCommerce

Basic widget settings can be customized in the Shipped widget settings. For customizations not listed in merchant admin, use the following instructions to create a script.

From the left menu navigation, go to Storefront > Script Manager.
Select "Create script".
Name of Script: shippedConfig
Location on page: Head
Select pages where script will be added: Checkout
Script category: Functional
Script type: Script
Script contents: Enter the Shipped configuration code
Click "Save".

We're here to help if you need any assistance, just send us a request at support@invisiblecommerce.com.

Categories

Categories