FROM CACHE - en_header

Add background color on the multicolumn section in Dawn

Solved
mfazio
Excursionist
41 0 9

hey does anyone know how to get a colored background on the multicolumn section in Dawn? The only options are a default grey and white background. Thanks

Accepted Solution (1)

Accepted Solutions
AvadaCommerce
Shopify Partner
3677 792 680

This is an accepted solution.

Hi @mfazio ,

 

You try below code:

 

#shopify-section-template--15201055244454__16389421757b3fe2cd .multicolumn.background-none {
    background: #fff !important;
}

 

I hope it would help you.

AVADA - Top Rated App for Email, SMS, Popups


Check our website for full features and start a FREE TRIAL.
Install another app to boost sales, 100% FREE

View solution in original post

Replies 22 (22)
DMT-Mike
Shopify Partner
25 6 9

Hi Mfazio,

 

Open your stores dashboard --> Online Store --> Actions --> Edit Code --> Open 'base.css' -->

At the bottom of the file copy and paste this code:

.multicolumn {
  background-color: #ffffff !important;
  margin: 0 !important;
  padding: 1px 0 5rem !important;
}

 

You should be able to change the colour via the hex code (to whatever you want) although the section itself will still use the black secondary colour, so you are still fairly limited.

 

Let me know if this works for you!

 

NOTE: If you edit any files on your store, I advise that you duplicate the theme before doing so and editing the duplicated theme instead. This will prevent your live site from breaking if something goes wrong.

 

Need expert help with your Shopify Website? Get in touch.
KetanKumar
Shopify Partner
33523 3359 11075

@mfazio 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
HIMIKU
New Member
1 0 0

Hi DMT-Mike, how about the multicolumn section in the product pages? do you know how to change that?

mfazio
Excursionist
41 0 9

Thank you. This works but i just realized that i only need it on the homepage. When you set it up like this, its for all the pages. Do you have the code to just keep it on the homepage? 

KetanKumar
Shopify Partner
33523 3359 11075

@mfazio 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Trapa
Shopify Partner
119 8 12

can you provide me with your store URL? so that i can give it a try

Trapa | EFOLI
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- Checkout our apps:Inkybay || MultiVariants
mfazio
Excursionist
41 0 9
KetanKumar
Shopify Partner
33523 3359 11075

@mfazio 

can you try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/base.css->paste below code at the bottom of the file.

.multicolumn.background-none.no-heading {
    background: #fff !important;
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
mfazio
Excursionist
41 0 9

That didnt work. Its still showing the same color background on the product page and homepage. Just need a different color on the homepage 

KetanKumar
Shopify Partner
33523 3359 11075

@mfazio 

can you please share section screenshot!

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
mfazio
Excursionist
41 0 9

Screen Shot 2022-01-23 at 12.10.52 AM.png

Above is the background color i want only on the home page for multicolumn

 

Screen Shot 2022-01-23 at 12.11.24 AM.png

 

Above has the same color background on my product page for multicolumn

 

I only want the color background on my homepage and not my product page

I prefer a white background on the product page multicolumn section

 

Thanks

KetanKumar
Shopify Partner
33523 3359 11075

@mfazio 

yes, please try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/base.css->paste below code at the bottom of the file.

#shopify-section-template--15201055211686__16429218635b3aa7eb .multicolumn {
    background: #fff !important;
}
If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
AvadaCommerce
Shopify Partner
3677 792 680

This is an accepted solution.

Hi @mfazio ,

 

You try below code:

 

#shopify-section-template--15201055244454__16389421757b3fe2cd .multicolumn.background-none {
    background: #fff !important;
}

 

I hope it would help you.

AVADA - Top Rated App for Email, SMS, Popups


Check our website for full features and start a FREE TRIAL.
Install another app to boost sales, 100% FREE

myKidsLounge
Excursionist
25 1 3

Thank you for this solution. 

 

For absolute beginners, where do I paste this code? 

 

Would you mind sharing the trail where to do this?

 

Thank you! 

 

BR, 

Daniel 

FlorenceGee
Excursionist
13 0 6

Hi! Did you find out how to get this done? I've tried all the code above, but no luck, unfortunately.

KetanKumar
Shopify Partner
33523 3359 11075

@FlorenceGee 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
FlorenceGee
Excursionist
13 0 6

Hi Ketan, thanks! It's not a huge issue. I'd just like to alter the background color for multicolumn boxes sitewide. I'm looking for a css snippet and need to know where to paste it. I'm new to Shopify!

Website is https://mia-mia-baby-kids.myshopify.com/
Password fleich

KetanKumar
Shopify Partner
33523 3359 11075

@FlorenceGee 

can you try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/section-multicolumn.css->paste below code at the bottom of the file.

.multicolumn.background-primary .multicolumn-card {
    background: transparent;
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
FlorenceGee
Excursionist
13 0 6

That was super easy! Thanks so much 🙂