Change Background & Text Colour in Single Sections (Brooklyn Theme)

Solved
tessastbury
Excursionist
40 0 12

Hi there,

I would like to change the background colour and text colour for the Rich Text, Collection List, Image with Text & Footer sections on the following website;

https://beaufort-christmas-shop.myshopify.com/ 

Password: christmas

Background colour should be #405653 and text should be #F8F4EF.

Many thanks,

Tess

0 Likes
Pallavi
Shopify Expert
2240 370 485

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >theme.scss.css and paste this at the bottom of the file:

/*Rich Text css */

div#shopify-section-featured-collections {
background-color: #405653!important;
color: #F8F4EF!important;
}

/* collections sections css */

div#shopify-section-featured-content {
background-color: #405653!important;
color: #F8F4EF!important;
}


/* Footer sections css */

.site-footer__linklist>li>a {
color: #F8F4EF!important;
}
.site-footer .wrapper .grid-uniform .grid__item .social-icons>li>a {
color: #F8F4EF!important;
}
.site-footer__copyright-content {
color: #F8F4EF!important;
}
div#shopify-section-featured-content {
background-color: #405653;
}
.site-footer .wrapper .grid-uniform .grid__item>p>a {
color: #fff!important;
}
Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
tessastbury
Excursionist
40 0 12

Thanks very much for this! Are you able to give me some additional code so that the entire block is coloured – e.g. the padding areas that are currently still the original colour in this screenshot?

Many thanks,

Tess

 

Screen Shot 2021-06-23 at 6.11.05 am.png

0 Likes
Pallavi
Shopify Expert
2240 370 485

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >theme.scss.css and paste this at the bottom of the file:

div#shopify-section-featured-collections {
background-color: #0e2329;
padding: 40px 0;
}

div#shopify-section-1624072460b6506092 {
margin-top: 0;
}
Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
tessastbury
Excursionist
40 0 12

Thank you – I managed to copy this code to the other sections in order to achieve the desired effect.

To complete this change, can you please give me the final piece of code to change the heading colour in the image & text section? Please see a screenshot below.

Many thanks for your help!

Screen Shot 2021-06-23 at 7.03.28 pm.png

Pallavi
Shopify Expert
2240 370 485

This is an accepted solution.

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >theme.scss.css and paste this at the bottom of the file:

div#shopify-section-162407248759bc370d h2.h3 {
    color: white;
}
Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
tessastbury
Excursionist
40 0 12

Hooray! Thank you SO much!

Pallavi
Shopify Expert
2240 370 485

Thank you for your response. It's good to know that it's worked for you. Kindly feel free to get back to me if you need any further assistance.

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
0 Likes