HTML&CSS Change Date Formatting On Whole Web Page

Question

I am working on a portlet which will be used by multiple users throughout the world, therefore we would like to change the basic date format of EVERYTHING on an Html page from default to DD/MMM/YY where MMM is an abbreviation because the default is somewhat confusing depending of your country (aka USA or somewhere else)

aka 05/05/2014 should show up as 05/May/14
and 06/08/2015 should show up as 06/Aug/15

Since all of the dates need to be written that way, maybe it's only a line of code in the CSS or HTML file? I looked around and couldn't find anything about abbreviated dates, therefore I'd rather directly ask the professionals.

Tordah, welcome to Stack Overflow! I have a couple of comments I hope will be helpful: We typically leave off things like salutations and signatures here to avoid the clutter; consider removing the "thanks!" and everything that follows it. I'd also recommend stating your question unequivocally at the end: "What is the best way to format all dates on a web page in this way?" — Benson, May 29 '14 at 18:19

score 1 · Answer 1 · edited May 23 '17 at 12:11

I would wrap all dates in a <time> element, then use JavaScript to convert that to a local date format.

HTML:

Published <time datetime="2011-07-03">07/03</time>

JS:

var elements = document.getElementsByTagName("time");
for (var i=0; i<elements.length; i++) {
    var dat = new Date('UTC:'+elements[i].getAttribute('datetime'));
    elements[i].innerHTML = dat.toLocaleDateString();
}

http://jsfiddle.net/mblase75/7yF5v/

HTML&CSS Change Date Formatting On Whole Web Page

1 Answers1