Add recent post heading and remove date from posts

• 

  hohcatholic · Member · May 15, 2016 at 6:04 pm

  • Copy link
  • Add topic to favorites

  Greetings,

  I am looking to add a heading entitled “Recent Posts” centered over the recent posts on the main page. I would also like to hide the dates of the posts. Just wondering what the CSS is to do this?

  Thank you.

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

• 

  dianakcury · Member · May 16, 2016 at 12:59 am

  • Copy link

  Hello!

  In order to add a heading over the recent posts on main page, please add the following into your stylesheet:

  .home .main #main-content:before {
      content: 'Recent Posts';
      font-size: 2em;
      font-weight: bold;
      text-align: center;
      display: inherit;
      margin: 0 0 20px 0;
  }

  To hide the post dates, please add:

  .home .text-on, .home .entry-date { display:none }

  The code above will hide “on date etc” only on homepage, if you like to hide on all pages just remove .home.

  Hope I have helped you :)

• 

  hohcatholic · Member · May 16, 2016 at 1:12 am

  • Copy link

  This did not work. I tried it at the beginning and the end of my stylesheet and it still did not work.

• 

  thesacredpath · Member · May 16, 2016 at 8:20 pm

  • Copy link

  Hi there, first off, this last rule in your CSS has syntax errors and is causing some issues. Basically anything after that will not be rendered because of the previous syntax error. Remove and/or edit this and fix the syntax issues.

  body > div.container.hfeed > div.main > div.col-sidebar.sidebar-small {
  	display: no body > div.container.hfeed > div.col-sidebar.sidebar-main {;
  	display: none;
  }

  To add “Recent Posts” above the posts on the main page, add the following CSS.

  .home .main-post-list:before {
      display: block;
      content: "Recent Posts";
      font-size: 2em;
      font-weight: bold;
      text-align: center;
      margin: 0 0 20px 0;
  }

  I tested the code @dianakcury gave for hiding the post dates, and it works.

• 

  hohcatholic · Member · May 16, 2016 at 8:47 pm

  • Copy link

  Yes that helped me! Also one more thing – how do I remove the “By (Author name)” on the post display?

• 

  thesacredpath · Member · May 17, 2016 at 4:22 am

  • Copy link

  Replace this

  .home .text-on, .home .entry-date {
  display:none;
  }

  with this

  .postmetadata {
      display: none;
  }

• 

  hohcatholic · Member · May 17, 2016 at 4:29 am

  • Copy link

  When I do that, it removes my social icons and date/time in the header.

• 

  thesacredpath · Member · May 17, 2016 at 6:59 am

  • Copy link

  Oh, sorry for not noticing that. They used the same CSS class for the date and social icons in the header area. Change it to this instead.

  .home .main .postmetadata {
      display: none;
  }

• 

  thesacredpath · Member · May 17, 2016 at 7:01 am

  • Copy link

  And actually, if you also wish to have that gone on the single post pages, use this instead.

  .main .postmetadata {
      display: none;
  }

• 

  hohcatholic · Member · May 17, 2016 at 7:11 am

  • Copy link

  This works!

  One last item – on the bottom of the posts it has the previous post and the next post links. How do I prevent those from showing as well?

• 

  hohcatholic · Member · May 17, 2016 at 7:13 am

  • Copy link

  And to remove the “categories” and “tagged as” text as well.

• 

  thesacredpath · Member · May 17, 2016 at 10:12 am

  • Copy link

  To remove the categories and tags from the single post pages, use this.

  single .taxonomies {
      display: none;
  }

• 

  hohcatholic · Member · May 17, 2016 at 4:06 pm

  • Copy link

  Awesome! Thank you. It is much appreciated!

• 

  thesacredpath · Member · May 17, 2016 at 6:59 pm

  • Copy link

  You are welcome!