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;
}
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024