by anna on February 3, 2010
in feeds
New here? You may want to subscribe to the (free)
ABDPBT Tech RSS Feed. For an explanation of how RSS subscriptions work, please see
this explanatory post. Or, you can sign up to receive new ABDPBT Tech posts by
email (also free).
For a while now, I’ve had an ABDPBT Full Feed option for readers who want to get all of the ABDPBT blog feeds in one neat package in their RSS readers. I think it’s a good option to have the feeds available both individually and separately, so people can decide what they want to read. The problem is, all of the previous methods I had found for combining multiple feeds into one were either technically beyond me, or they didn’t work. For a while, my Full Feed has been just publishing titles or descriptions, which has annoyed me to no end. But I just happened upon a way of fixing this problem that is so easy and foolproof that I’m kind of smacking myself on the head for not figuring it out sooner.
That solution — and it pains me to tell you this on the same day as I featue a post on how Google is fucking scary, too, but that’s life, I guess — is to use Google Reader’s folders and public sharing options to combine your feeds into one. Here’s how you do it:
- First, subscribe to all of your feeds in Google Reader;
- Create a folder to hold all of them and name it something like MySiteFullFeed;
- Go to the Feed Settings for each feed and put them all in the new folder you’ve created;
- After all of the feeds are in the new folder, visit the Reader Settings and change the settings for the
new folder to “public”;
- Click on the “visit public page” link to get the new feed address;
- Copy that link to burn a new feed in feedburner; and
- Test it out in your reader by subscribing to the feedburner feed you just burned.
by anna on February 1, 2010
in CSS
Today I’m going to round out my series on letterpress with a tutorial on how to get a letterpress effect for type by using CSS only. This technique is going to make use of the text-transform property in CSS that is viewable in recent versions of Firefox and Safari. It won’t work, in other words, in Internet Explorer, but then what does work in Internet Explorer? And also, who cares? If you’re using Internet Explorer, you’re either not reading this post or trapped at a corporate job somewhere that won’t let you change your browser, so you can always check this out when you get home. Now. Where was I? Oh yes, the text-transform property. Here’s what we’re going to do: let’s look at the footer to my blog as it is right now.
We’ll just focus on changing the code on the heading to make it look like it’s been letterpressed for the purposes of this tutorial. Here’s the CSS that creates the “ABOUT” heading look at present:
.custom #footer_1 ul.sidebar_list li.widget h3 {
color:#ffffff;
font-family:Arial;
font-size:20px;
letter-spacing:0;
text-transform:uppercase;
}
Here’s how we’re going to change it to make it look letterpressed. First, add a text-shadow property, which will specify how blurry the shadow should be, where it should appear, and what color it should be. For letterpress to work, the shadow needs to be lighter than the color of the actual text, and the text should be a little darker than the background on which it appears. This is tough to do when your text is white, so we’re going to have to make some changes. We’re also going to have to make the text a little bigger to get it to show up. We’ll substitute the following code for what appears above:
.custom #footer_1 ul.sidebar_list li.widget h3 {
color:#666666;
font-family:Arial;
font-size:22px;
letter-spacing:0;
text-transform:uppercase;
text-shadow: 0px 2px 3px #999999;
}
This will give us the following effect:
Bear in mind that this effect only renders in certain browsers, so you need to use it on things that don’t matter as much if not everyone can see them. For users in other browsers, the headings with the settings above will still show up, but the text will be more difficult to read.
TWEET THIS
