move whatsapp button down

Store Design
,
1

Hi, can anyone help me move the whatsapp button down a bit ?
but only for desktop ?

https://ataraj.eu/

Password: sasa

2

Hi @Daniel19901

To complete your requests, please follow these steps:

  1. Go to Shopify Admin > Online Store > Theme > Customize > Theme Settings > Custom CSS https://prnt.sc/i8ljAMlHJUKl
  2. Paste the code provided into the Custom CSS section.
@media screen and (min-width: 768px){
div#chat-bubble {
    bottom: 20px !important;
}
}

Here is the result: https://prnt.sc/6IMY3QMHdhw8

I hope this helps

Best,

Daisy

1 Like
3

Hey @Daniel19901 ,

To move the WhatsApp button down on desktop, you can add custom CSS targeting only desktop views. Here’s how:

  1. Access your theme’s CSS or custom CSS file (often in theme.scss.liquid or base.css).

  2. Add this CSS code:

.whatsapp-widget-upper-left {
    left: 10px;
    bottom: 20px;
}

Save the changes and check the positioning on desktop.

result:

Screenshot 2024-11-09 155216.png
Screenshot 2024-11-09 155216.png1908×885 431 KB

If I was able to help you, please don’t forget to Like and mark it as the Solution!
If you’re looking for expert help with customization or coding, I’d be delighted to support you. Please don’t hesitate to reach out via the email in my signature below—I’m here to help bring your vision to life!

Best Regard,
Rajat Sharma

1 Like
4

Hello @Daniel19901
Go to online store ----> themes ----> actions ----> edit code ----> assets ---->main.css
add this code at the end of the file and save.

.whatsapp-widget-upper-left {
bottom: 75px;
}

result

83.png
83.png691×701 16.7 KB

If this was helpful, hit the like button and accept the solution.
Thanks

1 Like