Discount in cart/minicart by UTD - Development websites and apps best for you!

App Description

Applying a discount code to your shopping cart is critical to boosting your sales rate and good customer service.

Our application provides the ability for users to apply the discount code in the shopping cart and combine discount codes.

Now the user can enter several discount codes and apply them to one basket, the discount amount will be summed up, and the user does not even need to go to checkout!

But if you need the functionality of only one discount code, then we have provided for this, our application can be very flexibly customized to the needs of each seller.

Our application does not store any personal data of buyers and sellers, so you don’t have to worry about them.

Improve your customer service and your sales!

Application functionality:

Functionality of applying discount codes in the shopping cart
Ability to combine discount codes
Full security provided by Shopify
Quick and easy integration
Intuitive user-friendly interface
Fully customizable styling

Demo

See how the app works using the example of a store:

Go to the test store

Link: https://utd-discount-cart-minicart.myshopify.com/

Password: discount

2. Add some items to your cart

3. Open the shopping cart and enter one or more promotional codes:

5DOLLARSOFF, DISCOUNT21, 10PERCENTOFF

4. See how it works, go to checkout.

Installation guide

The installation process consists of choosing a theme where you want to display the application and selecting HTML elements on the page where you want to add your application.

Install app from Shopify App Store.
Choose a plan.
When you find yourself in the application control panel, first of all, select your active theme and save settings.
Now we need to place the application widget in the store. To do this, we have provided several ways:

First way:

Click on the Install application button, and just follow the instructions.

Second way:

If for some reason you did not manage to do this, then install the application manually by placing

<div id=»multi-discounts-form»></div>

in your cart page or minicart, and the application is automatically integrated into this element.

Or specify the DOM element selector where you want to place the widget.

For example:

You want place widget in:

<div id=»some-element”> </div>

On the Selectors page in first input specify: #some-element

Or if you want place discount widget in several places, then specify the items separated by commas.

For example: #some-element,.minicart_some-element

Note:

You also need to specify the ID or class of the element where the final cost of the order is displayed. This is necessary to display the final cost of the order.

To do this, in the application control panel, go to the ‘subtotal selectors’ tab and list the IDs or element classes.

For example:

The final cost of the order is displayed in the item:

<span id=»cart_subtotal»>22.55 </span>

In the ‘subtotal selectors’ field, specify: #cart_subtotal

Or if your final price is displayed in several places, then specify the items separated by commas.

For example: #cart_subtotal,.minicart_subtotal

If you have any difficulties installing the application, please contact us.

5. Now your app is ready to use. To customize the app widget You can go to ‘custom css’ and ‘custom js’.

Uninstallation guide

To uninstall an application simply go to the list of applications in the store and click the ‘uninstall’ button.

Our app does not leave any traces in the store.

If you added the <div id=»multi-discounts-form»> </div> element to your store then remove it.

FAQ

How do I install the app to my store?

Preliminary steps:

1. Activate an app subscription if not already activated. Without an activated subscription, the widget will not appear in your store.
2. Turn on the application.
3. Select the version of the Online Store you are using.
4. Set the desired number of allowable discounts.

Note:
v1.0 — uses the ScriptTag API which uploads javascript code to the store. Can be installed in any place of the store, even in a mini cart.
v2.0 — uses theme app extension for store integration. You can add a widget using the Theme Editor.

Installing the application to the Online store 2.0

Video tutorial

1. Activate the app and select Online store 2.0
2. Go to «Online Store — Themes».
3. Having decided on the site theme you need, open the Theme Editor.
4. Go to the shopping cart page and select the subtotal section.
5. Select Add block and look for the mCart application in the drop-down list.
6. Press ‘Save’ button. Done, widget added.

If you want to display the discounted price to the buyer, you need to specify the element selector in which the subtotal price is displayed in the cart:
7. Specify in the subtotal selectors the ID or class of the element in which the subtotal of the cart is displayed.

Installation the application to the Online store 1.0

Video tutorial

