Find help, info, instructions, tips, tricks

Tip: Use search box below or this box, labels in the first right sidebar, archive, ctrl+F for this page or sitemap to find topics

Monday, September 27, 2010

How to hide blog date header

Update: There is an easier way to do this without editing the template directly. See Blogger "Edit posts" options

I have tested "unticking" the date header by testing at Testing Blogger Beta without editing directing the template directly at Testing Blogger Beta and you can check a label page eg Label: Comments you would see that there are no date header. Also read the comment: puluth® has left a new comment on your post "How to hide blog date header":

Thanks. but how to remove it from blogger label page?


While blogs started as web logs or weblogs (chronological publication of personal thoughts or diary) and thus characteristically have a date header like the one above this post, but because blogs have now become a convenient way of putting content online, many have been using blogs for other purposes more like a typical website, many bloggers want to get rid of the typical date header.

That is not difficult to do. Sign into Dashboard > Design > Edit HTML to open the template editor and look for the block of code like the one below (for the Minima template, yours depending on your template may be slightly different):

/* Posts
-----------------------------------------------
*/
h2.date-header {
margin:1.5em 0 .5em;
}


and just add this line: visibility:hidden; for example like below:

/* Posts
-----------------------------------------------
*/
h2.date-header {
visibility:hidden;
margin:1.5em 0 .5em;
}


and the date header will be gone.

35 comments:

  1. Thanks for all the great ideas.

    I'd like to hide the dates on my blog, but I can't find the right place to put the extra code. My blog URL is: http://donrisi.blogspot.com/
    My blog info is:
    Name: Picture Window
    Designer: Josh Peterson
    URL: www.noaesthetic.com

    Thanks,Don

    ReplyDelete
  2. Here (use ctrl+F .post to find):

    h3.post-title {
    text-align:center;
    margin: 0;
    font: italic bold 20px 'Times New Roman', Times, FreeSerif, serif;;
    }

    Try editing to

    h3.post-title {
    visibility:hidden;
    text-align:center;
    margin: 0;
    font: italic bold 20px 'Times New Roman', Times, FreeSerif, serif;;
    }

    ReplyDelete
  3. Peter,

    Thanks for the suggestion, but that hides the post title, not the date, and it's the date I'm trying to hide. Any other suggestions?

    I appreciate the help.

    Don

    ReplyDelete
  4. Yeah realized that after posting. However, on checking found many of such
    <h2 class='date-header'><span>Wednesday, September 15, 2010</span></h2>

    but can't find date-header anywhere in the CSS.

    ReplyDelete
  5. Blogger has been notified, according to the terms of the Digital Millennium Copyright Act (DMCA), that certain content in your blog is alleged to infringe upon the copyrights of others. In this case the content concerns http://avlinks.blogspot.com/. As a result, we've been forced to remove your blog for violating our policies.


    konala.333@gmail.com is my mail id , please help me sir , ....
    this is the message i,ve got from blogger team , please help how to restore my blog please peter sir please, is there any way to get my blog back, please kindly help me ...

    ReplyDelete
  6. Thank you Peter!

    This is an important component for subject / topic Blogs... research.

    Appreciate all you do.

    Sonshine

    ReplyDelete
  7. great idea, i find extra code for my blog - way 2 read online
    thanks for sharing!

    ReplyDelete
  8. This comment has been removed by the author.

    ReplyDelete
  9. Huh? I suspect you may be referring to static pages URL where the date in the permalink is replaced (by Blogger not me) and replaced with the alphabet p

    ReplyDelete
  10. I didn't really get an answer from the comments above so I tried to do the same as one of your commentator shared for removing the navbar. And it worked for my blog. It removed the date on top of the post title. Go into Template Designer, Advanced, Add CSS, and add Peter's code:

    /* Posts
    -----------------------------------------------
    */
    h2.date-header {
    visibility:hidden;
    margin:1.5em 0 .5em;
    }

    Cheers for this great blog, I'm finding lots of answers!

    ReplyDelete
  11. Stephanie, it is the same. The Template Designer just makes it easier for you to add CSS to the template.

    ReplyDelete
  12. I just want to remove the date (month and year) from the URL

    ReplyDelete
  13. sorry,..I have some problem at here,..how to hide post header..post title already hide.

    ReplyDelete
  14. ??? Post header is your post title. Anyway why on earth would one wants to hide the post title as they are essential for telling what the post is all about.

    ReplyDelete
  15. Oh one more thing. Within the post itself we may want to add header of various importance and for that we have <h1> header tag with the largest font followed by <h2> header tag with smaller fonts and <h3> header tag with even smaller fonts.

    So not sure if you are referring to those header tags within the post itself as the post header?

    ReplyDelete
  16. Thanks. but how to remove it from blogger label page

    ReplyDelete
  17. There is an easier way to do this without editing the template directly. See Testing Blogger Beta and check a label page eg Label: Comments you would see that there are no date header.

    ReplyDelete
  18. your blog has been very helpful, waa, but i just get rid of the date, the month was still on my post, and ive tried other codes which is under post, but can't get rid of the month.. any advice?

    ReplyDelete
  19. one more thing, how am i able to add a navi pages? like yours, such as about us blablabla.. please help..

    ReplyDelete
  20. You mean the "Posted by.... at...." at the bottom of the post? If yes, then it is hidden the same way by unticking the "posted by..." in Configure post. See Testing Blogger Beta

    ReplyDelete
  21. im being slow on this one? url.. pls advice if im wrong meaning if ill make a page such as contact us the url i suppose must be www.jhayneLLe30.blogspot.com/contact-us?

    ReplyDelete
  22. I am guessing that you are referring to Blogger static pages which has different URL for posts permalinks. Something like
    www.bloggertipsandtricks.com/p/contact_02.html

    ReplyDelete
  23. How you you remove the month and year from the url's on blogger?

    For example: http://www.bloggertipsandtricks.com/2010/09/how-to-hide-blog-date-header.html

    How do you remove the 2010/09? Thanks so much!

    ReplyDelete
  24. Fitness Mom, excluding month and year has to be done by Blogger, not us. Do make your request at Feature suggestion: Exclude month and year from permalink

    ReplyDelete
  25. Thank you so much for this tricks... I love this...

    ReplyDelete
  26. Hi Peter,i am trying to find out the code
    /* Posts
    -----------------------------------------------
    */
    h2.date-header {
    margin:1.5em 0 .5em;
    }

    but i could not,is there idea to find out he code in my blog template? i will will be more appreciate with you great suggestion

    ReplyDelete
  27. hi there, I want to know if I can remove date (year & month) in my blog archive as I want to keep only the post title.

    the sample are in this page itself (right side)where it's look like:

    BLOG ARCHIVE

    2011
    2010
    DECEMBER
    NOVEMBER
    OCTOBER

    thore are exactly what I want to remove

    ReplyDelete
  28. The only way I can think of is doing it manually which will be a very tedious job if you have many posts.

    ReplyDelete
  29. I joined a certain bloge. There is the date/time on which I joind this bloge under "Activities" title.I dont want the date/time on which I joined the blog be visible.How can I do this ? Thanx

    ReplyDelete
  30. When I saw this tip I figured it would be the solution for my nightmares, because I found this code in my page, but it didn't work. =/

    I already added the "visibility: hidden;"to my html code. So now the code on my blog is exactly like this
    "h2.date-header{ visibility: hidden; margin:1.5em 0 .5em;}"

    Do you think it is possible to have any other code about the date/author post?

    My blog: www.studyamericas.no
    The template I use: http://btemplates.com/2011/blogger-template-marticorp/demo/

    ReplyDelete
  31. Belquior, did you see the update? There is an easier way to do this via configure posts

    ReplyDelete
  32. Yes, this was the first way I tried... =/

    ReplyDelete
  33. Hi,

    In my blogger template how can i break a rectangular box into two. I mean i installed a template and just below the header i have 728 px wide block which i wanted to break into two. How to achieve that?

    http://www.quizmantra.com/

    ReplyDelete