0 users online. Create an account or sign in to join them.Users

Search

That's great to hear! Thanks, Michael.

I updated the HTML5 Doctype extension to 1.2.4 so you should be able to use classes on the html element now. Now, all that happens is the removal of the xmlns attribute for XHTML and the xml:lang namespace.

Is it also somehow possible to use this in ht ehead, too?

<script>document.body.className += 'js';</script>

slight fix to your js: document.documentElement.className += 'js'; This is so that the browser (IE) definately adds class of JS to the head tag instead of body (its more useful up there)

Thanks Michael, I was wondering what the performance implications were.

This is so that the browser (IE) definately adds class of JS to the head tag instead of body (its more useful up there)

But my problem is the combination of adding js to AND using the HTML5 Doctype extension. The HTML5 Doctype extension rewrites the tag and nothing is added.

@padexx, this extension does nothing to the body element. You'd be better off following @Fazal's advice, which works fine in my tests.

The problem is that if you are trying to add that script to the head, it will never work. The script fires before the body element loads, which results in no effect. However, if you put that script after the closing body tag, you'll find that the script works fine. If you want that script in the head, you'll need to make sure the document is ready.

Sorry, I meant HTML tag, not head. If you put that script inside the HEAD tag it should work fine.

If that doesn't work and if you really need it to fire quicker, maybe you could try adding an onLoad event to the body tag?

I was up until 3am last night reading this discussion through and experimenting with some of the approaches. I now have a slightly better understanding of why HTML5/XSLT can be tricky - thanks for all the interesting info and work you've made available guys.

I didn't find any "all-in-one solution" to using HTML5 with XHTML syntax/indenting plus the necessary (for me) classes (no-js and iex) on the html tag, so I put what I came up with by tinkering with what others had until it matched the way I like into a utility: HTML5 Master Stylesheet (XHTML syntax with indenting). I thought it might be useful for anyone who's confused and not sure what to try next regarding this issue.

textarea seems to be fine, and IE styling/new-element-using is sorted via Modernizr.

I'm new to XSLT and Symphony despite having been keeping an eye on Symphony for a while, so please let me know if I've got anything wrong or if something could be done better. Thanks!

@bauhouse and Fazal thanks for your patience. The true problem was that I was stupid enough to believe the "js"-class would show up if I look into the delivered code of the web page (stupid me). Tested it with some css. Works!

@DavidOliver Thanks for putting this together

Another easy way to style for browsers without javascript would be:

<html class="nojs">
    <head>
    &lt;script>(function(B,C){B[C]=B[C].replace(/bnojsb/,'js')})document.documentElement,'className');&lt;/script>

The true problem was that I was stupid enough to believe the "js"-class would show up if I look into the delivered code of the web page (stupid me).

Firebug shows the modified markup.

Another easy way to style for browsers without javascript would be:

Thanks for that. I'm not a JS guy, but as I'll want Modernizr for other stuff I thought I'd let it handle this, too.

By the way I am also having some difficulties to integrate the code for the local jquery fall back (also used by boilerplate)

&lt;script>window.jQuery || document.write('&lt;script src="js/libs/jquery-1.5.1.min.js">x3C/script>')&lt;/script>

I guess this has to be modified to match xslt

By the way I am also having some difficulties to integrate the code for the local jquery fall back (also used by boilerplate)

The below seems to work, but it results in most of the head section being put onto one line - not a show-stopper, but perhaps someone can say why and how to keep things on their own lines.

<xsl:text disable-output-escaping="yes">&lt;script&gt;window.jQuery || document.write('&lt;script src="js/libs/jquery-1.5.1.min.js"&gt;x3C/script&gt;')&lt;/script&gt;</xsl:text>

@david

i'm using your new stylesheet and it's pretty fantastic. great work!

i wanted to point something out to you that may save you some headaches in the future. you can call xslt variables and node values inline by enclosing them in curly braces. so, your lines:

 <body>                                                                                                                                          
     <xsl:attribute name="class"><xsl:value-of select="concat('page-',$current-page)"/></xsl:attribute>

could be shortened to something like:

 <body class="page-{$current-page}">

i use this method very very liberally, especially when creating dynamic urls and element class/id names. i thought i'd share!

edit: a side note: this can only be done inside attribute declarations, so something like <p>{$current-page}</p> won't work

Thanks fawx. I'll likely include that tweak in an update. I'm sure there'll be other improvements and additions to be put in.

edit: a side note: this can only be done inside attribute declarations

Ah - that might explain why it sometimes doesn't work for me leaving me wondering why. :)

Create an account or sign in to comment.

Symphony • Open Source XSLT CMS

Server Requirements

  • PHP 5.2 or above
  • PHP's LibXML module, with the XSLT extension enabled (--with-xsl)
  • MySQL 5.0 or above
  • An Apache or Litespeed webserver
  • Apache's mod_rewrite module or equivalent

Compatible Hosts

Sign in

Login details