1. In the ‘general’ section select ‘Online Store v1.0’.
2. Click the ‘install application’ button and choose where you want to place the widget.
3. Select with the right mouse button where you want to display the discount form. If you want to install the widget in the mini cart, open it first. With the left mouse button, you can navigate the store or open the mini cart.
4. Select the element that displays the subtotal price in your cart. This is necessary for the application to know where the subtotal item is.
Note:
If the widget doesn’t look right, try selecting other elements or manually insert CSS selectors.

Manual installation in Online store 1.0.

Manual installation is done by inserting CSS selectors in the Selectors section (by ID- # test-block or class — .test-block). If the element to which you want to add the widget does not have a class or ID, then you can manually add a class or ID, or create a new element using the Code Editor. If you want to add to several places at once (for example, to the cart and the mini-cart), then you can specify several selectors, separating them with a comma.
Installation steps:
1. Using the code inspector in your browser, find the element where you want to add the widget.
2. Copy the required selector (class or ID).
3. Go to the ‘Selectors’ section in the admin panel of the application.
4. Insert into ‘Application widget selectors’ the selector of the element where you want to add the application widget.
5. It is also necessary to specify the element selector in which the subtotal price is displayed in the cart.
6. Specify in the subtotal selectors the ID or class of the element in which the subtotal price of the cart is displayed. DON’T FORGET to save your settings.

For example:

You have a block in your cart:

<div id="discount-form"></div>

If you specify

#discount-form

in widget selectors input, the form for applying discounts will be inserted into this element automatically.

The same is with subtotal:

<span id="cart-subtotal">$22.55</span>

You need set

#cart-subtotal

in the subtotal selectors input.

And also try to clear browser cache.

I installed the application, but the form did not appear. What should I do?

Common mistakes
Enable the application in the admin area.
Activate the plan.

For online store v1.0

Make sure you select the correct selectors for the form and subtotal.
Also, check that you have checked the box next to the theme where you want to place the widget.

For online store v2.0

Check if you have added the widget in the theme editor.

I added or edited a discount code, but the application cannot apply it. What to do?

Our application effectively uses the Shopify API to get the information from the store necessary for the application to work. Promotional codes are updated once a minute. Even if a minute has passed, and the promo code is still not applied or works as before, try updating it.

How can I test my application in the development store?

Select and confirm a plan. For development stores, the subscription will be test and you will not be charged.

Can I change the appearance of the form?

Yes, we have provided for this, and to change the appearance, go to the custom CSS section, you can change them to change the appearance of the form. You can also insert JavaScript into the page in the Custom JS tab.

How to use automatic install mode?

Video tutorial

Click the Install application button on general page and select where you want to place the widget — cart or minicart and follow instructions.

Step 1
At this stage, you need to select the element in which you want to place the widget of our application.
You need to select an item using the right mouse button, this is done specifically for the ability to open minicart and navigate the store.

Step 2
Select the item that displays the final price of the order. This is necessary to display the final cost of the order with a discount code.
Do it the same way with the right mouse button.

Step 3
After successfully selecting two items, you will receive a message that the settings have been updated and the page will close. Go to the cart to see the result.

Attention

1. During the installation process, you may receive a message that the element does not match or does not have a class or id. Select another element, set class or id in element what you need, or create a new element.
2. If the widget doesn’t look right, try selecting other elements or manually inserting the CSS selectors.

Does the application store any user data?

No. Our application only processes promo codes, collections, products. It also creates a Draft order for combining promotional codes.

How does the app check for discount codes?

Our application checks promotional codes using the same algorithms as Shopify, all promo code settings will work in our application in the same way as in Shopify checkout.
For example:
If a promo code has a restriction on a certain group of buyers and a user who does not belong to this group will not be able to apply the promo code using our application.

How does setting the maximum number of discounts work?

By dragging the slider, you can adjust the maximum number of promotional codes that your customers can apply.

Obvious mistakes

Please note that the subtotal selector erases all information inside itself, so be careful when setting up the application, the application can remove elements inside the block you specified.

How do I uninstall app from store?

Delete the app from the store. You do not need to delete anything else, our application does not leave anything after deletion.

Do you have questions?

Contact us.
support@utdapp.tech