How can I change the Instafeed background color on my website?

[denise99lau]

I'd like to change the background color from white to black on my website

Does anyone know how to do this, please? 

https://giuliettalounge.com/password

PW: eskahl

[denise99lau · Accepted solution]

I'd also like to reduce the line spacing of the footer in mobile view

[Moeed · Accepted solution]

Hey @denise99lau 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
section#shopify-section-template--15077705810029__17054624707bb4845b {
    background: black !important;
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[webwondersco · Accepted solution]

@denise99lau , Hope you are doing well.

Please add the below line of CSS code at the end of your base.css file. You can find this file in the assets folder.

#shopify-section-template--15077705810029__17054624707bb4845b{
background-color:#000;
}

the output is like the attached screenshot.

[webwondersco · Accepted solution]

@denise99lau , Please add the below line of CSS code at the end of your base.css file.

@media(max-width:767px){
.footer .footer-block__details-content .list-menu__item--link {
    padding-top: 0;
    padding-bottom: 0.5rem;
}
}

After adding the above style it'll look like the attached screenshot.

[denise99lau · Accepted solution]

I'd also like to reduce the line spacing of the footer in mobile view

[webwondersco · Accepted solution]

@denise99lau , Please add the below line of CSS code at the end of your base.css file.

@media(max-width:767px){
.footer .footer-block__details-content .list-menu__item--link {
    padding-top: 0;
    padding-bottom: 0.5rem;
}
}

After adding the above style it'll look like the attached screenshot.

[denise99lau]

Thank you very much for the replies. It helped in a second. Can I also know how to reduce the size of the text in the footer in both website and mobile view please?

[webwondersco · Accepted solution]

@denise99lau Please add the below line of CSS code to reduce the font size.

.footer .footer-block__details-content .list-menu__item--link{
font-size:13px;
}
.footer-block__details-content.rte{
font-size:14px;
}

13px is for the link and 14px is for the content. You can update the px value it as per your requirements. 

[denise99lau]

Thanks again! 

[Moeed · Accepted solution]

Hey @denise99lau 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
section#shopify-section-template--15077705810029__17054624707bb4845b {
    background: black !important;
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[denise99lau]

Thank you so much for your help!

[Moeed]

Thank you for your reply. I'm glad to hear that the solution worked well for you. If you require any more help, please don't hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.

[denise99lau]

I'd like to know how to reduce the size of the text in the footer in both website and mobile view please?

[webwondersco · Accepted solution]

@denise99lau , Hope you are doing well.

Please add the below line of CSS code at the end of your base.css file. You can find this file in the assets folder.

#shopify-section-template--15077705810029__17054624707bb4845b{
background-color:#000;
}

the output is like the attached screenshot.