A Guide on Custom HTML Widget of iCart Cart Drawer Cart Upsell

You do not need any coding knowledge to use iCart. This upsell Shopify app is developed in a way that anyone from a non-technical background can use this app. 

iCart helps you design your slider cart easily with its intuitive drag-and-drop interface, and can increase sales by showing upsells and cross-sells in your cart. 

Out of all the widgets in iCart, one of its best features is custom HTML. With this feature, you can customize your cart in any way you want. 

How Does the Custom HTML Widget Work?

This widget allows you to customize the following options:

  • Settings
  • Title
  • HTML
  • Rules
  • Delete Widget

Settings

Widget Heading

Widget heading settings help to differentiate this particular widget so that you can easily identify any widget from the widget list.

Title

The title is the name of your widget that will be displayed in the cart drawer. You can either show or hide the title and change the heading/widget background color.

HTML

Here in this option, you can add the HTML that you want to add to the side cart drawer. This is where you can add the code and customize this widget in any way possible. 

You can embed different sections into this widget, like: 

  • Festive banners
  • Icons for secure payment 
  • Product videos 
  • Special discounts 

There are certain rules you need to follow to display this widget to the customer.

Rules

Rules are used to display or hide this widget. Once you add the HTML widget, if it follows all the rules, it will display to the customer. This option allows you to change your condition based on different parameters, like:

Parameter

You can display the widget to your customer based on different parameters like cart sum, number of items in the cart, a specific item, a specific collection, product tags, and user location.

Condition

Three conditions need to be followed here:  greater than, less than, or equal.


custom-html-widget

Value

Here you can enter the value that your customer’s cart must contain in the cart. If the value matches the conditions or parameter, your HTML widget will show.

Now, let’s jump into an example to understand how these conditions work. Basically, this Rules option provides you with 2 conditions, i.e, AND, OR. 

First will see how the AND condition works: 

  1. The parameter is the cart sum
  2. Condition is less than
  3. Value is 400 

AND 

  1. A parameter is a specific item
  2. Condition is in the cart
  3. Value is shirt. 

So in this scenario, if both conditions meet the customer’s cart, i.e if his cart sum is less than 400 and one of the items added to his cart is a shirt, then the Custom HTML widget will be visible to the customer.

Similarly, it works for other parameters too in the AND condition. 

Now let’s see how the OR condition works.

  1. Parameter is the number of items in the cart
  2. Condition is greater than
  3. Value is 2 

OR 

  1. A parameter is a specific item
  2. Condition is the only item in the cart
  3. Value is shoes 

So in this scenario, if any of the conditions meet the customer’s cart, i.e the number of items in the cart, the cart item is greater than 2, or the shirt is the only item his cart contains, then the Custom HTML widget will be visible to the customer. 

Remember, after applying any option, click on the Save button. When you add this widget to your side cart, it may look like this, as shown in the image below:

Delete Widget

If you want to delete the widget, then click on the delete widget button.

Final Thoughts: Unlock Full Creative Control Inside Your Cart

The Custom HTML widget in iCart gives you the kind of flexibility you don’t usually get inside the cart. 

Whether you want to add trust badges, embed a video, insert custom messaging, or drop in your own branded elements, this widget lets you build the exact cart experience you want without limitations.

FAQs

1. Can you use HTML in Shopify?

Yes. Shopify themes are built with Liquid templates that include HTML/CSS/JS, and you can add or edit HTML directly in your theme files.

2. Which is the best app for cart customization?

There’s no single “best” for every store, but leading option in 2025 is iCart Cart Drawer Cart Upsell for its ease of use.

3. How to customize a Shopify app?

Most merchant-side “customization” happens through app settings, theme app blocks, and app embeds in the theme editor, which let you place or style an app’s components without coding. If the app uses Theme App Extensions, you activate and configure those blocks/embeds from the theme editor—or via a deep link provided by the app. 

4. Can you add upsells in Shopify in the cart?

Yes. With cart-drawer apps like iCart, you can add upsells in the cart during the pre-purchase phase. 

5. How to customize my checkout on Shopify?

If you are on Shopify Plus, it unlocks Checkout Extensibility/UI extensions for deeper changes (checkout blocks, advanced styling). If you need checkout-stage upsells or complex elements, use Plus-compatible apps like SellMore.

About the author

Sajini Annie John

Meet Sajini, a seasoned technical content writer with a passion for e-commerce and expertise in Shopify. She is committed to helping online businesses to thrive through the power of well-crafted content.