Adding a CSS StyleSheet to your RSS Feed

It's pretty easy to add a CSS stylesheet to your RSS feeds. I created one in about 10 minutes for my RSS feed. You can do a lot more with an XSL stylesheet (turn links into clickable links, etc), but CSS can make your feed look much less scary for the non-technical crowd. And the good news is you probably already know CSS, so setting one up is trivial...

To start you need to add a xml-stylesheet tag to your RSS feed:

<?xml version="1.0" ?>
<?xml-stylesheet type="text/css" href="https://example.com/rss.css" ?>
...

Next you need to create a CSS file called rss.css, inside it you can define how each RSS tag is displayed. Here's an example that will work for an RSS 2.0 file, you may need to add a few more elements to the display: none rule:

rss {
display: block;
font-family: verdana, arial;
}
title {
display: block;
margin: 5px;
padding: 2px;
color: gray;
border-bottom: 1px solid silver;
}
link {
display: block;
font-size: small;
padding-left: 10px;
}
item {
display: block;
padding: 2px 30px 2px 30px;
}
docs {
display: block;
background-color: #ffffe6;
margin: 20px;
text-align: center;
padding: 5px;
color: #7f7f7f;
border: 1px solid silver;
}
/* all hidden elements */
language, lastBuildDate, ttl, guid, category, description, pubDate {
display: none;
}

You will notice that I use the docs tag to tell the user that they are looking at a RSS feed, and provide a url for more information. This is probably a good thing to do, you could include that info in the description tag, but that tag often is used by aggregators.