Jump to content

Change footer theme on Portfolio page

Recommended Posts

As per title, I was wondering if it is possible to change the footer theme on one page. I would like this one Portfolio page, including the header and footer, to be the 'Lightest 2' theme. The header is set to Dynamic, so it is updating to match the content block below when I set that to 'Lightest 2', but the footer has no option for 'Dynamic'. 

Is there a way to change the footer theme through Custom CSS and the collection ID (I am currently on a Personal Plan)?

I am not well versed in CSS so be gentle! 🙂 

Edited by KeithSWD
typos
Link to comment
  • Replies 7
  • Views 1.7k
  • Created
  • Last Reply

Top Posters In This Topic

@KeithSWD try this in a markdown block somewhere on the page you want to change. If you add it to the footer it'll change on every page but maybe just add it to the last section of the page you want this to change on?
 

<script>
  document.addEventListener("DOMContentLoaded", function() {
    var footerSection = document.querySelector("#footer-sections section");
    if (footerSection) {
      footerSection.classList.remove("white");
      footerSection.classList.add("white-bold");
    }
  });
</script>

 

  Did I help you? Buy me a coffee!

👨‍💻 Bergen Design Co.

💻  I'm for hire on Upwork!

🕸️ Squarespace Experts  

🖥️ 99Designs

 🛠️ Web Designer's Toolkit

**some of these contain affiliate links

Link to comment

Thanks for the suggestion but as I mentioned, I am on a Personal Plan for now, so I can only add code into the Custom CSS section under 'Webtools'. That's why I thought I would need to target the page using CollectionID.

I thought another approach might be to suppress the footer on that page and create a fake footer block under the portfolio. But then I still see the 'Lightest 1' theme background below the 'fake' footer, and it doesn't carry through to the individual galleries either.

Maybe need to wait until we upgrade the plan!

thanks

Link to comment

We can set this manually with CSS code, but will need to add code to change background, text color...You can share link to portfolio page where you want to change this + let me know what should it look like, we can help easier.

Or another way, you can add one more section in Footer, we can give code to make this section appears on specific portfolio page only.

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

@KeithSWD so there's a workaround with code where you can add it in a markdown block and it will work on a personal plan. It's doable with css too but obviously more code because you have to target each individual element and change it's colors.

  Did I help you? Buy me a coffee!

👨‍💻 Bergen Design Co.

💻  I'm for hire on Upwork!

🕸️ Squarespace Experts  

🖥️ 99Designs

 🛠️ Web Designer's Toolkit

**some of these contain affiliate links

Link to comment
  • 3 weeks later...

jaeveedee and tuanphan

Apologies for the delay in responding, partly because I can't figure out why I am not getting notifications of replies despite being subscribed, and I have been off work for a while too.  We may upgrade to a business plan so I'm going to sort that first and then return to this issue. Many thanks for the input!

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.