Shopify themes, liquid, logos, and UX
Hi all, would greatly appreciate some help on this:
1. How can I add a background image on homepage only?
2. How can I change the background colour (to white) for View Cart page only
For Brooklyn theme: https://the-ice-cream-bar-malaysia.myshopify.com
Password: andrew
Thanks so much
Solved! Go to the solution
This is an accepted solution.
For home page background add bellow CSS code in your theme CSS file-
If you changed to white background of cart page the all the white text will not showing of cart page see the image, so I think no need to change background color of cart page.
This is an accepted solution.
Please follow the steps:
- Step 1: Go to Online store > Themes > Actions > Edit code.
- Step 2: Go to Assets > theme.scss.liquid and paste this at the bottom of the file:
.template-cart .page-container{
background: #fff;
}
This is an accepted solution.
Hi,
For Cart Page-
Add bellow CSS in your theme CSS file-
/* CSS for cart page */
body#your-shopping-cart {
background: #fff;
}
body#your-shopping-cart .grid__item.large--two-fifths.push--large--three-fifths, body#your-shopping-cart header.section-header.text-center h1, body#your-shopping-cart .cart__row, body#your-shopping-cart .cart__row a {
color: #000 !important;
}
This is an accepted solution.
For home page background add bellow CSS code in your theme CSS file-
If you changed to white background of cart page the all the white text will not showing of cart page see the image, so I think no need to change background color of cart page.
Hi SWSolutions, thanks so much for the help with the background image. Works like a charm.
For no. 2 actually wanted to ask how I could change only for the Cart page: the background to white and text to black. I.e. inverted from the rest of of the store
Thanks a lot
This is an accepted solution.
Hi,
For Cart Page-
Add bellow CSS in your theme CSS file-
/* CSS for cart page */
body#your-shopping-cart {
background: #fff;
}
body#your-shopping-cart .grid__item.large--two-fifths.push--large--three-fifths, body#your-shopping-cart header.section-header.text-center h1, body#your-shopping-cart .cart__row, body#your-shopping-cart .cart__row a {
color: #000 !important;
}
This is an accepted solution.
Please follow the steps:
- Step 1: Go to Online store > Themes > Actions > Edit code.
- Step 2: Go to Assets > theme.scss.liquid and paste this at the bottom of the file:
.template-cart .page-container{
background: #fff;
}
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024