Jump to content

How to make footer visible on mobile home page but not desktop

Recommended Posts

  • Replies 4
  • Created
  • Last Reply

Top Posters In This Topic

I'm not sure I can see exactly what you want to do via your website, but in general you can use CSS to hide your footer within a media query so that it only hides on desktop, something like this:

@media only screen and (min-width:768px) {
  #footer-sections {
    display:none;
  }
}

You can also add a page collection ID if just wanting to target one page, or add this to the page header code injection on one page within <style></style> tags.

Please like and upvote if my comments were useful to you. Thanks!

Zygmunt Spray
Squarespace Website Designer
Contact me: https://squarefortytwo.com/ 
🔌Ghost Squarespace Plugins (Referral link)
Buy me a coffee

Link to comment

Just entered the code in CSS and this hides the footer for all the pages on my desktop website.

I want the footer to show on every page for both desktop and mobile, except the home page on desktop. So I want to see the footer on every mobile page and every desktop page except the desktop home screen.

Link to comment
23 hours ago, Ziggy said:

You can also add a page collection ID if just wanting to target one page

Using the homepage collection ID:

@media only screen and (min-width:768px) {
  #collection-62486703ea77215859f5b84e {
    #footer-sections {
      display:none;
    }
  }
}

 

Please like and upvote if my comments were useful to you. Thanks!

Zygmunt Spray
Squarespace Website Designer
Contact me: https://squarefortytwo.com/ 
🔌Ghost Squarespace Plugins (Referral link)
Buy me a coffee

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.