Expression Engine community knows that the default template of RSS 2.0 feeds has some major issues. During a project for a client I had the chance to work with it and make it a bit better.
In details:
- The new template merges the feeds of different weblogs of the same website.
- It solves the following issue: when a published blog post is being edited it reappears in the feed reader as new.
- It solves the following issue: Feeds look unformatted at all. No paragraphs, lists, images etc. The new template shows the feed the way it should.
- It shows the category and/or tags of the post. Both category and tags are clickable and transfer the user to the relevant areas of the website.
- It brings the Tweetmeme button which shows how many times the post has been retweeted. Of course the button is interactive.
This new template has been tested in Google reader, NetNewsWire and Fever.
You can find it in the official Wiki of Expression Engine.
Please test it and make it better. You can add your comment here or in the Forum of Expression Engine.
CSS hacks are lines of code inside a CSS file which replace certain code with another in order to achieve the best possible design for all browsers.
Actually most of the hacks have to do with Internet Explorer 6 and below. Everybody knows that IE has caused the most troubles in Web design and it still does.
The following hacks are simple solutions which can be easily applied, not a complete guide to CSS hacks.
The !important hacks
#nav {
border: 1px solid #ccc; !important;
border: 1px solid #ccc;
}
This hack is based on the fact that IE6 (and below) cannot treat many properties in a rule. Thus, IE will read the second property and it will ignore the first, while in the modern browsers the !important will prevail.
Since old IE cannot treats dotted lines as dashed, dotted borders look ugly. Thanks to this hack we have an at least solid line as a border for IE.
IE7 knows how to treat dotted lines at last.
The star hack
a:hover {
border: 1px dotted #ccc;
}
* html a:hover {
border: 1px solid #ccc;
}
The first part of the code applies a rule and the second overrides it. This is something that old versions of IE understand.
So, as it happened before, the dotted border is bypassed by IE.
The child selector hack
html>body{
background: url(back.png);
}
This hack hides from old versions of IE the image back.png.
This happens thanks to the child selector “>” which cannot be recognized by IE. The modern browsers, including IE7, read it and apply the background image.
If this back.png image was a transparent one, this hack might have been a very convenient solution. As everybody knows transparent .png files are also not recognized by old IE.
The attribute selector hack
div[id="content"] {
background: url(back.png);
}
Like before, there is a selector, the attribute selector “[id=”...”]”, which means nothing to IE6 and below. The result is a background image which can be seen in modern browsers but not in old versions of IE.
Apart from these hacks there is another way to solve problems caused by Internet Explorer: the Conditional Comments. I wrote about them a short time ago. I can’t recommend the one solution or the other but little by little I find hacks more convenient for me.
