Remove top bar above header single page

  • Resolved aaofitness

    (@aaofitness)


    2 years, 1 month ago

    Any help will be greatly appreciated…
    I’m trying to remove the black/white bar that is appearing at the top of this page (photo attached). I’ve removed the menu and header using css, but this remains. Tried a few codes from other similar questions asked here before, but no luck. I’m using a child version of Theme 7.

    Also, separately, if anyone can help me reduce the size of the bottom padding, again just for this single page.

    Thank you!

    The page I need help with: [log in to see the link]

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

  • Hi,

    you will need to find the page ID first to be able to hide it using CSS. To find the page ID for that particular page, navigate to Pages and search for the business cases ebook download page. Then you can mouseover the Edit button for that particular page to find the page ID.

    You can try adding this code to your style.css or file or through customizer (Appearance > Customize > Additional CSS), but make sure to replace the placeholder xxxxx page-id:

    /* Removes black top bar */
.page-id-xxxxx .top-bar-bg {
display: none;
}

/* Removes both upper and bottom padding */
.page-id-xxxxx #main {
padding: 0;
}

    Please let me know if that worked.

    Thread Starter aaofitness

    (@aaofitness)

    Thank you so much. Both worked. The padding looks good now. The top bar is white now. Would there be any way to completely remove it? If not, it doesn’t matter as I believe it still looks better than before.

    Can you try replacing the first part of the code (Remove Black Top bar) with the following code, and make sure you replace the page-id with your own? 

    .page-id-xxxxx .masthead.inline-header.right.widgets.full-height.shadow-mobile-header-decoration.small-mobile-menu-icon.dt-parent-menu-clickable.show-sub-menu-on-hover.show-device-logo.show-mobile-logo {

display: none;
}
    • This reply was modified 2 years, 1 month ago by mikacns.
    Thread Starter aaofitness

    (@aaofitness)

    That works great. Thank you for the help!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Remove top bar above header single page’ is closed to new replies.