Removing or making invisible headers and footers from posts

  • Hello,

    We blog through WordPress and also collect leads through forms on the blog. I was curious if there was a plugin or easy way to remove or hide the header/footer from posts in order to increase conversions by removing the navigation. It’s important to note that we have tons of content and these were all set-up as posts not pages. I know that I could create a page template that removes the header/footer but I want to change posts that already exist.

Viewing 9 replies - 1 through 9 (of 9 total)

  • Could you please provide a link to one of the posts?

    Also, to be clear, you want to completely remove the header, footer, and navigation to only show the post content?

    Thread Starter rkelly

    (@rkelly)

    Hi Jake,

    Here is an example. And yes that is correct remove the header and footer.

    Do you want to remove the header and footer from all blog posts or just from certain ones?

    Thread Starter rkelly

    (@rkelly)

    Ideally I’d like to know how to do both. Likely we would want the header & footer removed from all posts, but If you could select certain posts that would be nice to know.

    How much do you want to hide? Do you want to remove the navigation? Explain exactly what you want hidden

    Thread Starter rkelly

    (@rkelly)

    On the sample page I posted above I took a screen grab of what I would like to keep here basically everything else we want to hide….this includes everything above the title of the post Delivering ROI and everything beneath the marketing resource icons (contact us, recent tweets, recent posts, etc..).

    Okay, here’s what I would do.

    (1) Create a new stylesheet (I’m naming mine “singlepost.css”).
    Then add this code to it.

    .footer-container-wrap {
	display: none;
}

.top-bar-wrap, .header-menu-wrap ul ul li {
	display: none;
}

.top-menu-wrap {
	display: none;
}

.main-menu-wrap {
	margin-top: -75px;
}

    (2) Call this code only on single blog posts
    Include in your functions.php file the code below.

    if ( is_single() ) {
?><html><link rel="stylesheet" type="text/css" href=“https://wherever-stylesheet-is.com/singlepost.css”></html><?php
}

    If you want to only hide the items for a single post, then you can use this code:
    NOTE: Replace 17 with POST ID.

    if ( is_single('17') ) {
?><html><link rel="stylesheet" type="text/css" href=“https://wherever-stylesheet-is.com/singlepost.css”></html><?php
}
    Thread Starter rkelly

    (@rkelly)

    Hi Jake,

    Thanks again for your help. I was actually able to make it work and for anyone else reading this there is a CSS & Javascript Toolbox Plugin that allows you to select sections of your site or individual posts to apply a custom stylesheet to.

    I was wondering if anyone could help me out with one more thing. After making the changes I noticed the page is pretty bare and does not include any branding. I’d like to include our logo in white in a dark blue bar above the title of the post. Here is the updated page with the navigation removed. What I’m now looking to add is very similar to the bar on the top of the WordPress homepage found here but obviously without a login button, our logo in white and the hex color for the background of the bar being 2677b0.

    Thread Starter rkelly

    (@rkelly)

    Quick follow-up I don’t want the bar to be fixed as you scroll like the WordPress one I linked to.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Removing or making invisible headers and footers from posts’ is closed to new replies.