Bugs, Worms and Death Stars

While I worked at GE on a consulting project, pretty much everyone called the GE logo “The Meatball”, so these logo nicknames resonate for me.

The Death Star is a fun one (not so much from AT&T’s perspective) that I’ve also heard. But the Two and a Half hotdogs is a new one for me.

(via Kottke)

WordTwit »« Disqus Custom CSS Styling in 3 Easy Steps

Disqus Custom CSS Styling in 3 Easy Steps

So I have been running Disqus on this blog for over a year now, and I am a huge fan of the service. [Ed note: I got a little fired up here, so feel free to jump right to the steps.] My prior experience with comments had me deleting at least a few comments daily, all being spam. Akismet has improved much since then, but with Disqus I now have only had to remove 1-2 spam comments this past year. That is fantastic results. I also recently checked a friends dormant blog and there were 112K spam comments missed by Akismet needing approval, yes, that’s thousands!

So this is a very cool tech company based in NYC with money from Fred Wilson’s Union Square Ventures (which is how I first heard of Disqus). But what I just don’t get is how they don’t give more support for changing the look and feel of the content they put on my blog.

I understand completely that they can’t actually help individuals with how to code their pages, but the best info they have is on this Disqus wiki page on Custom CSS? I would love to hear any non-html-developer try and make use of that page. It was either written by developers who have long forgotten what it is like to deal with non-developers, or the lawyers got involved (And I don’t consider myself enough of an expert on the topic to start editing their wiki page). By support, all that is needed is a good sample and walk-thru webpage.

Now Disque is a completely user-friendly service that requires only a bit of copy and paste of a line of code, it is perfectly targeted at the non-technical (blogging) audience, yet they really dropped the ball at the last possible moment. Their code and styling look great on untextured white background, and nothing else, and pretty much disappear on a black background based site like mine.

So I mentioned I have been using Disqus for a year, so how did I solve this problem? I didn’t. For the last year I have had black text comments on a black background. You see, when I set this up, I went to try and change the styling from the Disqus admin, where of course it is never even mentioned. From a Google search, all I got was the above page telling me to create something from scratch using whatever elements listed on the page I wanted to use, which frankly is so unhelpful and a waste of my time. So since I have have a very low commented site, I didn’t bother.

But now I actually know enough CSS to be dangerous, so I thought I would finally tackle the issue. As a bonus I assumed with a year passed there should be some better examples floating around, but I was wrong. So now I am providing what I did to solve this simple issue, that I have seen many many people still have.

So here is my own sample for anyone trying to create custom background and text colors for Disqus in three easy steps:

Step 1: Start with a Disqus CSS sample, here is mine: disqus-form.css and save it so that you can edit it.

Step 2: Edit it. HTML and CSS can look scary, but you only actually have to start with one small section to change the background and font text color for the entire Disqus section (which is all I’ve been trying to do). Then upload the file to your blog.

/* Everything Disqus on your page is contained within this. */
#disqus_thread {
background-color: #000000;
color: #ffffff;
border-style: solid;
border-color: #cccccc;
padding: 5px;
}

Now this looks intimidating, but all you need to know about colors is that “ffffff” is white and “000000″ is black (“cccccc” is gray). So my background color is black and my (font) color is white. If you want to get more tricky then those, look up your html color. Border-color is a gray line around the Disqus area, and the Padding gives a little space around the outside (5 pixels worth).

Step 3: You will need to add the following bit of code to your WordPress/blog header template file, inside the “head” tag. Change “yourblog.com” to your blog address and where you uploaded the file. Save the template header when done.

<script type="text/javascript">var disqus_iframe_css = "http://www.yourblog.com/disqus-form.css";</script>
<link type="text/css" rel="stylesheet" href="http://www.yourblog.com/disqus-form.css" media="screen" />


Guess what, you are done. Hope this helps.

I think it is ALWAYS better to provide a template that has good simple notations for people to make changes, so I grabbed the initial CSS file from this forum post. Most of the advice was to add only the first line to your template header and make half the changes to the CSS in your blog’s template CSS, and I find that too confusing, so I combined them into the same file.

