Mostly about my amusement
Over at my brother Stefan’s blog, he’s been running Movable Type for years. It bugged be because his server was slow, the theme was dated, it lacked a good archive page, etc.
Mostly I did not like the look or the speed. Stefan takes really good pictures and I thought he should have a web site that can show off some of his work. What I ended up showing him was good enough that he told me to go ahead and do it.
Read on for what I had to do to make it all work. Read more
Making the Google embedded code XHTML Strict was pretty easy and involved replacing <iframe> with <object> and massaging some of the parameters.
This works in Firefox and Opera. Naturally it does not work in Internet Explorer 7. There is a hack that might get it to work which I will keep fooling around with.
The iframe code validates and works fine in XHTML Transitional; I’m just playing with strict for grins.
Update: Using the <object> instead of <iframe> not only does not work in Internet Explorer 6 or 7, but locks that browser up. I’ve put back the original iframe code.
I’ve had some free time so I’ve added so I went through all my posts (153!) and made sure they validate as XHTML strict. I’ve also played with this theme and added the image rotator for the header.
Using Matt’s rotate.php script, I created a directory called and dumped some images in there. The images were lifted from Stefan’s Flickr page. His pictures are great and I was using one of his images as a banner already.
In my CSS file I replaced the
#header {
background: url(img/bus.jpg) no-repeat bottom;
with
#header {
background: url(img/rotate.php) no-repeat bottom;
Per the CSS for my header the files should be 700×175; which I forgot and created 700×200 images. No big deal the CSS fixes the images to fit.
The fun part was getting the caching to work so I could see the files and how they look. Internet Explorer and Firefox cache the page to make the whole experience is faster. But that also means that when I reloaded the page the banner would not necessarily change.
Using Google I found that adding the following right below the <head> statement in my header.php would get Internet Explorer and Firefox to reload the whole page with a new banner (most of the time).
<meta http-equiv=”Expires” content=”Tue, 01 Jan 1980 1:00:00 GMT” />
<meta http-equiv=”Pragma” content=”no-cache” />
I turned it off after my curiosity was satisfied. Caching is your friend and should be respected.
WordPress themes are usually either XHTML 1.0 Transitional or XHTML 1.0 Strict. The first line of the generated web page has the Document Type Definition (DTD) sent to the browser to define which.
My main theme that I use FastTrack, was defined as transitional. Just for kicks I changed it to strict and figured I would use the W3C validation service to identify what needed to be changed to make it validate.
I did not have to change much. The built in TinyMCE editor produces img tags that are not XHTML 1.0 Strict compliant. For example an image will have the tag defined as
<img src=”http://blog.dembowski.net/wp-content/costco-harmony-720.jpg” title=”Logitech Harmony 720″ alt=”Logitech Harmony 720″ align=”right” hspace=”5″ vspace=”5″ />
The attributes align, hspace, and vspace are valid XHTML 1.0 Transitional but not strict.
In order to make it valid for strict I had to lose those attributes. In strict this is valid:
<img src=”http://blog.dembowski.net/wp-content/costco-harmony-720.jpg” style=”margin: 5px; float: right” title=”Logitech Harmony 720″ alt=”Logitech Harmony 720″ />
The align attribute is not valid for <p> tag either, this requires another replacement with a style= statement.
In the theme I replaced one that was using <p align=”center”> with <p style=”text-align: center”>.
The last thing was to change strike through and underline. I used to put in the post via the code tab <strike>text</strike> which is not valid in strict. Neither is <u>underline</u>. I replaced that with <del>text</del> to have a line through the text and <ins>text</ins> to get underline.
I’m not particularly concerned about XHTML compliance. This and playing with CSS entries is just part of my learning and understanding how this all works.
