Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 6
Sign in to follow this  
zakovich

Five: remove/hide banner on one page only

Question

I would like to remove the banner image across the top of my Gallery page without removing or distorting the banner images on other pages. I understand you can do this, as there are numerous articles in the support community with custom CSS code to make it work. But, I've looked into the options given and I am unable to make it work. The terms 'modulePage' and others to find the page ID do not turn up results when viewing source.Are there alternatives? Or is there something I'm missing.

Edited by acalvo

Share this post


Link to post

10 answers to this question

Recommended Posts

  • 5

Hide Banner


#collection-1234567890abcde #banner-area-wrapper { display: none }

You get the collection number from the Developer Tools (right click > Inspect Element in Google Chrome or Safari, or Firefox). Or you can find the number if you go to the page you want the number for, and click on the 'Manage Site' gear icon, then look in the URL – the last string of numbers after the = is the collection number. It will look something like:


your-domain.squarespace.com/config/#collectionId=513d922be4b00efcff59acdf

Source: Remove banner on all pages except homepage? Edited by masters

Share this post


Link to post
  • 0

How do i get rid of the banner in a template such as Shift? I have been trying and trying and trying without success! I need help. I do not have the technical know-how to code it in.

Please, in layman’s terms, where do I inject the code? Plain and simple, as simple as you can provide. Please let mw know what code and where to copy and paste it, exactly where.

Edited by Zaqari

Share this post


Link to post
  • 0

@masters I am trying to achieve this (hiding the header from blog posts) on my site (www.unbroken.com.au) I would like to keep the thumbnail and remove the header from the page. Can you offer any insight? P.S. I am currently not displaying a banner or a thumbnail as they look awful

Share this post


Link to post
  • 0

I'd like to share a solution that will display the banner image if it has been added to the page and hide it if not (this is for the Five template).

First, add the following line of CSS to your Custom CSS:


#page-header #banner-area-wrapper #banner-area {display:none;}

Then, add the following javascript to your Footer Code-Injection:


<script type="text/javascript"><!--
$(window).load(function()  {
 var banner = $('#page-header #banner-area-wrapper #banner-area #page-thumb img');
 if (banner.length) {
     banner.parents('#banner-area').show();
     banner.each(function(img){ImageLoader.load(this);})
   }
});
//--></script>

This assumes you've already included jQuery, of course.

Share this post


Link to post
Guest
This topic is now closed to further replies.
Sign in to follow this  

×
×
  • Create New...