Cart page widget removal

Store Design
1

Good Afternoon,

Does anyone know how to hide all of icons on the cart page to ensure that its clean and cleared for a more efficient checkout.

Website: https://www.yonicque.com

IMG_6166
IMG_61661170×2532 402 KB

1 Like
2

To hide all icons on the cart page only for mobile. You have to use below CSS:

@media (max-width: 768px) {
/* Hide Smile app /
body.template-cart #smile-ui-lite-container {
display: none;
}
/ Hide Shopify chat widget /
body.template-cart #shopify-chat {
display: none;
}
/ Hide spin wheel app /
body.template-cart .needsclick {
display: none;
}
/ Hide audio widget */
body.template-cart #rams-widget {
display: none;
}
}

If the above CSS does not work, then use the version below with !important

@media (max-width: 768px) {
/* Hide Smile app /
body.template-cart #smile-ui-lite-container {
display: none !important;
}
/ Hide Shopify chat widget /
body.template-cart #shopify-chat {
display: none !important;
}
/ Hide spin wheel app /
body.template-cart .needsclick {
display: none !important;
}
/ Hide audio widget */
body.template-cart #rams-widget {
display: none !important;
}
}

hope this help

3

@mastroke neither of theme worked. I placed it in theme.css.liquid

Please see: https://wo5ne92308hwjq59-26571931701.shopifypreview.com

4

@mastroke Can you try to hide the google icon too above the mute icon?

5

I Had to use another code, but I added it to theme.liquid according to sidekick and with your help! Thanks

{% if template == ‘cart’ %}

body.template-cart #shopify-chat { display: none !important; } body.template-cart .needsclick { display: none !important; } body.template-cart #rams-widget { display: none !important; } body.template-cart #smile-ui-lite-container { display: none !important; } body.template-cart #google-merchantwidget-iframe-wrapper { display: none !important; }

{% endif %}

6

Glad to hear your issue is resolved, and you’re welcome — happy we could help!

Since we need this CSS to work only on the cart page, we have to add this code in the theme.liquid file

7

This is not quite true – one can add a “Custom liquid” section in template area and paste CSS code there, wrapped with <style> and </style>

This code will only be rendered for this template (cart page in this case).