--> Use Human Readable "Date Format" in Blog Posts | Experience Lab - Online business creation and development guide for bloggers and startups

Use Human Readable "Date Format" in Blog Posts

This is probably the most request posted on blogger Timestamp and Date header format. This simplest trick of converting date formats in Blog...

Change Date Format of Posts in BloggerThis is probably the most request posted on blogger Timestamp and Date header format. This simplest trick of converting date formats in Blogger blogs is thus first time shared online using Data Layout Tags. The date inside BlogSpot posts are displayed in the format "MM/DD/YYYY" which is a non-readable formatting for mentioning the publishing time and date of an article. If you see the date format in MBT posts (i.e. Nov 21, 2015) you will observe that the formatting is done in a more human readable and visual way where Month and Day are comma separated from Year ( i.e. Month Day, Year ). The month is written in short abbreviated way followed by day and then year. A reader gets a clear idea of when the post was published by looking at the date at a glance instead of getting confused with the Western and Asian Date formatting of "MM/DD/YYYY" and "DD/MM/YYYY" respectively. In this tutorial we will use the simple technique of replacing the Timestamp layout tag inside posts with Date Header tag. In our JSON Tutorial series we will discuss a more advanced JavaScript approach to better control the styling of each element in the date formatting.


non-readable Date format


Readable Date Format

Change Blogger Date Formatting inside Blog Posts

Follow these easy steps:

1 Go to Blogger > Template > Backup your template

2 Click Edit HTML

3 Search for this layout tag


4 The above code will appear twice. Once for mobile view and once for desktop view. Replace it twice with this layout tag:

<i class='fa fa-clock-o'/><data:post.dateHeader/>

Note: The yellow highlighted code will show a clock Icon next to the date, if you don't want this FontAwesome icon then simply remove the yellow code.

5 Save your template and you are almost done!

6 Next go to Settings > Language and Formatting > Formatting

From the drop down menu next to the Date Header Format select the first option i.e. Nov 21, 2015:

Post Date Formatting in blogger

You can choose any formatting of your choice, the last two options are also good. In our case we chose the format: Nov 21, 2015

Date header formats

7 Click the "Save Settings" button and you are all done!

Need Help?

What we did was a simple solution to the existing problems faced with Post Date formatting. In our JSON tutorial we will adopt a JavaScript technique to give more advance control over the structure of Date. With that tutorial you will be able to style Month, Day and Year elements separately using CSS classes. The current solution is the easiest way for non-techy users. I hope this helps most in better displaying the Publish Timestamp on their blog posts. Do ask me any question you may have.

Peace and blessings buddies :)



Affiliate Marketing,12,Announcement,34,Bing,9,Bitcoin,38,blog,7,Blogger Resources,42,Blogger Templates,4,blogger tricks,156,Blogging ethics,70,Blogging tips,198,Bugs and Errors,34,Business,9,Copyright Violation,9,CSS and HTMLTricks,95,Designs,8,drop down menu,7,eBook,12,Email Marketing,7,Events,30,Facebook,30,Facebook tricks,49,Google,157,Google AdSense,42,Google Analytics,7,Google Plus,51,Google Plus Tricks,38,Guest Posts,112,home,2,How To,77,Internet,1,JSON Feeds,25,Kitchen Recipes,2,Label Based Sitemap Themes,1,Make Money Online,108,Marketing,16,MBT Blogger Templates,7,Menus,1,News,146,Pages,1,Posts,10,presentations,15,Responsive,10,Reviews,7,SEO,307,Settings,6,Shortcode,15,Sitemap Themes,1,Social Media,155,Technology,7,Templates,1,Tips,2,Tools,1,Traffic Tips,80,Video,19,Web Designing,62,web hosting,18,Webmaster Tools,97,Widgets,199,wordpress,26,
Experience Lab - Online business creation and development guide for bloggers and startups: Use Human Readable "Date Format" in Blog Posts
Use Human Readable "Date Format" in Blog Posts
Experience Lab - Online business creation and development guide for bloggers and startups
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS PREMIUM CONTENT IS LOCKED STEP 1: Share. STEP 2: Click the link you shared to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy