The Copyblogger Theme for WordPress

by Chris Pearson

When Brian rolled out the latest design for Copyblogger, he promised to chain me to a computer and whip me until I was able to resurrect the old design as a ubiquitous WordPress theme.

Copyblogger Theme for WordPress

Today, I’m happy to announce that the chains have come off, the welts on my back are beginning to heal, and you, my friends, have a brand new toy—the Copyblogger Theme for WordPress.

“Even Better than the Real Thing”

When Bono sang those lyrics for U2, he was almost certainly talking about this new theme (yeah, he’s clairvoyant). With a completely updated XHTML and CSS framework, the new version of Copyblogger 1.0 is leaner, cleaner, and more intricately detailed than its predecessor, which graced this site for 14 months before being swept into the electronic dustbin.

Here are just a few highlights of the new Copyblogger theme:

  • Clean markup that has been meticulously optimized for maximum SEO performance
  • Em-based sizing, so the layout scales beautifully and maintains aspect ratios even when text is resized
  • Typography set to a very strict grid which produces a clean vertical harmony between the main content and the sidebar content as you scroll down the page
  • Killer comments
  • Widget ready
  • Totally customizable color schemes via the use of custom.css, a special stylesheet that you can tweak without fear of messing up anything on the theme!

Check out the stylistic goodness for yourself over at the Copyblogger Theme Demo.

So You Want to Customize It…

One of the things that I’ve found to be true in the theme development world is that you simply cannot give people enough flexibility with regard to the elements they can customize on their own—things like colors, type faces, sidebar widgets, etc. The challenge, of course, is to accommodate all of these things in an elegant, seamless manner that does not “break” the theme or even disrupt the continuity of the text on the page.

To deal with this problem, I created a customizable skeletal framework on a separate stylesheet called custom.css. This fully-outfitted CSS file contains definitions for every element whose color can be changed. The end result is a remarkable flexibility that will allow you to tweak colors and fonts without the hassle of digging through confusing CSS or worrying that you might be causing irreparable damage to the stylesheet.

Copyblogger OrganicAs with most things of this nature, the best way to learn it is to do it, and to help you do it, I’ve created a special custom style package for the Copyblogger theme called Organic. It makes exclusive use of the custom.css file to initiate all of the styling changes, so in theory, the ambitious among you ought to be able to produce something that is uniquely customized to suit your taste.

Installing the Organic style package (or any custom style package, for that matter) is pretty darn simple. All you have to do is place the custom.css file and the /custom folder inside your Copyblogger theme directory, refresh your Web site, and boom—new styles!

Download it Already

If you change themes more often than you change clothes or if you’re simply looking for a top-notch theme that’s been given inordinate amounts of TLC, the Copyblogger Theme for WordPress has got you covered.

Check out the demo site for more info on the theme and to take it for a spin!

Download the Copyblogger theme.

Download the Organic custom style package.

Questions or comments about the theme? Head over to the demo site, which contains detailed answers to common questions you might have. Thanks!

Thanks!

Related Articles

Copyblogger runs on the Thesis Theme for WordPress

Thesis WordPress theme

Thesis is the search engine optimized WordPress theme of choice for serious online publishers. If you’re a blogger who doesn’t understand a lot of PHP, Thesis will give you a ton of functionality without having to alter any code. For the advanced, Thesis has incredible customization possibilities via Thesis hooks.

With so many design options, you can use the template over and over and never have it look like the same site. The theme is robust and flexible enough not only to accommodate a site like Copyblogger, but also to enable the site to run far more efficiently than it ever has before.

{ 91 trackbacks }

Copyblogger | Unmatched Themes
May 22, 2007 at 1:38 pm
Copyblogger Theme GOES Public : WordPress Themes
May 22, 2007 at 1:48 pm
  WordPress Theme: Copyblogger by Blogging Pro
