Need HTML? Want to use CSS (cascading style sheets)? Need a touch of help with Javascript, Java, or other coding language? Whether through SBI!'s BlockBuilder 2 or your own HTML Editor, post here. Push the envelope. Learn basics (ex., how to format your text, add tables) or go as "out there" as you like. Problems? Questions? Help and be helped.

Moderators: Laura from Chautauqua, Will from Los Ojos

#1369246 by Nicola from New York
Tue Apr 18, 2017 6:36 pm
Hi all,
I have just updated my website to a new responsive template and am hoping someone can help me out with the HTML/CSS code needed to make the header display only on the home page. I have received several emails from disgruntled customers today about needing to scroll down on every page to get to the content.

Any help would be greatly appreciated.

#1369256 by Juri from
Tue Apr 18, 2017 9:59 pm
Hi Nicola,

You'll need to make changes in two places.

The first has to be made in Site Designer to override your default template settings on all pages. The following will have to be placed in the Custom CSS section (click on Add Custom CSS button to edit it):

Code: Select all/* removes header image */
#PageWrapper #Header .Liner, #PageWrapper #Header .Liner {
min-height: 0;
#Header .Liner {
padding-top: 58px;
#PageWrapper #Header .Tagline, #PageWrapper #Header .Tagline {
display: none;

Don't forget to Save Style! Check how your pages look now. If anything doesn't work as intended, return to Site Designer, remove your custom changes, and Save Style again. Skip the next step -- this will leave you with the previous setup.

If the header disappeared, to restore it on your Homepage, load your index.html in BlockBuilder, click on Head button and add the following to This Page Only section:

Code: Select all<style type="text/css">
/* restores header image */
#PageWrapper #Header .Liner, #PageWrapper #Header .Liner {
min-height: 488px;
#Header .Liner {
padding-top: 100px;
#PageWrapper #Header .Tagline, #PageWrapper #Header .Tagline {
display: initial;

This can be tested in Preview without building the page. If it looks OK, Build It! If not, don't build the page, and possibly remove the changes from Site Designer as well.

Good luck!

Kind regards,

PS In order not to load the header image on all pages, another change should be done in Site Designer and in index.html. However, this will make changing the image quite cumbersome. If you would like to do it, please reply in this thread.
Similar Topics Statistics Last post
Help making page hearder, footer, etc., disappear at print time using this code
by Luke from Meansville Mon Jan 23, 2017 6:58 pm
3 Replies
by Luke from Meansville
Wed Jan 25, 2017 10:58 pm
Mobile header image not displaying
by Shirley from Norwood Sun Oct 23, 2016 11:11 am
3 Replies
by Debs from
Thu Oct 27, 2016 1:36 pm
How do I make an existing slider mobile responsive?
by Katherine from Hertford Wed Jan 25, 2017 2:27 pm
2 Replies
by Katherine from Hertford
Wed Feb 01, 2017 1:57 pm
Why can't/how can I get text to wrap left/right around my adsense responsive ad code?
by John from Midway Park Sat Aug 05, 2017 1:48 pm
2 Replies
by John from Midway Park
Sun Aug 06, 2017 2:21 pm
Can I change my header images for different pages?
by Abraham from Kaithal Wed Sep 28, 2016 7:51 am
12 Replies
by Abraham from Kaithal
Mon Oct 03, 2016 12:31 pm

Users browsing this forum: No registered users and 8 guests