There’s a dynamic date and time field on these pages.
The Arabic numerals are being pulled from the font of the page.
The pages have hreflang in the code, if it helps. Is there for example a way to code some sort of java to format the date and time according top the hreflang?
Example for FR, for landing page only (http://cdl.webflow.io/fr/home).
Insert into page settings last custom code field.
Do the same for the other pages, but change the variables.
<script>
var Webflow = Webflow || [];
Webflow.push(function() {
$.getScript('https://momentjs.com/downloads/moment-with-locales.min.js',
function() {
// Get all the classes here
$('.p-t-11').each(function() {
// Try to parse the contents into a date using this format
var d = moment($(this).text(), "dddd, MMMM D, YYYY");
// If it's a valid date
if(d.isValid()) {
// Convert to another locale, and in a new format
var newDate = d.locale('fr').format("dddd, MMMM D, YYYY");
// Replace contents with the new date
$(this).text(newDate);
}
}); // End each
}); // End getScript
});
</script>
Also, feel free to contact me for further code help and/or customization of third-party plugins
Updated code. This will find all p-t-11 classes, parse the text into a date. If it’s a valid date, convert to FR locale and replace the displayed value.
To test that it works, paste the code without the script tags into the console.
“Wednesday, April 13, 2016” will now be displayed as “mercredi, avril 13, 2016”
So, let me get this. if i need it to work on another class, i just update the class name?
I also want to parse the time, i simply change the format right?
Thanks for all of your suggestions and help on this post.
I’m switching my project to SSL and in doing so, I simply wanted to have no external dependencies on other sites, especially HTTP sites. And MomentJS was one of them.
I know that momentjs is now HTTPS, but I’m thinking of copying the code and inserting it into my custom code block in site settings instead.
Do you have any thoughts on pasting inline JS into the site settings code block?
Hi @samliew Thanks a lot for this post, I’m trying to set this in one of my clients site but it doesn’t work… The dates is supposed to be display in Spanish.
Can you tell me what I’m doing wrong?
Hey guys. Not sure why people are still using Moments.js.
Just use the following code in an embed field to format dates into your region. No waiting for the text to be replaced etc. either.
<script>
{
var d = new Date('DATE/TIME YOU WANT TO REFORMAT');
document.write(d.toLocaleString('nb-NO', {year: 'numeric', month: 'long', day: 'numeric'}));
}
</script>
Insert the date (or a dynamic date field from a collection item) into 'DATE/TIME YOU WANT TO REFORMAT'.
You can change the country formatting by switching out 'nb-NO' to the correct country (see list of codes here).
You can change the formatting of the actual date / time by inserting options where the {'year: 'numeric', month: 'long', day: 'numeric'} are (see list of options available here).
Do you know if it’s possible to show the text “tomorrow” or “today” when the date is next/this day? I’ve searched and couldn’t find any option for that.
If you’re using the date in a collection item template, then you can simply add a text box that says “tomorrow” or “today” and make the conditional visibility so that it’ll only show on the day in question