Shopify themes, liquid, logos, and UX
I have a multicolumn on my home page - Dawn Theme. How can I reduce the padding on the left & right side of the column (screenshot attached below)?
I would like to add the custom css only to this section. Thanks!
Hi @rjluna
Could you please provide your store password to check?
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
Password: cornholeantics
Please add this CSS code at the Custom CSS of that section
.page-width {
max-width: 100% !important;
}
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
It say's the css code is invalid. "Correct the errors to save your custom CSS.
Hi @rjluna
I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.
Please add this css in your bottom of the base.css file:
.section-template--17743120236844__multicolumn-padding {padding-left: 10rem !important; padding-right: 10rem !important;}
Regards,
San
If it’s helpful to you, please mark it as a solution.
Need Help with Shopify Design, Migration, Speed, or Custom tasks?
email: hi@mswebdesigner.com
Try Our Conversion Booster app to get more sales | Connect Our Founder Linkedin
Will this code only apply to that section of the website and not the entire website? Thanks.
Hello @rjluna
1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:
.multicolumn-card.content-container {
width: 100%!important;
}
.multicolumn .page-width {
max-width: 100%;
}
Is the there code I can add only that section and not the entire website? Thanks.
Hello @rjluna
1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:
.multicolumn-card.content-container {
width: 100%!important;
}
.page-width {
max-width: 100%;
}
Thanks. This code works but it applies it to the entire website. I was hoping to only having it apply to that section.
You can make code apply to that section only by adding code in Custom CSS section in your Theme Customize of that section
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
When I add that code to the Custom CSS section I get error: "Invalid CSS - certain At-Rules are not supported. Try using global CSS."
User | RANK |
---|---|
206 | |
173 | |
63 | |
52 | |
47 |
On our Shopify Expert Marketplace, you can find many trusted third party developers and fr...
By Arno Nov 27, 2023You've downloaded the Search & Discovery app from the Shopify App store, and as you're ...
By Skye Nov 8, 2023The year-end shopping season is just around the corner. Is a flash sale on your radar? Are...
By Jasonh Nov 6, 2023