Aug 30, 2008

Attempt to validate a default Blogger template (II)

checklist
Image by RXAphotos

Read the first part of this post: Attempt to validate a default Blogger template (I).

5. This error is caused by an unescaped ampersand ('&') at the import of a dynamic CSS file (http://www.blogger.com/dyn-css/authorization.css?targetBlogID=xxx&zx=xxx). The import is not present in the source HTML, so it is added later. We'll just leave this one alone for now.

6. Many times declaring an incorrect Doctype messes up you entire validation. In this case there was a Strict Doctype declared, but the template included iframe tags (navbar). So I replaced 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
with 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">.
Remaining 68 Errors and 62 Warnings.

7. Some of these error are displayed by the "Edit post" button when you are logged in. Comment or delete the line <b:include data='post' name='postQuickEdit'/>. Others are displayed by the comments link at the bottom of the post. I describe how to fix these lower down the page.
Remaining 64 Errors and 58 Warnings.

8. These are personal and intentional errors to accentuate the fact that your posts also need to be written in valid html/xhtml. I added the alt attribute to the image and changed the closing tag to />. This needed to be done in the body of the post, not in the template.
Remaining 58 Errors and 58 Warnings.

9. Errors disappeared because of previous modifications

10. A lot of errors caused by the "Quick Edit Widget" buttons. I removed all of them by commenting them. A easy way to do this is to search for name='quickedit' inside the template and comment the entire element (<b:include name='quickedit'/>).
Remaining 39 Errors and 39 Warnings.

11. Problems caused by the fact that the archive is displayed as Hierarchy. The easiest way to fix this is to change the way the Archive is displayed. For this go to Layout - Page Elements and edit the "Blog Archive" gadget. I changed the Style parameter to Flat list.
Remaining 8 Errors and 8 Warnings.

12. Errors disappeared because of previous modifications

13. Errors caused by the unescaped ampersands in the dynamic css and the comments link. Note that there would be more errors if you have more posts on the specific page you validate (or less if you have less posts). This is the tricky part. Let's start with the comments.
Find the line that says:

<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>

The problem is with the expression expr:href='data:post.addCommentUrl'. This gets replaced by something like http://www.blogger.com/comment.g?blogID=xxx&postID=xxx and the problem is the unescaped ampersand. To fix this change the expression to this:
expr:href='"http://www.blogger.com/comment.g?blogID=xxx&amp;amp;postID=" + data:post.id'

where xxx is the id of your own blog. You can find out what your blog id is by viewing the current link. Note the hack that i used after blogID (&amp;amp;). This is because of Blogger's engine: every &amp; is replaced with &, but luckily the engine goes over the template only once. While this is a feature in blog posts, it's a problem in URLs. They do work, but they don't validate. This same method can be applied for "Email post" links if you have that activated. Just make sure you replace "comment.g" with "email-post.g"
Remaining 3 Errors and 3 Warnings.

14. Errors disappeared because of previous modifications

Now the only problems that remain are caused by the loading of a dynamic CSS file. From what I know this is a new "feature" and can not be removed. This first checks whether you are logged in to Blogger and according to that it creates a specific set of CSS rules. And because of the way it is added to the template, it makes it impossible to fix. Unfortunately, this also prevents my Yoboo from validating. And I was so happy when I saw that green bar a while back :(. I'll keep on looking for a solution to this. If anyone has any ideas, you're more than welcome to share.

And that's about all I can do for now (due to lack of time and mood). Note that I focused solely on the front page. It's very possible that other pages still have errors. I hope this helps you minimize the errors you encounter in your own validation experience. If you find that I missed something or you know of other ways to do things, please tell me your own methods to validate a Blogger template.

8 comments
Labels: ,

Aug 29, 2008

Attempt to validate a default Blogger template (I)

html/xhtml editing
Image by pitel

Because the previous post regarding validation had somewhat of a success, I decided to do another one. This time I decided to try to validate a default Blogger template and I will also try to be more exact in the steps you need to take. Please note that the solutions I provide might not be the best or they might not be suited for your own template. In several occasions I remove elements I personally do not use, but you might find useful. However the general pointers I give should apply across the entire Blogger platform.

For now, I will deal with the default Minima template. The reason I chose this one is that I consider it to be a very clean one (from a visual point of view), that many people choose for their blogs. And on top of that, it's the one Blogger selects by default when you create a new blog. That being said, let's begin.

Template: Minima
Front page, two test posts
Gadgets: Archive, Profile, Labels
Encoding: utf-8
Doctype: XHTML 1.0 Strict
Initial errors: 339 errors, 73 warnings

Leaving the template HTML unchanged, we do an initial validation check. This is to see the things we need to fix, obviously. So here we are, a list of the main errors, somewhat grouped:

  1. "Missing xmlns attribute for element html. The value should be: http://www.w3.org/1999/xhtml"
  2. Warnings: multiple comments in comment declaration
  3. There is no attribute "name". There is no attribute "description". There is no attribute "type". There is no attribute "default".
  4. Element "Variable" undefined. End tag for "Variable" omitted, but OMITTAG NO was specified
  5. General entity "zx" not defined and no default entity. Reference to entity "zx" for which no system identifier could be generated.
  6. There is no attribute "src" (<iframe src="http://www.blogger.com/navbar.g?targetBlogID=xxx" ... >). There is no attribute "marginwidth". There is no attribute "marginheight". There is no attribute "scrolling". There is no attribute "frameborder". There is no attribute "height". There is no attribute "width". There is no attribute "id". There is no attribute "title". ... element "iframe" undefined.
  7. general entity "postID" not defined and no default entity. reference to entity "postID" for which no system identifier could be generated.
  8. "Required attribute 'alt' not specified" and "End tag for 'img' omitted, but OMITTAG NO was specified"
  9. "There is no attribute 'target'"
  10. several "General entity not defined" caused by de quick edit buttons that you see when you are logged in to Blogger
  11. more "General entity not defined" caused by the archive toggle link
  12. many "XML Parsing Error: Comment not terminated."
  13. many "XML Parsing Error: EntityRef: expecting ';'"
  14. a few "Opening end ending tag mismatch".

 

validation editing
Image by svanes

So now let's start with fixing stuff. I started from the top rather that analyzing what are the major errors and fixing those first. The reason for this is that it's easier for me to follow. You can use whichever order you like. Another way I recommend to start is with the Doctype declaration. Analyze the page, see in which Doctype it fits (or in which one you would like to fit) and change things accordingly.

1. The error is pretty self explaining. When I checked the HTML code, there were already several xmlns declarations, but none of them appeared in the source sode of the page when viewed in browser. So I removed all of them and replaced them with xmlns="http://www.w3.org/1999/xhtml". After saving the template the deleted attributes reappeared. I guess they're needed for something.
Remaining 338 Errors and 73 Warnings.

2. There were two lines of dashes (-) before and after the copyright notice in the template. Although these were commented out, they still caused errors. So I removed them.
Remaining 256 Errors and 73 Warnings.

In the skin section there were more dashed lines under the different sections described by the CSS (header, sidebar, comments, ...) used to separate and organize them. Although only the header section style comments created errors, I removed all the lines just to be sure
Remaining 79 Errors and 62 Warnings.

3. Errors disappeared because of previous modifications

4. Errors disappeared because of previous modifications

Continue to part 2 of this post: Attempt to validate a default Blogger template (II)

3 comments
Labels: ,

Aug 1, 2008

Talk of the fair

talk of the fair
Image by jnxyz

These past days have been very agitated with one thing. It seems this one thought was on everyone's mind. A lot of well established bloggers talked about it. People like John Chow (from JohhChow.com), Darren Rose (from ProBlogger.com), Daniel Scocco (from DailyBlogTips.com), and many others, were talking about it. If you haven't guessed it by now, let me tell you. It's about the BlogMastermind.com training program.

Still doesn't ring a bell? Then this means you're not subscribed, either by RSS feed or by email, to any blog that has as point of interest the online money making niche. Ahhhh! you might say. Yes, it's yet again about making money online. Although I already openly stated that this blog will be a personal one, there are still some attempts of producing an online income. Failed attempts I might add. But that's another story.

I started to talk about the BlogMastermind Blog Profits Blueprints, as they are called by the author and the man behind the whole thing, Yaro Starak. The purpose of these is to teach you, a novice in the Internet business niche, how to produce an income through your website. A web-blog in this case. From what I could tell, these are only pointers meant to get you started in forming a strategy of your own. As Daniel Stocco says on the main page of blogmastermind.com: "I wish there was something like this around when I first started out making money from blogs".

But since this is not a post that is ment to promote a specific product or service, I will stop right there with the presentation. What I was planing to say was this: this program has been the "talk of the fair" these last few days. My RSS reader couldn't handle anymore Yaro Starak or BlogMastermind posts. It all started a few days earlier with the presentation videos (see first video). I admit, I was first very interested in what they had to offer. And I still am. But these days I'm waiting to leave on vacation, so I'm saving up the money I have.

Trying to keep up with what has happened in the world lately, I bumped into this program at every step. It might be the search patterns I use, the feeds I'm subscribed to or who knows, but I continually ended up at a page talking about it.

Today however, I curiously checked my RSS reader to see if there are any more feeds regarding this subject and I happily noticed there weren't. This might mean that it's finally over. At least for now. Soon I'll be expecting the wonderful results people have been obtaining through the blogmastermind.com training course. And then things start all over again.

And with that I end my pointless and random rambling. Hope I've got at least a few people bored or frustrated for loosing a few moments of their lives. After all, everyone needs a purpose. And this post's purpose is just that.

2 comments
Labels: ,