Jump to content

Want to display footer block on when page has a gallery on it

Go to solution Solved by Steve48,

Recommended Posts

I have a code block in the footer #block-yui_3_17_2_1_1691321700096_2268

 

This is the code block:

<div style="text-align: center;">
  <span class="asterisk">*</span>
  <span class="video-text">Click on image to see a short video</span>
</div>

I only want to display this on pages that have galleries. When I examine  the gallery pages one tag that could be used to identify them is gallery-content-wrapper

I think this would require javascript code injection. Can someone suggest a script that would do this? Thank you.

 

Link to comment
  • Solution

I got this with the help of Chat GPT3. It worked after a few tweaks

<script>
  document.addEventListener('DOMContentLoaded', function() {
    var galleryContentWrapper = document.querySelector('.gallery-caption-wrapper');
    var blockId = '#block-yui_3_17_2_1_1691321700096_2268'; // Replace 'xxx' with the actual identifier of the block

    if (galleryContentWrapper) {
      var footerBlock = document.querySelector(blockId);
      if (footerBlock) {
        footerBlock.style.display = 'block'; // Show the block in the footer
      }
    } else {
      // If the gallery-content-wrapper element is not present, you can hide the block or handle it as needed
      // For example, to hide the block:
      var footerBlock = document.querySelector(blockId);
      if (footerBlock) {
        footerBlock.style.display = 'none';
      }
    }
  });
</script>

 

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.