Shawburn Theme, CSS code to remove all titles from pages, not just the home page

• 

  structuredlight · Member · Feb 12, 2021 at 1:49 pm

  • Copy link
  • Add topic to favorites

  Hi, I hope you guys can help me.

  I’m using the Shawburn theme. Near the top of every page, between the primary site menu and the cover image I’ve placed at the top of every page, there’s a white bar with the page’s title. I wish to hide this title bar on every page.

  Under Customise -> Additional CSS, I’ve attempted using this custom CSS code I gleaned from another forum:

  #page .entry-header, #page .page-header, #page .entry-footer, #page .a8c-posts-list {
  text-align: center;
  display: none;
  }

  However, this code simply hides the text itself, but doesn’t remove the bar’s ‘whitespace’ or shift the cover image to be directly underneath the primary site menu at the top of the page.

  To put this another way, when I go to the Customise -> Homepage Settings, there’s a neat option to “Hide Homepage Title”. This does exactly what I want, but only for the home page. I wish to repeat the effect this option has, but for every page, not only the home page.

  If anyone has custom CSS which could help me, I’m all ears.

  Thanks for the help!

  The blog I need help with is: (visible only to logged in users)

• 

  supernovia · Staff · Feb 12, 2021 at 10:18 pm

  • Copy link

  Hey there, could you link to the site where you’ve implemented that so we can see what other code you’ve got?

  I know for the homepage of Shawburn, with that template, there’s an option to hide the home page title on Home Page settings.

• 

  kforbz · Member · Feb 13, 2021 at 1:42 pm

  • Copy link

  Hello,

  The css you have used is correct and it will not render that element, however, the white space is created by other elements on the page. You can try the css below to remove the extra space.

  
  @media only screen and (min-width: 560px)
  .site-main {
  padding-top: 0px;
  }

  .site-footer>*:last-child, .site-main>article>*:last-child, .site-main>.not-found>*:last-child, .entry-content>*:last-child, .entry-content-child:last-child, .wp-block-premium-content-container .wp-premium-content-logged-out-view>:last-child, .wp-block-premium-content-container .wp-block-premium-content-subscriber-view>:last-child, [class*=inner-container]>*:last-child, .widget-area>*:last-child {
  margin-top: 0;
  margin-bottom: 0;
  }

• 

  structuredlight · Member · Feb 15, 2021 at 7:18 am

  • Copy link

  Hi guys

  Thanks for the replies.

  
  @supernovia, it’s structured-light.org. A simple website for my university laboratory group :-)

  
  @kforbz, thanks for the CSS! It doesn’t seem to remove the white space completely (check out the website if you’re interested), but it does make it much smaller. And I think I’m good with that for now :-)

  Thanks guys. I have one or two more questions but I’ll ask them in a separate post.

  Appreciate the help!

• 

  kforbz · Member · Feb 15, 2021 at 8:15 am

  • Copy link

  Hi,

  I did look quickly on mobile and I could see the issue. This css should be placed above my previous css :

  .site-header, .site-main, .site-footer {
  padding-top: 0px;
  padding-right: 16px;
  padding-bottom: 16px;
  padding-left: 16px;
  margin-left: auto;
  margin-right: auto;
  }

  I hope that helps.