I know I didn’t explain how to find your template files or what all the CSS options are, or even what CSS stands for (Cascading Style Sheets), but that’s what Google is for once you get the basics done. Good luck.

[Ed: added a link to the initial CSS file]

Bugs, Worms and Death Stars »« Twitter, Flickr backup with LifestreamBackup

Obama’s Acceptance Speech

These word mash-ups are getting very popular these days, like the one above on Obama’s Acceptance Speech in Denver. It would look great on a tee-shirt though.

Thanks to Wired and Wordle.

Google’s Assault on Windows »« Plaxo on a Mac Mini Causes Screen Freeze

WordPress for iPhone

Just added the iWPhone Plugin for WordPress, that creates a really nice looking version of this blog if you are using an iPhone, like I am prone to do.

Totally easy to install and looks painless so far, took all of 2 minutes and didn’t require me to touch my current theme… beautiful.

No Internets »« Cheyenne Diner

Tech Logo Evolution

A great post from Neatorama on the evolution of some tech companies logos, with an interesting history of them. As you can see by the image, Apple is included, as is Google, IBM, and others.

Rumor has it that the bite on the Apple logo was a nod to Alan Turing, the father of modern computer science who committed suicide by eating a cyanide-laced apple. Janoff, however, said in an interview that though he was mindful of the “byte/bite” pun (Apple’s slogan back then: “Byte into an Apple”), he designed the logo as such to “prevent the apple from looking like a cherry tomato.” (Source)

In 1998, supposedly at the insistence of Jobs, who had just returned to the company, Apple replaced the rainbow logo (“the most expensive bloody logo ever designed” said Apple President Mike Scott) with a modern-looking, monochrome logo.

Thanks to TechCrunch.

Spore as a Casual Game »« Man to Man Hugs

Google Reader Search

Looks like Google Reader has finally added search, a long overdue feature. Always surprised me that a Google product didn’t have search. Now if I only knew when it will show for me…

Thanks to Matt.

[Update] 5 minutes after my post it is now included.

Web 2.0 Dilbert Humor »« The Sketches

iPhone

I want.

• OS X
• 2-megapixel camera
• 4 ($499) or 8GB ($599) versions
• 3.5-inch, 160-pixel per inch patented touch screen
• 11.6mm thin
• Cingular in July

Lots of peeps covering this: Om, Engadget, TechCrunch, Jason.

Condos Are for Rent »« vFlyer and Online Classifieds

7 Essential WordPress Hacks

As a WordPress user, Chris Pearson has an excellent video series on essential plugins and tweaks.

1. How to Get More Search Engine Traffic With One Simple Tweak
2. How to Make More Money With AdSense
3. Feedvertising: Make Money With Your RSS Feed
4. More Feedback, Less Spam: WordPress Contact Form Plugin
5. How to Increase Comments and Page Views With One Quick and Easy Plugin
6. How to Stop Comment Spam without Lifting a Finger
7. Back Up Your Blog or Risk Losing It All

Found this thru CopyBlogger.

35 »« Google Landing Pages

Websnapr

Just added some new blog bling to the site. Links will now include bubble screenshots when you mouse over them, giving a preview of the page that is linked. Specifically I am using the Snapr WordPress Plugin that easily integrates the Preview Bubble JavaScript.

Samples:

• CNN
• NYTimes
• Google News

Firefox 2 »« iPod Family Tree

Site Visualization by CrazyEgg

One thing about web design changes is that its difficult to really know what people are actually doing on your site. WebTrends does have a stats overlay feature, but like Google Analytics, really only works on the site level, and we all know what issues web analytics have.

CrazyEgg allows for site monitoring specifically around tests, so different versions and changes can be analized. Tests can be run by timeframe or by the number of visitors. All thats required is a little JavaScript on your site.

Test different versions of a page to see which works better

• Discover which ad placement gives the best results
• Find out which design encourages visitors to click deeper
• Learn which content leads to improved sales

Crazy Egg is designed to help you continually test and improve your site.

Got the word from the BivingsReport.

New Look and Feel »« Food Theft is a CRIME