Style 'Out Of Stock' Popup – Vantage Theme

Solved
Highlighted
Excursionist
16 0 5

Hi all,

I'd like to apply some basic styling to the popup that appears when a customer tries to add more quantity of a product to their cart than is in stock.

Current popup:

Screen Shot 2020-08-22 at 12.04.47 pm.png

I'd simply like to remove the red icon, alter the copy, and potentially change the bg colour and add a border.

The issue I'm having is being able to locate the popup in my liquid files to be able to edit it. I'm using Vantage theme.

Thanks!

 

 

1 Like
Highlighted
Shopify Partner
7473 1034 2599

Hello, @katia-g 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
1 Like
Highlighted
Excursionist
16 0 5

Hi @Ketan ,

 

The site URL is navytraderco.com.au / navy-trader-co.myshopify.com.

 

It is, however, behind password protection. Let me know the best way to help give you access to the page.

 

Cheers,

Katia. 

0 Likes
Highlighted
Shopify Partner
7473 1034 2599

@katia-g 

Thanks 

sorry but your store is password protect can you please share us 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
1 Like
Highlighted
Excursionist
16 0 5

PW: artaor

Thanks @KetanKumar 

0 Likes
Highlighted
Shopify Partner
7473 1034 2599

This is an accepted solution.

@katia-g 

Thanks 

1. Go to Online Store->Theme->Edit code
2. Asset->/stylesheet.css->paste below code at the bottom of the file.

.swal2-icon.swal2-error {
    display: none !important;
}
.swal2-popup {
border: 2px solid;
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
1 Like
Highlighted
Excursionist
16 0 5

Thanks so much @KetanKumar I've applied that and styled it successfully! 

Second part of the question: do you know how I can edit the text used in the heading and description?

Cheers!

0 Likes
Highlighted
Shopify Partner
7473 1034 2599

@katia-g 

Yes, 

It can be done by doing some code customization. please send me a personal message and we can discuss what you'd like

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
1 Like