discount code section, how to expand automatically

Technical Q&A
,
1

Hello Shopify Community,

I need your assistance with a specific issue on my Shopify store. Currently, customers are having difficulty locating the discount code section, during the checkout process, as currently the show order summary section does not expand unless clicked, which would then show the discount code section.

To enhance user experience and make it easier for customers to find it, I would like to implement an automatic expansion feature. This means the order summary box would be expanded by default on the checkout page.

I have tried modifying the code myself but haven’t achieved the desired result. I’m reaching out to the community for guidance on how to accomplish this automatic expansion of the order summary box.

If you have any insights, suggestions, or code snippets that can help me achieve this goal, I would greatly appreciate your assistance.

My store’s URL is: https://doubleupldn.com/

Thank you for your time and support.

1 Like
2

@acorleone

oh sorry for any issue can you please share more details further issue also share screenshot

3

I would like the show order summary during checkout stage to expand automatically. Currently it only expands on click. So many customers miss the area to enter discount code. My url is doubleupldn.com

4

IMG_8642.png
IMG_8642.png828×1792 136 KB

IMG_8643.png
IMG_8643.png828×1792 143 KB

1 Like
5

Hi @acorleone ,

This is Ricardo from InventoryHero app, I was checking out your site and it looks great! Congrats for that.

Regarding your question, one really quick solution I just came to was changing the type of the element shown in the screenshot from button to label, also removed the arrow icon and now the order summary is displayed everytime. This can be a temporary solution until you can get to a final solution.

order summary.png
order summary.png794×684 37.4 KB

This is how the code looks like

In case you may be interested, at InventoryHero we work focused on Automatically Discount Weak Inventory, right now we’re offering a 3-month free promotion, let me know if we can schedule a meeting to explain it a little bit more.

Thank you!

  • Is my reply helpful for you? If so, please click Like to let me know!
6

Thanks for your message. Where would I paste this code?

7

I could do it through the DevTools on my browser, here you are some instructions that hopefully will help you out

1.png
1.png3052×1888 733 KB

2.png
2.png3042×1888 780 KB

  • Is my reply helpful for you? If so, please click Like to let me know!
8

@acorleone

thanks for details

checkout page customization allow only Shopify plus plan without that plan not possible

9

Hello @acorleone , did you manage to find a solution ? thanks

1 Like