Buy me a coffee

Gallery Section in Footer

If you want to add Gallery Section in Footer, you can follow these steps. Here I will use a custom plugin.

#1. Create a Page in Not Linked with name/URL

  • Footer Gallery – /footer-gallery

gallery-section-in-footer-01-min

Next, add a Gallery Section to this page.

gallery-section-in-footer-02-min

#2. Install this plugin

The plugin will give you some code to add to the Code Injection Header and Footer, like this.

add-a-section-to-top-of-blog-posts-use-not-linked-page-03-min

add-a-section-to-top-of-blog-posts-use-not-linked-page-04-min

#3. Add a Code Block to Site Footer (last section) > Paste this code

<div data-wm-plugin="load" data-target="/footer-gallery"></div>

gallery-section-in-footer-05-min

#4. Add this code to the Custom CSS box

/* fix gap under footer */
.wm-load-container {
    display: none;
}
footer.sections .wm-load-container {
    display: block !important;
}

gallery-section-in-footer-06-min

#5.1. If you want the Gallery Section to appear above the Footer, use this code to Code Injection – Footer

<script>
document.addEventListener('wmSectionLoader:scriptsLoaded', () => {
  const container = document.querySelector('.wm-load-container[data-target="/footer-gallery"]');
  const footerSection = document.querySelector('#footer-sections')
  footerSection.insertAdjacentElement('afterbegin', container)
});
</script>

gallery-section-in-footer-07-min

Result:

gallery-section-in-footer-08-min

#5.2. If you want the Gallery Section to appear under the Footer, just change this text to beforeend

gallery-section-in-footer-09-min

 

Ask me a question, free

If your site is private or in trial, just setup password and share url. See how to: https://beaverhero.com/squarespace-how-to/
Please check your email carefully. Recently I got a lot of questions with wrong emails.

If you haven't heard from me within 24 hours please check your junk/spam folder