Solved

Center my Email Pop up on the homepage screen

Sydonie_Baldiss
Tourist
10 0 4

Hello! 

 

I have recently updated my email capturing pop up on the website, but it will not centre on the screen on both desktop and mobile view. It is nesting closer to the top of the page rather than the middle of the page. Can anyone please assist? 

 

email pop up.png

Accepted Solution (1)

ZestardTech
Shopify Expert
5618 1023 1349

This is an accepted solution.

Hi @Sydonie_Baldiss ,

 

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:

.privy-popup-content-wrap {
top: 25%!important;
}
Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing

View solution in original post

Replies 3 (3)

ZestardTech
Shopify Expert
5618 1023 1349

This is an accepted solution.

Hi @Sydonie_Baldiss ,

 

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:

.privy-popup-content-wrap {
top: 25%!important;
}
Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
MooseDesk
Shopify Partner
204 28 65

Hi @Sydonie_Baldiss,

 

Thanks for reaching out to the community with your question. This is MooseDesk - An ideal Helpdesk Solution that aligns perfectly with your Start-up.

 

Regarding to your question, to center your email capturing pop-up on both desktop and mobile views, you will likely need to adjust the CSS of your website. Please follow these steps:

 

1. Go to online store in Shopify Admin > Select Themes > Actions > Edit code
2. Then you can find Asset > base.css. Please paste this at the bottom of the file:

 

.popup {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
/* Additional styles for the pop-up */
z-index: 1000; /* Ensure it's above other content */
}

 

So this is my answer to your question. If this is helpful for you, please let me know by giving MooseDesk a 'LIKE'. If your question is answered please mark this as 'SOLUTION’.

 

 Once again, keep up the fantastic work, and I wish you the best of luck in the future!  😍

Was your question answered? Giving MooseDesk's reply a Like or marking it as an Accepted Solution!


MooseDesk - #All-in-one Customer Support and Helpdesk Solution for Shopify Merchants

Install now. Be our early bird and get all features free forever.

MooseDesk
Shopify Partner
204 28 65

Hi @Sydonie_Baldiss,

 

Thanks for reaching out to the community with your question. This is MooseDesk - An ideal Helpdesk Solution that aligns perfectly with your Start-up.

 

Regarding to your question, to center your email capturing pop-up on both desktop and mobile views, you will likely need to adjust the CSS of your website. Please follow these steps:

 

1. Go to online store in Shopify Admin > Select Themes > Actions > Edit code
2. Then you can find Asset > base.css. Please paste this at the bottom of the file:

 

.popup {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
/* Additional styles for the pop-up */
z-index: 1000; /* Ensure it's above other content */
}

 

So this is my answer to your question. If this is helpful for you, please let me know by giving MooseDesk a 'LIKE'. If your question is answered please mark this as 'SOLUTION’.

 

 Once again, keep up the fantastic work, and I wish you the best of luck in the future!  😍

Was your question answered? Giving MooseDesk's reply a Like or marking it as an Accepted Solution!


MooseDesk - #All-in-one Customer Support and Helpdesk Solution for Shopify Merchants

Install now. Be our early bird and get all features free forever.