Hi! I’m new to this, and was just wondering how to remove the white space above my footer on my website. Any help would be greatly appreciated, I’ve been trying to figure it out for hours. Thanks!
Topic summary
A user is trying to remove unwanted white space above their website footer and extend the black background area that contains sections like “customer service,” “information,” and “about us.”
Problem Details:
- The user included screenshots showing the white gap they want to eliminate (marked in purple) and the black footer area they want to expand upward (marked in red)
- They’ve been struggling with this issue for hours
Proposed Solution:
BSS-Commerce provided CSS code to add to the theme file:
.nov-footer {
padding-top: 0px !important;
}
.footer-layout {
padding-top: 24px;
}
Current Status:
- The user is uncertain which CSS file to modify, as they only found
owl.theme.default.cssin their Assets folder - BSS-Commerce confirmed this is the correct file and suggested adding the code at the end
- If changes don’t appear after implementation, the support team requested the user share all CSS file names to identify the most suitable file
- The discussion remains open pending confirmation that the solution works
1 Like
Hello @urRoomPlug
Could you please share your store url ( with pass if your store password is enabled ) then I can see and suggest something for you?
Best regards,
GemPages Support Team
Hi @urRoomPlug
Can you kindly share your store link (with the password, if any) with us? We will check it and suggest you a solution.
Thanks! heres the link: https://18e0wlz0ftn2bjyg-69417271586.shopifypreview.com
Yes, here it is: https://18e0wlz0ftn2bjyg-69417271586.shopifypreview.com
Hi @urRoomPlug
Please follow these steps:
-
From Shopify admin, select Online Store > Themes.
-
Go to Actions > Edit code.
- Find the Assets/theme.css folder (or base.css). If you can’t find any similar files, you can take a picture of the files with the .css so that we can help you). Then add the following code at the end of the file:
.footer_copyright {
display: none !important;
}
The above is our guide to help you hide the copyright in the Footer. Please let us know the section you want to hide if it’s not what you want.
I hope that it’s useful for you.
Thanks for the reply. I wasn’t trying to remove the copyright message from the bottom of the website, but I’ll go ahead and do that now while I’m at it. I’m trying to delete the white area ABOVE the footer and make the black area bigger above where it says “customer service”, “information”, and “about us”. I attached another picture. I circled the black area (in red) that I want to extend upwards, and I shaded the white area (in purple) that I want to remove. I checked the assets folder, and the only .css file that says anything related to theme is owl.theme.default.css, could that be it? Please let me know, thank you!
1 Like
Hi @urRoomPlug
You can add the following code to the main (.css) file:
.nov-footer {
margin-top: 0px !important;
}
.footer-layout {
padding-top: 24px;
}
I hope that it will work for you.
Which css file would it be? In assets the closest one I have to theme is owl.theme.default.css.
Hi @urRoomPlug
We’re sorry for the delay. We are sure that the owl.theme.default.css theme css file is the right one to add that code to at the end of the file. If the interface of your website does not have any changes after adding it, you can send us the names of the .css files (.css.liquid) so that we can help you choose the most suitable file.