Solved

Cart Word in the icon on cart drawer (Focal Theme)

MS-Ecom2024
Excursionist
33 1 9

Can someone fix that quick? 

Bildschirmfoto 2024-01-08 um 15.49.20.png

Its just on mobile view / desktop view is fine.

 

Thanks! 

 

Accepted Solutions (2)

Made4uo-Ribe
Shopify Partner
5133 1226 1500

This is an accepted solution.

Hi @MS-Ecom2024 

It seems like you add some code. To move the bag icon to the right. 

Made4uoRibe_0-1704727123120.png

This is overide code, to take this one you need to find the code in the theme.liquid. But if cant find it you can try this code below. 

From your Shopify admin dashboard, click on "Online Store" and then "Themes".

Find the theme that you want to edit and click on "Actions" and then "Edit code".

In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

 

@media screen and (max-width: 767px){
p.drawer__title.heading.h6 {
    gap: 15px;
}
}

 

If its not working add some !important;

 

@media screen and (max-width: 767px){
p.drawer__title.heading.h6 {
    gap: 15px !important;
}
}

 

And save. 

Made4uoRibe_1-1704727275554.png

The disadvantage of the code I give is you have more space on the left on your icon bag. 

Made4uoRibe_2-1704727333830.png

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

 

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
Need a knowledgeable developer? Come and visit us at

Made4uo.com


View solution in original post

Moeed
Shopify Partner
3580 900 1121

This is an accepted solution.

Hey @MS-Ecom2024 

 

Update your code with this and it should be good then!

.header svg.icon.icon--header-cart {
    left: 15px !important;
    position: relative;
}

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️

View solution in original post

Replies 5 (5)

Made4uo-Ribe
Shopify Partner
5133 1226 1500

This is an accepted solution.

Hi @MS-Ecom2024 

It seems like you add some code. To move the bag icon to the right. 

Made4uoRibe_0-1704727123120.png

This is overide code, to take this one you need to find the code in the theme.liquid. But if cant find it you can try this code below. 

From your Shopify admin dashboard, click on "Online Store" and then "Themes".

Find the theme that you want to edit and click on "Actions" and then "Edit code".

In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

 

@media screen and (max-width: 767px){
p.drawer__title.heading.h6 {
    gap: 15px;
}
}

 

If its not working add some !important;

 

@media screen and (max-width: 767px){
p.drawer__title.heading.h6 {
    gap: 15px !important;
}
}

 

And save. 

Made4uoRibe_1-1704727275554.png

The disadvantage of the code I give is you have more space on the left on your icon bag. 

Made4uoRibe_2-1704727333830.png

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

 

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
Need a knowledgeable developer? Come and visit us at

Made4uo.com


MS-Ecom2024
Excursionist
33 1 9

Hey the code was made for the desktop version because of an word we added. Unfortunately this problem is just for the cart drawer, not the normal front page. Will this code still solve the problem if the adjustment you've send should just be on cart drawer not in general? 

Moeed
Shopify Partner
3580 900 1121

This is an accepted solution.

Hey @MS-Ecom2024 

 

Update your code with this and it should be good then!

.header svg.icon.icon--header-cart {
    left: 15px !important;
    position: relative;
}

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify developer? Chat on WhatsApp


- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
Made4uo-Ribe
Shopify Partner
5133 1226 1500

Yes, this is only in the drawer cart the code said p.drawer. its the selector ive used in your cart drawer. Seems like you didnt atleast try my code. Thanks anyway. 

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
Need a knowledgeable developer? Come and visit us at

Made4uo.com


MS-Ecom2024
Excursionist
33 1 9

Hey, I had bad experiences with a few codes, thats why I ask to be save. Anyway it's also the right code. : )