May 22, 2007 at 8:09 pm
Time to Try The New Copyblogger Wordpress Theme
May 22, 2007 at 9:42 pm
WordPress Theme: Copyblogger - Money Making Blog How To
May 23, 2007 at 6:15 am
Blog News Watch » Blog Archive » Wednesday Roundup: May 23, 2007
May 23, 2007 at 9:41 am
New Theme to use for WordPress - Idiot Affilate
May 23, 2007 at 10:16 am
Copyblogger WordPress Theme
May 23, 2007 at 1:12 pm
Miscellania VI — Inklings • The Copywriter’s Blog
May 23, 2007 at 1:58 pm
Weblog Tools Collection » Blog Archive » WordPress Theme Releases for 05/24
May 24, 2007 at 5:42 am
Customizing Wordpress Themes | Pajama Professional
May 25, 2007 at 9:10 am
Copyblogger Theme — guillaumelecrocq.fr
May 25, 2007 at 4:56 pm
WeblogToolsCollection DE » Blog Archive
May 27, 2007 at 12:40 pm
Slipping into a New Skin — Mental Shrapnel
May 27, 2007 at 2:10 pm
j david macor.com » Blog Archive » 6 Hot New Wordpress Themes
May 27, 2007 at 3:46 pm
WeblogToolsCollection Español » Blog Archive » Temas de WordPress publicados 24/5
May 28, 2007 at 10:31 am
Copyblogger : un thème WordPress qui prend soin de la typo
May 28, 2007 at 3:38 pm
WordPress Weekly Buzz Links
May 30, 2007 at 9:02 am
Update on Site Design : Keener Living
May 30, 2007 at 11:30 am
Wordpress Theme - The CopyBlogger Theme at WPThemesPlugin.com - Wordpress Themes | Plugins | Blog Tools | Interviews | Make Money Online
May 30, 2007 at 12:55 pm
The Newspaper Blog on Armani
May 31, 2007 at 9:45 am
Webquills.net » The Web Master Skill No One Talks About
May 31, 2007 at 9:59 pm
De cara nova — BlogueIsso!
May 31, 2007 at 11:55 pm
Friday Night Links | Copyblogger
June 1, 2007 at 6:01 pm
blogpaul :: tech . tattoos . talk » Stolen Link Love
June 2, 2007 at 12:40 am
Copyblogger Theme For Wordpress 3 column version — Open Source Candy
June 2, 2007 at 4:10 pm
The Copyblogger Wordpress Theme Now Comes in Three Columns | Copyblogger
June 4, 2007 at 8:10 am
Show #7 - What Are The Best Podcasting Mics? The Answer May Surprise You: An Interview With Mark Jensen | MedSqod: Podcasting for Medical Professionals
June 6, 2007 at 1:15 am
Weblog Tools Collection » Blog Archive » Wordpress Theme Releases for 6/08
June 8, 2007 at 4:58 pm
Temas para WordPress para el 09 de junio - Carrero Bitácora de los Hermanos Carrero, David Carrero Fernández-Baillo y Jaime Carrero Fernández-Baillo.
June 8, 2007 at 6:43 pm
Copyblogger theme — Roberta Ferguson
June 8, 2007 at 11:06 pm
Catchkin » Wordpress Theme Releases for 6/08
June 9, 2007 at 11:57 pm
New Design, Finally Live! — ClarkeW.com
July 12, 2007 at 12:22 am
Changement de style — Michael Carpentier
July 17, 2007 at 9:41 pm
Top 100 Best Wordpress Theme at eBlog - The Entertainment Blog
August 2, 2007 at 3:56 pm
Fixing the archives link in the Copyblogger theme — Andy Sylvester’s Web
August 11, 2007 at 1:32 pm
A Small Difference is A Difference None The Less « Blogsreview.Net
August 24, 2007 at 2:01 am
How to Find a great wordpress theme the simple way.. | Perfidy
September 6, 2007 at 12:26 am
Temi a tre colonne per WordPress
September 13, 2007 at 5:21 am
Improve Your Look with a Customized WordPress Theme << Vandelay Website Design
September 13, 2007 at 7:18 pm
Introducing…SEO Boy! | The Adventures of SEO Boy
September 16, 2007 at 9:19 pm
Tema Copyblogger — Stefano Gorgoni
September 19, 2007 at 2:08 am
Wordpress 2.3 et nouveau thème | Cmicblog
October 1, 2007 at 5:17 pm
imagensmix.com » Blog Archive » WordPress Temas ( Os Melhores do ano de 2007 5º Parte )
October 7, 2007 at 6:02 pm
Le premier billet — mozan
October 8, 2007 at 8:11 am
VegasFoo » HowTo: Wordpress 101
October 15, 2007 at 11:09 pm
CopyBlogger » Freeminders
October 23, 2007 at 1:23 pm
An Updated New Look, Courtesy Of Chris Pearson | MedSqod: Podcasting for Medical Professionals
November 11, 2007 at 4:52 am
Gotta keep the chin up at realwebmagic.com
December 10, 2007 at 9:07 pm
Nihar's World on CopyBlogger Wordpress theme with three columns | Nihar's World
December 15, 2007 at 4:51 am
In Pursuit Of A Sexier Blog | Editor’s Choice | Zuitt Mag
December 16, 2007 at 7:35 pm
WordPress Themes | Susan Hallam
January 7, 2008 at 3:41 pm
Top 10 Free Wordpress Theme Resources
March 5, 2008 at 7:35 am
Establish the Blog SEO Basics : The Blog Herald
April 2, 2008 at 7:30 am
Web site updates — Gary Bishop
April 5, 2008 at 6:33 pm
A Spring Update | polimath
April 13, 2008 at 11:52 pm
Potential Hot UberCart Themes « Hone Watson Bookmarks
April 15, 2008 at 10:15 pm
Tweaked my blog! | Dinosaurs and The Bible: A Creationist's Fantasy
April 19, 2008 at 4:12 pm
Free SEO Friendly Wordpress Themes
June 19, 2008 at 12:01 pm
20 Free Corporate WordPress Themes | Blogging Tips from Blogsessive
June 21, 2008 at 11:29 am
Audio Player Wordpress Plugin | audible marketing
July 6, 2008 at 5:42 pm
Case Study : Installing Wordpress Theme
August 6, 2008 at 8:33 am
FreshBone » Improve Your Look with a Customized WordPress Theme
August 7, 2008 at 10:29 pm
Tema değişikliği: Copyblogger — Hasan Yılmaz
August 11, 2008 at 6:05 pm
10 Classic Wordpress themes for your blog | Blogger Talkz
August 27, 2008 at 5:59 am
20 Free Corporate WordPress Themes | TechZoomIn
October 12, 2008 at 4:56 am
20 Themes WordPress corporativos y elegantes | Descarga Online Gratis
October 16, 2008 at 4:40 pm
New directions :: Joy Kim
November 18, 2008 at 9:12 pm
Working with the Wordpress theme Vigilance 1.16 | Heal Your Church WebSite
December 1, 2008 at 9:29 am
Dynamic menu for your WordPress theme | Christian Schenk
December 2, 2008 at 11:01 am
Copyblogger | Blogger Wordpress Joomla Themes
December 4, 2008 at 10:28 am
20款免费企业WordPress主题 - xun`s blog
December 13, 2008 at 2:48 pm
20 temas simples e sérios para Wordpress - Download Legal
December 20, 2008 at 12:05 pm
20 Free Corporate WordPress Themes « Meandmydesigns
December 24, 2008 at 9:57 am
Paginated comments with WordPress 2.7 and the Copyblogger theme | Christian Schenk
December 26, 2008 at 12:05 pm
Once Again, A New Look — MedSqod: Podcasting for Medical Professionals
December 29, 2008 at 3:30 am
It’s Based On Thesis, Actually
January 3, 2009 at 6:00 am
A Tweaked Look, From A New Theme
January 5, 2009 at 5:08 am
CMS Lab » テンプレートデザイン
January 11, 2009 at 8:52 pm
M4You.info » Wordpress Thems -3 Column SEO Optimized
January 13, 2009 at 8:52 pm
Free SEO Friendly Wordpress Themes | aw-aw.com
January 21, 2009 at 10:56 am
Share Your Favorite WordPress Theme? | The Blog Herald
February 11, 2009 at 5:18 am
Señales de Humo » Blog Archive » Cambio de hábito
February 20, 2009 at 11:52 am
Ch-Ch-Changes « Cultivating Boredom
March 25, 2009 at 5:11 pm
Free Wordpress Blog Installations | INTERNET BUSINESS WITH PURPOSE
March 28, 2009 at 1:06 pm
Choosing a Wordpress Theme | Blog Strategies
March 29, 2009 at 1:17 pm
MuhammadNoer.com Tampil dengan Wajah Baru | ExploreYourSelf - personal blog by Muhammad Noer
April 5, 2009 at 12:42 pm
20 temi WordPress Gratis! | LeggiQuesto.com
April 5, 2009 at 7:46 pm
Is this a standard 'Theme' or will it have been customised?
May 3, 2009 at 1:18 pm
Auke Rensen Fotografie | Nieuwe website live gegaan
May 17, 2009 at 3:52 am
20 Free Corporate WordPress Themes | Seo Services Blog
May 24, 2009 at 9:57 am

{ 120 comments… read them below or add one }

1 Peter Cooper May 22, 2007 at 1:00 pm

That totally, totally kicks butt. I am sure to use this somewhere or other.. because I really loved that design (more than the current one I’m afraid, sorry!) and this is a really slick implementation. Kudos!

2 MN Web Design May 22, 2007 at 1:09 pm

Wow, nice theme! Thanks a lot, much appreciated!

3 Jonathan-C. Phillips May 22, 2007 at 1:12 pm

awesome! will definitely try it out on a blog or two, though this theme is kind of a “signature” theme, everyone knows about copyblogger and the clean theme Brian had before, but it’s surely gonna be hugely popular! good job Chris! :)

4 Shane May 22, 2007 at 1:40 pm

Missing an “s” in that last “Download the Copybloger theme” :)

5 Ed May 22, 2007 at 1:44 pm

A valuable contribution to the WordPress theme pool. I can’t wait to see a three-column version.

6 Chris P. May 22, 2007 at 1:45 pm

Jonathan — One of my goals was to provide you with a simple system for modifying the theme in order to get away from that “signature” look you mentioned.

The Organic style package, which you can see at the demo site if you click on the “Organic Copyblogger” link in the sidebar, is one example that I think is barely reminiscent of its red, black, and white cousin.

Over the coming weeks, I’ll be very interested to see what kinds of color combinations people come up with!

7 ClarkeW May 22, 2007 at 2:00 pm

This is great, I’m a huge fan of Cutline and have developed 3 sites using it so far. I’m actually in the process of getting ready to redesign my own blog, so I think I’ll give this one a try!

Thanks

8 Bruce May 22, 2007 at 2:41 pm

Great job, Chris.
I currently have it up and running at
http://www.dkeener.com/keenstuff/blog/

and have noticed that the Share This plugin is not behaving very well with it: the text and image runs together. I would appreciate you looking at the site and making a recommendation on how to fix. Notice that I did not have this problem with Cutline.

Thank you!

9 Azzam May 22, 2007 at 2:42 pm

What can I say about your generous contribution. Outstanding to say the least.

Good Man! I will do justice to this theme

10 Chris P. May 22, 2007 at 2:48 pm

Bruce — The very last definition in the “share this” stylesheet looks like this:

.akst_share_link {
  background: 1px 0 url(share-icon-16x16.gif) no-repeat;
  padding: 1px 0 3px 22px;
}

You need to add “!important” to the padding declaration, so that it now looks like this:

padding: 1px 0 3px 22px !important;

That should do it!

11 Bruce May 22, 2007 at 3:05 pm

Chris,

That worked perfectly. Thank You!

Again, super work. Now I have the hard decision of going with this theme or Cutline. I like both a lot.

Bruce

12 Chris P. May 22, 2007 at 3:06 pm

Do a little customizing and you’ll be sold :)

13 Bruce May 22, 2007 at 3:10 pm

Thanks! :)

14 Matt Keegan May 22, 2007 at 4:58 pm

What an attractive theme! I so enjoy the various themes developed for Web 2.0 of late. Give me “widget ready” any day too.

15 Chris P. May 22, 2007 at 5:02 pm

Matt — Yep, it’s widget-ready!

16 J.D. May 22, 2007 at 5:26 pm

Sweet. I’ve always coveted this design. (Actually, I’ve always coveted a custom design from you, Chris, but your site says you’re not taking on new work.)

Do you have any suggestions for implementing archives with this theme? I love the way you handle archives at your personal site, but don’t have the skillz to pull that off. I’d be grateful for guidance!

17 Jonathan-C. Phillips May 22, 2007 at 6:48 pm

Chris, thanx a lot for the fast reply! really appreciated! I downloaded the theme and the organic package, it will probably take me some time to go over everything, but i have a feeling i’ll be using it on a new blog i’m working on! :) Good job Chris!

18 Brad May 22, 2007 at 8:14 pm

Hey-

If anyone out there decides to give a try at making this theme with the sidebar on the left, Please Please Please email me!

Thanks,

Brad

19 Mike May 22, 2007 at 9:20 pm

Uh-oh ! I feel a new Theme acomin’ to my blog !

20 Chris Baskind May 23, 2007 at 12:35 am

A very nice contribution, Chris. Thanks to both you and Brian. :-)

21 kevin May 23, 2007 at 12:55 am

what is the code for having an Edit link on your posts when logged in as a blog owner?

22 Chris P. May 23, 2007 at 9:36 am

J.D. — I have yet to post a “how-to” on the demo site about creating an Archives page, but the process is identical to that first introduced on the Cutline theme. So basically, all you have to do is create a page with a page slug of “archives” that utilizes the “Archives” Page Template.

Jonathan — Thanks!

23 Chris P. May 23, 2007 at 9:47 am

Brad — You can easily flip the two columns by adding a single definition to your custom.css file:

.custom #content { padding: 0 0 0 6em; float: right; }

Once you do this, IE will still be messed up, so you’ll also need to edit the ie7.css file by adding the following definition:

.custom #content { padding: 0 0 0 5.9em; }

That should do it!

24 J.D. May 23, 2007 at 10:07 am

Hi, Chris. Thanks for the reply.

Installing archives with Cutline presupposes an “options” subhead in the theme editor. There isn’t one for the Copyblogger them (at least not for me).

I’ve created an empty archives page. I see the archives template in the theme editor. But how do I get the two to connect for archival goodness?

(Actually, I just noticed that my theme editor has two files labeled “archives”: archive.php and archives.php. Presumably these are two different methods of handling archives.)

Thanks for your help. And thanks for the theme.

25 Chris P. May 23, 2007 at 11:19 am

J.D. — You’re totally right about that; I had completely forgotten about that silly options page (which never worked properly anyway).

Follow these steps and you’ll have an Archives page:

  1. Create a page
  2. Enter whatever you want in the title, but do not enter any content
  3. Select “Archives” from the Page Template dropdown menu on the right
  4. Enter “archives” (without the quotes) in the Page Slug field, which is also on the right
  5. Save/publish your page
26 J.D. May 23, 2007 at 11:39 am

Thank you, Chris. If you’re ever interested in creating a custom design for Get Rich Slowly, drop me a line. I may not be able to afford it, but I’m certainly willing to talk about it.

@kevin
To add the edit link, I used the following code:

I added it to the Main Index Template and to the Single Post template, on the same line as the date and category.

I’m quite pleased with this template so far. It’s exactly what I wanted for my new site.

27 Ashwin May 23, 2007 at 11:45 am

Thanks a lot for the theme, Chris! Awesome stuff. I’ll be using this theme soon enough for my blog.

I’ve a quick question to ask you. How did ya put up the “CopyBlogger” image thing in the footer? Just place an image and we’re ready or it needs some stuffs to do?

28 Michael May 23, 2007 at 12:11 pm

There needs to be an extra step in the instructions to create an Archives page.

After following Chris’s steps, change your permalink structure to “Numeric.” This will allow the pages to actually connect without editing any code.

29 Davor May 23, 2007 at 12:24 pm

Really cool theme. I already installed it on my blog. I moved the navigation to previous and next articles below the current article… Too bad there is no nice styling for a tag cloud…

30 Yu^2 May 23, 2007 at 12:57 pm

Chris P. has done it again! The man’s a machine.

31 Chris P. May 23, 2007 at 2:13 pm

Ashwin — I think you’re talking about the footer image on this site and not the theme, since there is no image in the theme’s footer :)

If you are, then I positioned that element using CSS (without using an actual img tag).

Davor — Great point about the tag cloud. My primary concern, however, is that a plugin with proprietary CSS classes is probably the most common means of implementing a tag cloud… I’d much prefer to use code that I know will be universal to WordPress, and I think the best answer here will occur when a tag cloud widget is included with a new WP install.

Yu^2Hardly a machine… I need to get to work!

32 Bruce May 23, 2007 at 2:35 pm

Chris,

Have you considered making a 3-column version of this (or any of your other themes) available? I know that Brian Gardner is working on a 3-column version of Cutline, but wondered if you are working on any 3′ers yourself. Not totally sure I want to go to a 3-column approach, as about 3% of my readers still have 800×600 displays, but the increased ability to position ads without overshadowing other sidebar items intrigues me.

Thanks. I do like the copyblogger theme a lot, and might not even do any customizations on it at all: it is really clean and professional.

Bruce

33 uncleboob May 24, 2007 at 1:47 am

Wow - this theme is simple and it rocks anyway! http://www.uncleboob.de will use this one immediately

34 TC May 24, 2007 at 9:13 am

brilliant! thanks

35 Bruce May 24, 2007 at 2:53 pm

One final thing, Chris, and then I’ll try to not bother you again. Have you tested this on WordPress 2.2 ? I assume it would have no problem, but wanted to know if you or anyone else has tried it out on 2.2. I am considering upgrading from 2.1.3 to 2.2 over the weekend.

Thanks again for another Wonderful theme. I really like how it makes my site look.

Bruce

36 Robert May 24, 2007 at 5:09 pm

Real nice design Chris.

I’m trying unsuccessfully to add SiteMap and Contact into the header.

Also, how would I add a tagline beneath the site title?

Can you offer a suggestion?

37 Ryan May 24, 2007 at 7:05 pm

Chris, this theme is very cool! Thanks very much.

38 Bruce May 24, 2007 at 8:45 pm

I decided to go ahead and do the 2.2 WP upgrade, and CopyBlogger works fine with it. The upgrade went smoothly and it appears that nothing in CopyBlogger broke as a result of the upgrade (I did not really think it would, but now we all know that it works great).

I have viewed in Firefox and Safari on my Mac and in IE7 on Windows.

39 Chris P. May 24, 2007 at 11:12 pm

Bruce — I actually wrote and tested the code within the WordPress 2.2 environment, and I’m glad that the upgrade went off without a hitch!

Robert — In order to add links to your header, you’ll need to edit the nav_menu.php file in your Copyblogger theme folder. Simply follow the style of the link to the about page, and you should be fine.

Regarding the tagline, check out this comment over at the demo site.

40 Alwitt May 25, 2007 at 8:15 pm

Nice theme! looking forward to 3 column version.

41 Dan and Jennifer May 25, 2007 at 8:17 pm

Hey Chris,

Thanks, this is a really wesome theme! A question for you please.

I’m trying to move the nav to the left side, which seems easy enough at first. It looks great in Firefox, but breaks in IE.

Here are the 2 changes I made to style.css:
- line 84: removed the #content right padding
#content { width: 46.8em; padding: 0 0 0 0; float: right; }
- line 86: added right padding to sidebar
#sidebar { width: 20em; padding: 0 6em 0 0; float: left; }

Looks as expected in Firefox, but in both IE6 and IE7 the sidebar gets pushed to the bottom of the page.

Here’s the very rough test site:
http://www.blogsuccessjournal.com/

Any suggestions?

Thanks!
Dan

42 Robert May 26, 2007 at 12:22 pm

I have been searching for a replacement theme since December 2006. Then I blogged about it and then a couple of days later - BINGO! I found this remakable Copyblogger theme!

It is fantastice. no problemo - how do I incorporate mt logo into the header? I am not a coder , so if you know , please write it out step by step and draw diagrams in a ‘join the dots’ style!

I am useless at coding.

I hope you can help

Regards

RObert

43 Bruce May 26, 2007 at 3:07 pm

Chris,

I wanted to experiment with a wider theme so I added the following custom code:


.custom #container { width: 970px; margin: 0 auto; }

.custom #content_box { width: 970px; }

.custom #content { width: 690px; padding: 0 6em 0 0; float: left; }

.custom #sidebar { width: 200px; float: left; }

Is it likely that I have broke anything in doing this?
BTW, not clear to me that the wider design is truly what I want but wanted to know if this sort of experimenting is going to put break anything with one of the browsers.

Best regards, and have a great holiday weekend!

Bruce

44 Bruce May 27, 2007 at 11:45 am

Chris,
Never mind on the re-size I attempted: I decided to not use it.

However, like J.D. of Get Rich Slowly, I would like to discuss a custom design with you once your schedule becomes available. Also, like J.D., I’m not sure I can afford it, but I sure would like to discuss. Basically, I love the Copyblogger theme but would ultimately like to have a version of it that has a left and right sidebar.

Again, thank you for making this incredible design available.

Best Regards,
Bruce

45 Chris P. May 27, 2007 at 2:04 pm

Dan and Jennifer — You’ve done everything correctly, but you still need to make a small change to the ie7.css file to get the theme to display properly in both IE6 and IE7.

Currently, your ie7.css file contains the following definition:

#content { padding: 0 5.9em 0 0; }

You need to change that to:

#content { padding: 0 0 0 5.9em; }

That should do it!

46 Chris P. May 27, 2007 at 2:05 pm

Bruce — I certainly appreciate that, but I am not available for hire.

47 Technobuzz.net May 28, 2007 at 10:31 am

Wow, nice theme!

48 Robert May 28, 2007 at 5:51 pm

Hi Chris.

Thanks so much for the advice on tagline insertion and adding Contact and Sitemap to header.

Both worked. But I need a space between the tagline and red line at the bottom of the header.

I’ve looked at almost every template but can’t find where to make a change.

One last bit of help…please?

Regards
Robert

49 Dan and Jennifer May 28, 2007 at 7:39 pm

Hey Chris,

Thanks. I made this change to ie7.css and deployed it, but the sidebar is still dropping to the bottom of the screen in both IE6 and IE7. :-(

Cleared cache, reloaded, same thing. Of course it still looks great in Firefox. :-)

Do you have another suggestion I could try?

Here again are the 2 changes I made to style.css so you don’t have to hunt down my original comment:
- current line 84: removed the #content right padding
#content { width: 46.8em; padding: 0 0 0 0; float: right; }
- current line 86: added right padding to sidebar
#sidebar { width: 20em; padding: 0 6em 0 0; float: left; }

I didn’t make any other style changes.

Looks as expected in Firefox, but in both IE6 and IE7 the sidebar gets pushed to the bottom of the page.

Here’s the site again:
http://www.BlogSuccessJournal.com

Thank you!
Dan

50 Bruce May 29, 2007 at 10:29 am

I’m running the Left-Column version right now over at
Keener Living:

http://www.dkeener.com/keenstuff/blog

I’ve tested in Firefox 2, Safari, and IE7 but do not have access to IE6 or Firefox 1.5

Would appreciate if any of you who use IE6 or FF1.5 would verify that is working good. I am testing a few other designs but this one is the most appealing.

Chris, if you ever make a 3-column available, please let us know the second you do! Your themes are absolutely top-notch!

Regards,
Bruce

51 Dan and Jennifer May 29, 2007 at 10:40 am

Bruce,

Looks good in IE6 and Firefox 2.0.

So exactly what style changes did you make to get the sidebar on the left? :-)

Thanks!
Dan

52 Bruce May 29, 2007 at 10:55 am

Hi Dan,

I did _only_ the ones that Chris showed above, and absolutely no other changes (will customize a bit later). That is, I did just the one code change to custom.css and the one to ie7.css

Thanks for letting me know about IE6!

Bruce

53 Dan and Jennifer May 29, 2007 at 11:06 am

Hey Bruce,

Can you please paste here the changed lines from both of these files? I pasted mine above but apparently I’m doing something just a bit off. :-)

Thanks!
Dan

54 Bruce May 29, 2007 at 11:13 am

Dan,

I added this to the bottom of custom.css:
.custom #content { padding: 0 0 0 6em; float: right; }

and this to the bottom of ie7.css:
.custom #content { padding: 0 0 0 5.9em; }

I made no other changes.

Good luck on it!
Bruce

55 Dan and Jennifer May 29, 2007 at 8:52 pm

Thanks Bruce, that worked great!

I had made my changes to style.css not custom.css.

So you added those directives to the END of custom.css and ie7.css, effectively overriding the values set earlier on. Interesting approach, but it works fine.

Oh well, it works great now.

@ Chris - Thanks, this is a really excellent theme.

We’re currently using MistyLook for our AskDanAndJennifer.com Dating & Relationship advice column (our main site) and we were looking for a cool new look for our new blog about Power Blogging - literally last week when your post about the CopyBlogger theme came out.

And unfortunately I’m not done tinkering with it yet. Now to make it a little wider. :-)

Have an awesome day!
Dan

56 Bruce May 29, 2007 at 9:04 pm

Glad to hear that it worked well Dan. I second your appreciation of Chris: superb theme!

57 Dan and Jennifer May 30, 2007 at 6:24 pm

Hey Chris,

Before I do something potentially unholy to your beautiful theme, I was wondering if you could suggest an elegant way to add Tags.

In order to get Technorati syndicating your blog, it needs to find tags on the post detail pages. That plus tag pages rank really well in Google - a very good thing.

Here’s how we use Tags on our main Dating & Relationship advice blog - see the gray “tags” list right under the post body:
http://www.askdanandjennifer.com/sex-and-intimacy/legalize-prostitution-the-shocking-poll-results-are-in/

I was going to butcher it in myself, but being COMPLETELY non-artistically-inclined (as you can see by what I’ve done to our MistyLook to date), I thought it’d be best to ask if you could suggest an elegant way of doing this without messing up this really cool theme. :-)

Thanks Chris.

Have an awesome day!
Dan

58 Brian Clark May 30, 2007 at 6:33 pm

Hey Dan, Technorati treats categories the same as tags, so that’s why I don’t use them. Every time you place a post in a category you’re “tagging” it as far as they are concerned.

But there are also tag plugins for WordPress that can do them separately if you’d like.

59 Dan and Jennifer May 30, 2007 at 6:39 pm

Hey Brian,

Thanks. Yeah, I know about that, but we’ve become pretty tag happy over the past year, especially since tag pages started ranking very well on Google. We tag every post very specifically so it gets ranked for those specific terms.

You can see what I mean on the example post I mentioned above. Those tags are way too specific to list as categories. In our sidebar, we have around 7 categories (we call them Channels now) - trying to keep it easy to digest for the first time reader.

Thought I’d put it out there in case Chris might suggest a simple HTML addition so I don’t pervert this elegant theme. :-)

Thanks Brian.
Dan

60 azzam May 31, 2007 at 3:55 am

We have made the theme wider and add the additional sidebar to make it look three column.
Thinking of converting into a Joomla template in a few weeks also.
Check it here at http://www.oscandy.com.

61 Bruce May 31, 2007 at 7:14 am

Nice. Anyway to make this available, or would that violate your terms Chris?

62 Ed May 31, 2007 at 7:17 am

I second Bruce. A nice look that would be even better if released.

63 azzam May 31, 2007 at 7:28 am

There is is not an issue to disclose how the 3 columns were created and the template made wider. There is no need to release another template as it is internal hack, however it is not a new column but a sidebar added to the template

64 Ed May 31, 2007 at 7:36 am

Azzam,

How did you add the second sidebar?

65 Chris P. May 31, 2007 at 9:24 am

Dan and Jennifer — Regarding the tags, I think you have a couple of options. You can use the Technorati tags plugin or the Ultimate Tag Warrior plugin—either one should integrate nicely. My only advice would be to wrap the “tags” in <p> tags and not <div> tags, as the <p> tags will be automatically styled.

Azzam — Looks really nice! You did a fine job with that.

Bruce, Ed — He would be free to release the theme as long as he retained the original attribution from both the footer and the stylesheet. The Creative Commons 2.5 ShareAlike License stipulates that attribution on modified releases must be “at least as prominent as the original.”

66 azzam May 31, 2007 at 9:29 am

oh shucks :)

But I can not take credit for it, if I must tell a secret I screwed up the template and Taras co-author on the blog and the developer fixed it up.

67 Bruce May 31, 2007 at 9:30 am

Chris — Thanks for the clarification … much appreciated, as is the original design. I am actually using another, wider screen design right now, but I wonder if I made a bad decision. Copyblogger is the Cleanest design I have ever seen.

Azzam — you guys really did do a fantastic job with this customization. Let us all know if you decide to release it with the Creative Commons 2.5 ShareAlike License intact.

Thanks again.