Remove Hero on Internal Pages

  • Author
    Posts
  • #149557

    adamandy1
    Member
    Original poster

    Hi! Is it possible to remove the hero image on the internal pages? And instead just have a colored bar that has the logo and navigation? The Hero image takes up so much space, trying to avoid so much scroll.

    https://adamstumpf.wordpress.com/portfolio/onyx-valve-42-inch-duckbill-check-valve-power-plant-outfall/
    https://adamstumpf.wordpress.com/home/contact-us/

    THANKS!

    The blog I need help with is: adamstumpf.wordpress.com

    #149742

    anhtnt
    Theme Author

    Hi,

    To remove the hero image on those 2 specific posts/pages, please find the post/page IDs first. Here is a guide to do that.

    Then go to Customize > CSS and add the following CSS:

    .page-id-112 .site-header {
    	background: none;
    	padding: 0;
    }
    .page-id-112 .site-header:after {
    	display: none;
    }
    .page-id-112 .navbar {
    	background: #111;
    }
    .page-id-112 .header-inner {
    	padding: 60px 0;
    }
    .page-id-112 .header-inner h1 {
    	color: inherit;
    }
    
    .postid-186 .site-header {
    	background: none;
    	padding: 0;
    }
    .postid-186 .site-header:after {
    	display: none;
    }
    .postid-186 .navbar {
    	background: #111;
    }
    .postid-186 .header-inner {
    	padding: 60px 0;
    }
    .postid-186 .header-inner h1 {
    	color: inherit;
    }

    In the snippet above, I use your page/portfolio ID, so you just need to copy and paste. You might want to change the background color for navbar and the padding (60px).

The topic ‘Remove Hero on Internal Pages’ is closed to new replies.