Which CSS to add?

[Boy]

I would like to use a placeholder for a message saying "Last update on [Date]". I found some code on the internet but I would like to adjust the font, size and color. I was only able to adjust the color. The font continues to be Arial and the size retains its default size. Any ideas what's wrong in the code?

<SCRIPT LANGUAGE="JavaScript">
function Initialize()
{ this.length = Initialize.arguments.length
for ( var i = 0; i < this.length; i++ ) this[ i + 1 ] =
Initialize.arguments[ i ]
}

var DayOfWeek = new Initialize("Last update", "Last update", "Last update", "Last update", "Last update", "Last update", "Last update" );
var MonthName = new Initialize("Jan.", "Feb.", "Mar.", "April",
"May", "June", "July", "Aug.", "Sep.", "Oct.", "Nov.",
"Dec.");
var LastModifiedDate = new Date(document.lastModified);

document.write(DayOfWeek[(LastModifiedDate.getDay() + 1 )] ,": ");
document.write( LastModifiedDate.getDate() ," "  );
year=LastModifiedDate.getYear();
if (year<100) year+=100;
if (year<1000) year+=1900;document.write(MonthName[(LastModifiedDate.getMonth() + 1)] ," ",( year ) );
</SCRIPT>

<div style="font:open-sans;font-size:18px;color:004c7e">
<!-- SCRIPT OUTPUT -->
</div>

[mwenz]

The 3rd from the last line is:

<div style="font:open-sans;font-size:18px;color:004c7e">

Which should be able to be changed. Depending upon when it gets loaded, you may need to add !important at the end (before the close angle bracket, and make sure to add the semi-colon before it...).

[Boy]

Thanks Mike, but could you spell that out for me? I don't seem to get it to work....

[Acorn]

Try playing with something like this:

<div id="updated" style="font: open-sans; font-size:18px; color:004c7e">&nbsp;</div><script>
var updateDate = new Date(document.lastModified);
document.getElementById("updated").innerHTML = updateDate;
//alert(updateDate);
</script>

Acorn

[Boy]

Thanks Acorn. Still stumped though and don't get it to work. Should I place this at the end?

[Acorn]

As it returns something inside a DIV tag, it needs to be in an object's placeholder body code.

Acorn

[gwpriester]

Acorn - I think the question is should the script you provided be added to the end of the original script posted, if I am understanding Boy's last post correctly.

[Acorn]

Here's a simple example - the detail is in the Names and in the Placeholder HTML code (body).
You change font and colour as normal through Xara.

JS - PageUpdateDetails.xar

You can change the substr parameters for the start point and the number of characters to return.
Each textline and associated code need a different Name if they are on the same page or different across a Supersite.

Acorn

[Boy]

Gary, you were right, that was my question.

Brilliant Acorn. Short and simple. Thanks. But now the following question: Can I change the date to European format (day, month, year) and possibly have the months in another language, which I could do with the code I posted earlier?

[Acorn]

Gary, you were right, that was my question.
Brilliant Acorn. Short and simple. Thanks. But now the following question: Can I change the date to European format (day, month, year) and possibly have the months in another language, which I could do with the code I posted earlier?

You could change toString() into to UTCString() or even toLocaleString().
You can always use substr(from, length) to cut out bits of the date and time and then join them back together with the + operator.

For other languages, you need toLocaleString(language, options).

var options = {weekday: "long", year: "numeric", month: "long", day: "numeric"};
document.getElementById("petra").innerHTML = updateDate.toLocaleString("de-DE", options);

Acorn

P.S. In the end there was no CSS to add as Xara does the styling. We have JavaScript to take the Date object and parse it into readable chunks using locales: https://developer.mozilla.org/en-US/...toLocaleString.