How to Use the Copyblogger Theme Like a Pro

The only thing better than a great WordPress theme is actually knowing how to max out the numerous features and styling benefits that it offers. In lieu of that earth-shattering revelation, I’d like to take you on a guided tour so you’ll be equipped with the knowledge you need to make the most of the Copyblogger Theme for WordPress.

First, a Word on the Layout

Typographic grid thumbnailThe layout you see today is not the original Copyblogger design—it’s one that’s been “digitally remastered” to achieve a quality standard that I feel is unsurpassed in the world of open-source theme development. I used relative (or em-based) sizing on nearly every element of the theme, making it an infinitely scalable layout that can accommodate visually-impaired users with ease. If you’re using FireFox, resize the text with ctrl + + to see how this works.

Also, I took extreme care to develop the theme so that it adheres quite strictly to a typographic grid. Click on the thumbnail above to get an idea what I mean, or read about setting type on the Web if you’re into that sort of thing.

Widget Support

With the news that WordPress 2.2 comes pre-packaged with the sidebar widget plugin, widgets have officially become a crucial part of the WordPress fabric. As a result, the Copyblogger Theme for WordPress supports widgets, but with one notable exception.

For some reason, the WordPress developers broke the XHTML markup convention on the search widget, and in addition, their solution is not as flexible as I would like. Because of this, I felt it was necessary to build a custom search widget that lay outside of the normal widget framework. As a result, I highly recommend that you do not use the search widget, and instead just let my built-in search function rock your sidebar.

Special Post Styling Elements

The Copyblogger Theme for WordPress features elegant treatments for traditional in-post styling elements like:

  • Unordered lists: <ul><li>, like the one you’re reading now
  • Ordered lists: <ol><li>
  • Definition lists: <dl><dt><dd>
  • Sub-headlines: <h3>
  • Blockquotes: <blockquote>
    • Pullquotes (more on this in a sec)
  • Code: <code>

While most of the above elements are pretty standard, one – the pullquote – requires further explanation in order to be used effectively.

Pullquotes

I’m sure you’ve heard of blockquotes, the pragmatic cousins of the more artsy, more eccentric pullquotes. In case you need a refresher, here’s what a standard blockquote looks like:

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque pharetra velit vel purus. Nunc tempor, urna sit amet euismod elementum, erat tellus auctor erat, non condimentum dui wisi non orci. Nam fringilla leo sed dui. Vestibulum ac elit sit amet diam vehicula scelerisque.

All you have to do to achieve a result like the one above is wrap your quoted text inside <blockquote> tags, and the Copyblogger Theme for WordPress will tidy it up for you.

It’s kinda like a block quote, with a twist.

Pullquotes, however, are not quite as simple because there is no pre-defined XHTML tag for a pullquote. What I’ve done, then, is prepare two classes – “left” and “right” – that you can apply to any regular blockquote to transform it into a bit of publishing goodness like you see here.

For a pullquote aligned to the right (like the one above), your encompassing blockquote declaration should be <blockquote class="right">. For a pullquote aligned to the left, you’d simply write <blockquote class="left">.

I’d like to point out that certain feed readers may not be able to interpret pullquotes effectively, and this could result in repeated text or strange punctuation, both of which could confuse your readers. For what it’s worth, Bloglines does a nice job of floating the quotes to the left or to the right, and although they’re not styled, per-se, it’s evident that the pullquotes are not part of the body text of the associated paragraph.

Using These Styles

With each new release of WordPress, the visual text editor (which is your default posting interface) becomes more and more useful in terms of how it utilizes the styles and text treatments that I’ve introduced to you here. In spite of that, you cannot make use of all of these elements from the visual editor’s interface. Specifically, you won’t be able to create the following:

  • Definition lists
  • Sub-headlines
  • Pullquotes

WordPress editor tab controlsFortunately, WordPress 2.1+ comes with a handy little tab switcher that allows you to jump between visual and code editing modes. Whenever you want to include one of the special elements from the list above, simply switch over to the code view, apply the appropriate tags to your text (remember to close them!), and then switch back to visual mode to write just as you normally would.

388 comments ↓

#1 Lynn Roberts on 05.22.07 at 3:11 pm

Chris, I’ve been admiring Copyblogger and your blog for a long time. This ‘theme’ is GREAT! I’m so glad to see it. Can I hire you to build my blog? Your site states ‘no new clients’ … but hoping you’ll make an exception or at least put me on your waiting list. Thank you!
/s/ Lynn Roberts, 800.583.5310, lynn@lawyerlynn.com.

PS, I’m fun to work with, and have great ideas for making money, but I haven’t found a blog/designer I like until you. I don’t want to settle for less. Please call!

#2 Jennifer Gniadecki on 05.22.07 at 4:19 pm

You know, I wish I’d thought of that “waiting list” thing to put in the comments section. (Props to you Linda! That’s a smart idea!!)

How about…got any protegeee-eee-ees roaming around looking for work? Desperate starving code-artists that you know from the WP shelter? Anything? I’m terribly un-fun and a bore to talk to. I may even pick my nose…it’s a total crapshoot.

Back to the point. Copyblogger is great, your remastering is fantastic. Thanks for doing what you do. You are appreciated.

#3 Peter Beck on 05.22.07 at 4:27 pm

I, too, have been admiring Copyblogger — in fact, that’s why I switched over from my prior theme to Cutline 1.1. It was the closest I could get, and I tweaked the font colors and sidebar borders to shift the reader emphasis back to the blog, like CB does.

2 questions:

1) CB does work with WP 2.2, yes?

2) Is there an option, via custom.css or the organic add-on, to easily insert a picture at the top of the header?

#4 Peter Beck on 05.22.07 at 4:33 pm

Sorry, another question just occurred:

3) Will CB accomoadate a long main title — does it just wrap it around, and enlarge the “box” of black that it sits in, pushing everything downward but maintaining the navigations links, etc?

#5 Les on 05.22.07 at 6:25 pm

With all due respect,
to alter font size in Firefox
it is CTRL + and CTRL -
Not ALT + and ALT -

#6 Mark Mathson on 05.23.07 at 1:38 am

Nice to see this released. I really like it. Will be fun to use.

Can you offer any suggestions to me to get my tagline to show up below the weblog title? (It appears like its in the header.php file but doesn’t seem to work.)

Thanks, and kudos for such a nice design!

#7 Chris P. on 05.23.07 at 11:26 am

Lynn — I am certainly flattered by your interest, but I’m afraid it’s true—I’m not available for hire.

#8 Chris P. on 05.23.07 at 11:35 am

Peter — Hopefully these answers will clear things up for ya…

  1. The Copyblogger theme is optimized for WordPress 2.1+, but it has been built to make the most of 2.2 and higher (especially with widgets).
  2. At this time, you’d have to manually code an image into the header—there is no simple option yet.
  3. The theme will accommodate a long title, behaving just as you suspected. You can, however, change the size of the text in the header if you’d like to squeeze more on to one line.
#9 Chris P. on 05.23.07 at 11:42 am

Les — Thanks for clearing that up. I’m a Mac user, so that was pretty much a guess :)

Mark — If you want your tagline to appear, you’ll need to add the following definition to your custom.css file:

  1. .custom #logo h1, .custom #logo #tagline { display: block; }
#10 Sreejith on 05.24.07 at 1:34 pm

I love the design !! I’ve made it permanent for my site. But, Chris, I would like to suggest to add a feature you use on your site.

I mean those small “snipped-thingys” on the left showing the corresponding categories of a post. I love it. Can you include it in the next version ?

Congrats on one of the best free designs for WordPress !!

#11 Aaron on 05.24.07 at 2:16 pm

First off, thanks so much for sharing, what an awesome design! I’ve got one small problem though.

I’ve downloaded the copyblogger theme and tried using it(the same as any other theme), however I can’t seem to get it to work. It looks like the ‘frame’ is working but not the CSS(maybe?). I’m no programmer, any help would be greatly appreciated! Thanks in advance, you rock.

#12 Chris P. on 05.24.07 at 3:46 pm

Sreejith — I have no idea what you’re talking about. Is there an example that you could point me towards so that I can better understand what you mean? Thanks!

Aaron — It looks like the entire theme may not have loaded properly. Delete it from your server and then try uploading again. Also, check to make sure the style.css file appears in the Copyblogger theme folder, because right now your server is saying that the file cannot be found.

#13 Aaron on 05.24.07 at 5:10 pm

Chris,

Thanks for replying! I’ve downloaded and uploaded it again, with the same result. I’ve checked in the theme editor and these css files appear in this order:
ie6.css
Stylesheet(style.css)
ie7.css
custom.css(this one is empty, no text)

I’m not sure what i’m missing. Any ideas? Thanks again.

#14 Ryan on 05.24.07 at 5:51 pm

Chris, thanks so much for putting this theme together. It is so clean and the comments are a huge help.

#15 How to Format Your Images with Copyblogger — Copyblogger Theme on 05.24.07 at 10:59 pm

[...] In our first example scenario, we want to align an image to the left, and we’d also like to have our paragraph text wrap around the image so as to maintain a clean, uninterrupted flow. You’ll start by inserting an image into your post just as you normally would, but in order to apply the proper CSS class, you’ll need to switch over to code view by clicking on the “Code” tab. A quick explanation of that process along with a visual can be found here. [...]

#16 Chris P. on 05.24.07 at 11:14 pm

Aaron — It looks like there is a directory permissions issue that is preventing the server from reading the CSS file. Using an FTP client, navigate to the Copyblogger theme directory and change its permissions to 777. If that doesn’t work, you may have to make the entire wp-content folder 777. Good luck!

Ryan — Glad I could help. Be sure to take a look at the new image styling tutorial—I think you’ll be able to put it to good use!

#17 Ben on 05.25.07 at 10:24 am

Happy birthday Chris!! Thank you for the theme.
Still learning, tweaking, importing and stuff like that on my testsite and if I don’t get it I wil put the question here, but for today, have a ball

#18 Aaron on 05.25.07 at 10:38 am

Thanks Chris!! Works like a charm now!!

#19 Aaron on 05.25.07 at 10:56 am

Well, I lied just a little:). Everything works, except when making new pages. New pages created don’t appear on the site. The pages ‘archive’ and ‘about’ give me an error when I click on them and I can’t delete them because they don’t appear on the control panel side of wordpress. Hmm?
If it’s really your B-Day, then happy birthday! Thanks for all the help.

#20 Chris P. on 05.25.07 at 11:33 am

Ben — Thank you very much!

Aaron — You need to change your WordPress permalink structure. Have a look at this video.

#21 CarlenLea on 05.25.07 at 1:13 pm

The theme is great — and I LOVE the organic style version. Thanks for sharing it.

#22 Ryan on 05.25.07 at 4:37 pm

Chris, I added the tagline as outlined above, but just noticed that the style seems to be different between my index page and all other pages. I may have done this myself and not even realized it, but I haven’t edited the style.css…any ideas? Thanks.

#23 Aaron on 05.25.07 at 5:18 pm

Well…I’ve now got a new permalink structure(cool tubetorial btw), but still no dice on the editing/adding/viewing of the pages. Don’t know what the deal is. Maybe the .htaccess file(wp didn’t give me code to create one)? I hate to be ‘that’ guy, but I can’t seem to figure it out. Thanks again!!

#24 Donna B. on 05.26.07 at 12:54 am

I think the clipped thingies the commenter above is referring to are those little signs that stick out at an angle to your posts on the first page. Can I do that?

#25 Chris P. on 05.27.07 at 12:12 am

Ryan — Good catch there. The default version of the theme comes with the tagline turned off, and admittedly, I didn’t test it at all. Either way, you can fix the problem by adding a new definition to custom.css:

  1. .custom #logo #tagline { letter-spacing: -1px; }

Aaron — I did not include those post editing buttons in the code of the theme. I think there’s enough room beneath the posts to accommodate them, so I guess I’m out of excuses for not including them :)

I’ll see if I can cook them up for the next release.

Donna B. — That’s what makes my design custom ;)

#26 Ryan on 05.27.07 at 1:47 am

Thanks Chris. That fixed it.

#27 Ben on 05.27.07 at 5:04 am

“You may not access this page without a valid key.”

Is the message I get when I want to manage my subscrition (made a typo in my e-mail adress.

#28 Chris P. on 05.27.07 at 3:34 pm

Ben — I just did some light testing and research, and it appears that the Subscribe to Comments function is not yet fully-compatible with WordPress 2.2. Mark, the plugin’s creator, is a great guy, though, so I’m sure he’ll release an update soon.

Keeping up with changes and new releases is oftentimes the hardest (and worst) part about being a theme or plugin developer, so I feel his pain.

#29 Ben on 05.28.07 at 6:09 am

I’m a very WordPress newbey so could you please tell me which widgets you used for the Calender and the Recent Comments?

#30 Ben on 05.28.07 at 6:12 am

Google Reader does a nice job on the blockquotes as well. It shows separated indented lines.

#31 Jeannette on 05.30.07 at 10:35 am

Hi . . . I really like your new theme, it’s brilliant.

I have a suggestion though ; How about a CopperBlogger version with multiple [ 3 ] columns in the footer ? I would really love that.

Anyways, thanks for your effort.

#32 Kirk T on 05.30.07 at 5:41 pm

I love the theme and your work!

On pictures in the header:
I’m using your Random Image Tutorial to make this work at livetardy.com. I am confident that I’ve set it up wrong, but for a site with no content: it seems to work. Should I make improvements on this setup?

Added this code to the Custom Style Sheet: #nav a img {width: 100%; border: 1px solid #000000; }
Removed the extra padding below the header in the original CSS file
Added the following to the header file…<a href="http://www.livetardy.com/blog" rel="nofollow">.jpg" width="100%" alt=”Live Tardy Home” /></a> after this section of code…?php include (TEMPLATEPATH . '/nav_menu.php'); ?>

#33 Chris P. on 05.31.07 at 8:58 am

Ben — The calendar and recent comments widgets are, to the best of my knowledge, default widgets that come with the WordPress Widgets Plugin. For WP versions 2.2 and higher, the wigets plugin actually comes pre-installed with the very widgets you mentioned (among others).

#34 Chris P. on 05.31.07 at 9:02 am

Kirk T — Your setup could certainly be improved upon, but the bottom line is that it flat out works. I say go with it :)

#35 Jan M. on 06.01.07 at 11:56 pm

I’ve tried installing CoppyBlogger Organic Theme into WP 2.1.3 but an error shows up. When I go into the Presentation tab, I’m told that I need a stylesheet and template. I renamed custom.css to style.css and that cleared up the stylesheet problem but I’m still told that I need a template. What next? Thanks for your help.

#36 Matt L on 06.02.07 at 5:36 pm

Hi Chris,

Could you show us how to flip that column over to the left?

#37 narcolept on 06.03.07 at 11:45 am

Chris,

It looks like the archives button is still not functioning correctly, even on this site. Any news on getting that working correctly?

#38 Chris P. on 06.03.07 at 12:05 pm

Narcolept — I just haven’t set up the Archives page on this site yet, which was an oversight on my part. Follow these steps to make it happen.

Matt LFollow these steps to move your sidebar to the left.

Jan — Delete the Copyblogger theme from your themes folder and then reinstall it. Next, drop the contents of the Organic style package into the Copyblogger theme folder, and you should be good to go. Never rename your stylesheets, as that will mess up the theme entirely.

If I confused you at any point on this issue, please show me where you were led astray, as I would like to fix that as quickly as possible.

#39 steve on 06.04.07 at 10:42 am

Chris,
I need to use my logo instead of the standard text that you provide in the header of Copyblogger. I have studied your instructions to make this change in your old Cutline theme, but I’m still not sure how to do it in Copyblooger. I have my logo sitting in the Copyblogger images file. I would appreciate any help you could provide. Thanks, and thanks for a nice clean theme.
Regards, Steve

#40 Martin on 06.05.07 at 7:34 am

Great theme, love the 3 column layout. Has anyone thought of creating a website template to match?

I could use one of these but my html is not really up to it!

Well done on a great theme.

#41 Rick McCharles on 06.09.07 at 2:17 pm

I too would prefer to add a logo image above or below the name of my blog.

But I hate to edit your code because, possibly, one day it will cause me grief after updating to a new version of WP or Copyblogger.

A plugin would be ideal for non-coders like myself.

#42 Trey Crowe on 06.09.07 at 10:36 pm

Really helpful. I plan on using this theme and I am in the middle of customizing the layout.

I am having some trouble adding my own personal header though. A little help about where to add my code would be helpful.

#43 lawton chiles on 06.10.07 at 6:21 pm

Chris, i am having problems with copyblogger and pressrow displaying my blogroll. The Widget just has an empty Links widget, no customization is possible.

Please help :)

#44 Gideon on 06.10.07 at 6:25 pm

Copying my comment from the other site:

Very nice theme. I tried using it on my site, but I ran into the same “Share This” problem. I saw your fix above, but was unable to locate the stylesheet for share this. Any guidance on where it might be?

Also, when you click on the icon for “Share This”, the popup box that opens with links to the various sites shows only the icons for those sites. The text links are there, but the background color, the text color and the hover color are the same, so they appear blank.

Finally, I tried to add all the pages that I currently have in the nav bar to the nav bar file as recommended above, however after about 5, they started wrapping on to the next line. Any idea how to prevent that from happening (other than fewer nav bar links)?

Thanks in advance!

#45 Tyler on 06.12.07 at 9:20 am

Great theme!

One question: the post slug fails to turn my post urls from /p=# into something more google friendly.

Any way to change that (plugin, code change, etc)?

Thanks so much!

#46 Jim on 06.15.07 at 1:55 am

Anyone successfully make this wider? I post code samples occasionally and the wider I can get the content area the better. So far my attempts at hacking up custom.css have been unsuccessful.

#47 Walter Burek on 06.15.07 at 3:05 pm

Hi Chris,

I’ve been using the Organic Copyblogger theme for my blog and I’m loving it. However, I u pgraded to 2.2 and can’t get my sidebard widgets to appear. I get this message:
Fatal error: Cannot use string offset as an array in /home/walterbu/public_html/wordpress/wp-includes/widgets.php on line 495.

Any suggestions?

#48 Chris P. on 06.15.07 at 3:37 pm

Rick — Unfortunately, creating a ride-along plugin to modify the header would require a complete remodeling of the code in header.php, so that really isn’t an option.

Trey — If you want to customize your header, you’ll want to make your HTML changes inside header.php.

Gideon — Getting the “Share This” plugin to play nicely requires brief editing of the “Share This” stylesheet, which is located inside that plugin’s folder. Check out this comment for specifics.

Also, regarding the pages in your navigation menu, you’ll probably need to make the font size smaller in order to accommodate more items.

Tyler — You actually have to change your WordPress permalink structure in order to make that happen (it’s not theme-dependent, it’s WordPress-dependent). Check out this video to see how it’s done.

Jim — Making the content area wider has some pretty significant ramifications on the stylesheet code and also on the graphics used in the theme (namely, the comment bubbles). It’s too intensive for me to go into here, and I’m afraid this is one topic I’ll have to leave up to the independent developers out there who have a reasonable knowledge of CSS. The theme can definitely be made wider, but it would take me forever to explain it adequately.

Walter — That’s an issue with your new WordPress installation and not with the theme. I recommend that you back up your database, and then try to reinstall WordPress 2.2. Make sure that when you reinstall, you overwrite the existing wp-includes directory.

#49 Gideon on 06.15.07 at 10:02 pm

Chris, I did as instructed for the Share This plugin and yet there is an overlap between the text and the icon and the entries in the popup dialog box are still blank. Any input? I edited the akst.css file.

#50 Chris P. on 06.15.07 at 10:05 pm

Gideon — I need a URL from you so I can properly diagnose the problem.

#51 Gideon on 06.15.07 at 10:06 pm

I was just coming back to post that…

the URL is http://test.apublicdefender.com

#52 Paul Lawley-Jones on 06.17.07 at 11:33 pm

Chris,

I’m running into problems adding a page to nav_menu.php. I’ve added the page (Links) in WP using the default template, added the page slug (links) and added the line to nav_menu.php thusly …

href=”/links/”>links

Permalinks are set and work for test postings. However, when clicking on ‘links’ in the header nav I get …

Warning: require_once(../lib-common.php) [function.require-once]: failed to open stream: No such file or directory in /var/www/html/links/index.php on line 57

Fatal error: require_once() [function.require]: Failed opening required ‘../lib-common.php’ (include_path=’.:/usr/lib/php/:/usr/share/pear/’) in /var/www/html/links/index.php on line 57

I’ve moved my WP installation so that the WP URL is “http://www.example.com/wordpress” and the blog URL is “http://www.example.com”. I’m running on my own Apache server.

Have I missed something obvious? Any help appreciated.

#53 lawton chiles on 06.18.07 at 4:37 pm

Chris, my sidebar works now!

I love this theme.

Lawton

#54 limon on 06.19.07 at 4:56 am

I use firefox and I must set the minimum size of font to 12 or the font on some website will be too small like google. But in that way, the font of this theme looks too big, how to fix it?

#55 Maricar on 06.20.07 at 9:04 am

Hi Chris,
The search function doesn’t seem to be working on my site. Only a blank screen comes up. I wonder if anyone else has experienced this.

#56 Chris P. on 06.21.07 at 11:49 pm

Paul — I’d definitely like to actually see the site that you’re talking about in order to determine what’s really going on… From the looks of things, though, I’d guess that the location of your WordPress directory is the problem. I would highly recommend placing WordPress in your root directory (http://www.example.com) and trying everything with that structure.

Limon — I’m not 100% sure what you’re talking about, but if you’ve increased the default browser font size, then it’s likely that you’re viewing this theme with a font size that is 2px larger than it’s supposed to be.

All of my sizing is em-based, and the universal browser default is 16px. For all browsers set up this way, the body text on the Copyblogger Theme renders at 13px. I think you’ve changed your universal default to the equivalent of 18px, and thus your Copyblogger Theme body copy is showing up at 15px, which makes Verdana look pretty chunky and ugly.

Set your browser text back to the default size and see if that doesn’t solve your problem. You can compare the size results to this image to see if you’re looking at the theme the way it was meant to be seen.

Maricar — Very strange indeed. I really have no idea what’s going on there, so I’d simply recommend re-installing the search.php file from the Copyblogger Theme.

#57 kristarella on 06.23.07 at 2:07 am

Very strange – when I go to a single post page the sidebar jumps underneath the posts. Example, the red line is outlining div.posts single, where it seems the sidebar is included. Adding another end div in single.php solves the problem, but I’m not sure if this is the right thing to do.
I have added any divs above this, could this be a problem in WP that adds a div somewhere on the single page?

#58 Chris P. on 06.23.07 at 2:13 am

kristarella — Either you’ve added a div inside your post that is not closed off properly, or else you’ve put something in the body of your post that is greater than 468px wide (or less than that if you’ve added a frame to an image).

#59 kristarella on 06.23.07 at 2:21 am

Yah, thanks. After some more eager scouring I think I’ve found that it might be a plugin I’m using that isn’t closing off properly.

Thanks for your brilliant coding on this, it’s really lovely to work with!

#60 Mark on 06.23.07 at 12:14 pm

Hi Chris,

I notice that when I used the tagline code you list above it uses the white text color for two of the three pages I’m testing, but on the home page it seems to pick up the red color from the header border. I’m checking out the custom.css to see if I can fix this, but no luck yet. Any ideas? Thanks!

Mark Smallwood

#61 kristarella on 06.23.07 at 9:42 pm

I can’t get the previous posts link to work on the index or archives pages. The tags just seem to generate


Any ideas on why this is happening would be greatly appreciated.

#62 kristarella on 06.23.07 at 9:43 pm

Sorry, the code tags didn’t happen… perhaps easier to just visit my site and see that the navigation links aren’t there, just some paragraph marks.

#63 Mark on 06.24.07 at 4:54 pm

Hi Chris,

I figured out that to get the Home page tagline to appear white instead of #a90000, I added a color: #fff to the end of this line in style.css:

#logo h1, #logo #tagline { display: none; font: normal 1.8em “Helvetica Neue”, Helvetica, Arial, sans-serif; }

It now reads:

#logo h1, #logo #tagline { display: none; font: normal 1.8em “Helvetica Neue”, Helvetica, Arial, sans-serif; color: #fff }

That works, although the font on the Home page tagline looks like it’s a different size than on the other pages. I will try to figure that out.

Mark

#64 Mark on 06.24.07 at 4:59 pm

Oops. Just needed to add the letter-spacing to

.custom #logo h1, .custom #logo #tagline { display: block; letter-spacing: -1px; }

That did the trick!

Chris, thanks so much for the incredible theme.

#65 Roy on 06.26.07 at 2:18 pm

Chris:

Spent the last four days trying to learn this WP blog thing for my sites. What a learning curve.

First I found your Cutline and really like it, then I found CopyBlogger and really love how clean it is.

I’m sure it’s really simple and probably a stupid question, but I haven’t been able to figure out how to put my ads in the sidebar.

Can you point me in the right direction?

#66 Mark on 06.26.07 at 2:52 pm

Roy,

One of the easiest ways to do this if you’re using something like Amazon ads, is to paste the code you get from Amazon into a Text widget and drag that up to the sidebar. You can do this in the WP admin console. Go to Presentation > Widgets. You can create multiple Text widgets and put the iframe elements in them (or multiple iframes in each widget, I believe._ May not be the most elegant way to do it, but it seems to work for me.

#67 Roy on 06.26.07 at 3:21 pm

Mark:

I have a number of self designed banner ads selling my own stuff or affiliates products, jpeg’s and gifs mostly.

My difficulty is in knowing where to place the code.

I messed with the sidebar.php and managed to get an ad to post, but when I went to the widget manager, I lost everything and can’t figure out where the code is.

I appreciate the help.

#68 Tom on 06.26.07 at 5:07 pm

Roy

When you activate the widgets, you blow out the hard code for the sidebar (s).

What I do is activate the widgets, place the code in a text widget, and rock and roll. It is much easier coding the site this way for a novice.

Down at the bottom of the widget page you can add up to 9 text boxs to work with so you can use this technique multiple times.

Best of luck…

#69 Tom on 06.26.07 at 6:12 pm

Also, if you are using the 3 column version, you can change the width of the left column in the custom.css file. Just change”

.custom #container { width: 101.8em; margin: 0 auto; }

.custom #content_box { float: right; }

.custom #left { width: 25em; float: left; }

I added 5 to the custom container and custom left and it gave a bit more room in the theme if you are looking to gain space for advertising or images.

#70 Paul Lawley-Jones on 06.27.07 at 5:34 am

Chris, thanks for the advice. The problem was that I already had a directory called ‘links’ in the doc_root of my web server. I removed that and all is good.

#71 Reading for June 28th — Daily Ideas on 06.28.07 at 8:53 pm

[...] How to Use the Copyblogger Theme Like a Pro ? Copyblogger Theme – [...]

#72 Jayne on 07.01.07 at 11:39 am

Many thanks for the theme, Chris. It’s helped out this WP newby a lot.

How do I add a graphic to the header? What size does the graphic need to be?

Thanks!

#73 Chris P. on 07.03.07 at 10:47 am

kristarella — If you have implemented a "showposts=x" declaration on your index.php, archive.php, or search.php pages, then this is likely why you aren’t seeing any navigation links.

If, in fact, you’re controlling the number of posts through the WordPress dashboard options, then I’m not really sure what the culprit is here. I remember having a similar issue like this last year, though, and it was because I used the showposts attribute in my WordPress loop.

#74 Chris P. on 07.03.07 at 10:50 am

Mark — The tagline is a disaster. It seriously interrupts the mojo in the header, and I didn’t do any hard core testing to ensure that it would display properly. As Murphy’s Law would have it, the tagline is all messed up, and I’m sorry you’re fighting my poor code there.

You’ve done the right things to fix the display across the different types of pages, though, so nicely done there!

#75 Chris P. on 07.03.07 at 10:53 am

Roy — Tom has given you sound advice about including ads in your sidebar. If you’re using widgets, then you’ll have to place the ad code inside a “text box” widget. If you’re not using widgets, then you’ll have to mimic the sidebar markup code in order to have your ads display properly.

#76 Chris P. on 07.03.07 at 11:03 am

Jayne — Adding a graphic to the header requires a bit of proficiency with CSS and HTML. That said, you can add an img declaration to the header by editing the header.php file that comes with the Copyblogger Theme.

I’d recommend placing the image after the tagline declaration inside the div with id="logo". Your image should be no more than 728 pixels wide.

#77 kristarella on 07.03.07 at 7:00 pm

Hmm, thanks for you reply. I’m not using showposts, I’m just using the index.php and everything as is from the copyblogger theme. Bummer…

#78 ShaneR on 07.03.07 at 9:54 pm

Sorry to ask an old question…

But, I am having problems with the archive link as well (I just get the 404 page). Chris’s link to “the steps” has nothing relevant in it.

So, anyone help a guy out? :)

PS. I have my permalink set correctly.

#79 ShaneR on 07.03.07 at 10:15 pm

Heh…as always happens when I post a question: I figure it out shortly afterwards.

Sooooo….ingore that post above ;)

#80 Jayne on 07.03.07 at 11:53 pm

Shane,

I am having the same issue with the all the links on the top nav bar. Would you please share the solution you discovered? Thanks.

Jayne

#81 Jayne on 07.03.07 at 11:55 pm

Chris,

Thanks for the suggestion on the header graphic I will see if I can get that to work for me tomorrow. Have a great 4th Holiday.

Jayne

#82 Larry on 07.04.07 at 12:47 am

How do I get the page nav to work? I get a “HTTP Error 404 – File or directory not found.” when I click on archive and about.

#83 kristarella on 07.04.07 at 1:46 am

Jayne and Larry,
You need to have the about and archive pages set up for the links to work. This article in the codex might help. If you don’t have the pretty permalinks enabled then the address to your about page will be /?page_id=2/ (if it’s on the original page) rather than /about.

#84 ShaneR on 07.04.07 at 8:43 am

Jayne and Larry.

I’m new, so I’ll explain as best as I can (I haven’t had a full coffee yet either, so… ;) )

Firstly, make sure you have your permalink structure set correctly as Chris mentioned above. He provided a great link to a video tutorial:

http://www.tubetorial.com/blog-permalinks-word/

Secondly, You’ll need to add the archive page within WordPress’ admin section: Select the archives template when adding the page and “archives” as the “post Slug”.

I found the answers by googling and looking at Chris’s comments here and his Cutline theme…others had the same questions (I don’t say this to tell you to “google”, only to say that I’m sorry i can’t be more clear :) ).

Hope all that makes sense…

#85 ShaneR on 07.04.07 at 8:50 am

I Managed to find the links that allowed me to “clue in”

This one

and

This one

They should give you an idea what you need to do :)

#86 Larry on 07.04.07 at 10:43 am

Thanks for your help ShaneR. My version of WordPress (2.2.1) doesn’t give me the .htaccess code and doesn’t even tell me to to change it like in the video. I’m searching the Internet now but there is no clear answer.

I might just stick with Blogger because this is way more trouble than it worth.

#87 Larry on 07.04.07 at 11:43 am

Well I think I’ve read everything available on the internet on the permalink and .htaccess issue and have come up empty. I’m running WordPress on a Windows server and the frontpage extensions are not installed but is seems that WordPress will not generate a .htaccess file and even when I upload an empty .htaccess file to the server it doesn’t see it.

Using the Custom structure: /%postname%/ does not generate the error and thus doesn’t give me the code necessary to place in my .htaccess file.

Has anyone encountered this problem and is there some magic fix to it that I’m not aware of?

#88 Jayne on 07.04.07 at 11:49 am

Shane, thanks for the tip on the permalinks.

I have tried to get a header image to show up per Chris’s instructions and by searching the WP Codex for clues … alas I’m still clueless. Can anyone suggest what bit of code in the header file might make my image show up? I have loaded my image in the size Chris suggested to the image directory. Thanks.

#89 Larry on 07.04.07 at 12:38 pm

Thanks ShaneR but permalinks will not work on my Windows server so I will have to use Solution #2 and change my header file and see if that works.

There is a good article about making permalinks work on a Windows server and I guess it has worked for some people but not for me

#90 Larry on 07.04.07 at 1:00 pm

The header file for Solution #2 on the page doesn’t look anything like what I have. This is my first experience with PHP and WordPress so I don’t have a clue. I put in a trouble ticket to my hosting service to see if they can help but I’m not confident. I’m a VB.NET developer so I’m not completely clueless but this is something I just don’t want to take time figuring out. Right now I don’t see PHP in my future as a programmer. If my hosting service has the answer I may mess around with this some more and move to WordPress if not I’ll stay on Blogger. I’ve spend enough time on this already but thanks for your help.

#91 Chris P. on 07.04.07 at 1:13 pm

kristarella — Change the number of posts that get displayed on the front page from 3 to 10, and see if that makes any difference at all with the navigation links.

Larry — I just installed WordPress 2.2.1 for a friend, and I did not have to edit my .htaccess file in order to get the nice permalinks working. It looks as though this is a new and welcome feature of WordPress 2.2+, so you should be good on that front.

Send me a link to your test site, and I may be able to better determine what’s going on.

#92 Chris P. on 07.04.07 at 1:17 pm

Larry — The Windows server is definitely the problem. You should check out an affordable Linux host for running your blogs. You simply can’t beat WordPress from a value/extensibility standpoint, and I think you’ll find that in the long run, it’s definitely the right move to make.

#93 Chris P. on 07.04.07 at 1:27 pm

Jayne — If you want your image to appear, then you need to insert an img tag in your header that points to the image you want to display.

You need to upload the image to your server so that you can point to it, and this is accomplished via FTP.

#94 Chris P. on 07.04.07 at 1:29 pm

Jayne — I just re-read your comment from earlier, and I think you’re doing just about everything right…

Send me a link to your test site, and I should be able to tell you exactly what to do.

#95 Larry on 07.04.07 at 1:35 pm

Thanks Chris, I have tried everything that I can find on the net about this subject and nothing works. I really don’t want the added expense of another host and have 4 domains hosted with that service now. My test site is http://flyballblog.i-flyball.com/ .

#96 Jayne on 07.04.07 at 1:38 pm

Thanks for the help, Chris. The test site url is http://www.webbizdiva.com/blog.

#97 kristarella on 07.04.07 at 7:00 pm

Sorry Chris, number of posts doesn’t seem to make a difference.

Jayne, I think you still need to put the img tags in the header properly. http://www.w3schools.com/html/html_images.asp

#98 Jayne on 07.04.07 at 9:03 pm

Kristarella,

Thank you for the link to HTML code. I figured out a bit to get the image there and not the name. I’m almost there. I can see that an image will be displayed but it’s not displaying it correctly. I’ve uploaded the image but maybe not pointing to it correctly.

#99 Larry on 07.05.07 at 10:50 am

Chris, is there a way to turn Permalinks off so that I can make your theme work on my server? I can see the advantages of using them but it does look like it’s possible with my current hosting service.

#100 Larry on 07.05.07 at 11:04 am

Disregard my last post. I was able to change the nav_menu.php to make it work without Permalinks.

#101 Ahmad Uzair on 07.06.07 at 6:19 pm

Thanks for this lovely themes you done. Just ask, how can I made and ads block like I see at copyblogger blog and how can I change my sidebar colour using the custom.css. i couldn’t find it.

#102 Jayne on 07.06.07 at 10:14 pm

I managed to get the header image to work by using the Cutline header image code as an example. I am still trying to figure out how to get it centered.

I am also interested in playing with sidebar color.

#103 nathalie pelletier on 07.07.07 at 6:25 pm

hi,
i’ve just unzipped the copyblogger theme and organic. in the ‘read me’ for organic it says:

“Oh, and you may have noticed the included Photoshop file with the .psd extension”

i don’t see this anywhere. please help if you can.
cheers,
nathalie

#104 Mark on 07.07.07 at 10:16 pm

Hi Nathalie,

I just downloaded the organic package and the psd file is definitely there. It’s “copyblogger_theme.psd” and it’s in the “organic” folder. If it doesn’t appear, you might have a corrupted download. I’d suggest downloading it again.

#105 nathalie pelletier on 07.07.07 at 11:01 pm

thanks mark…that’s embarrassing, it was right in front of my face! one question though; when i opened it with photoshop cs2 it was only a graphic of the comment bubble. how do i change the colors of the theme?
cheers,
nathalie

#106 ShaneR on 07.08.07 at 9:04 am

Hi, Nathalie.

I’m assuming you mean the colours for the background, text, and header etc?

Changing the colours for these involves editing the custom.css file Chris has included with the theme.

#107 ShaneR on 07.08.07 at 10:11 am

Prior to mucking around and blowing the theme clean apart:

I would like to decrease the size of the font for the post headlines somewhat. I believe that’s done in the style.css file, but I’m unsure (although I have a good idea) which line of code I should be looking at.

Thanks!

#108 Chris P. on 07.08.07 at 12:57 pm

ShaneR — You can adjust the size of the post titles across the various pages of your site with one simple CSS tweak:

  1. .custom h1, .custom h2 { font-size: x; }

where x is a value less than 2.8em, which is the default font size for headlines (equal to 28px in this case).

#109 Chris P. on 07.08.07 at 1:16 pm

Jayne — Move the img declaration inside the div id="logo", and then be sure to turn the visibility of the logo div back on. Placing the img tag inside the logo div will center it.

#110 ShaneR on 07.08.07 at 2:00 pm

Thanks, Chris.

That was crazy simple.

Methinks I need to spend some time studyin’ ;)

#111 Larry on 07.08.07 at 3:26 pm

Chris, I’ve done the same thing with my logo and I can’t get my logo to center. Could there be something else in the css stopping it?

#112 Larry on 07.08.07 at 4:04 pm

I finally got it. I had changed something in the style sheet which caused the problem.

#113 Tom on 07.08.07 at 4:28 pm

Jayne

I cheated and showed what a fan I am of Chris’s work.

I did a little tweaking and took the images from Cutline and incorporated them into my copyblogger 3 column.

The main reason I did this is because the readers loved the cutline theme but I wanted the flexibility of Copyblogger.

Check it out at http://www.therealestatebloggers.com to see and I will check back if you have any questions.

#114 kristarella on 07.08.07 at 4:44 pm

Well done Jayne! From the way you were talking I thought you were going to butcher it. It’s still nice and clean though :)

#115 Jayne on 07.08.07 at 6:29 pm

Tom

I like what you did! I just took the header code and added my own graphic (same one on every page). It seems to work.

The centering problem I solved in perhaps an unorthodox way but it seems to work too. I stated in the header image code that it was a 1000 px and it filled up the space. I don’t know if it will work across the board yet but it looks good on IE6.

I’m still building my blog but if you want to look at it so far the url is http//:webbizdiva.com

Kristarella-
I thought I might butcher it too! But I always leave bread crumbs so I can get back to where I was when I try out some tweak. Thanks for the compliment.

#116 Mark on 07.08.07 at 8:33 pm

Nathalie – The line you’ll need to change if you want to change the background color is in the custom.css file.

body.custom { background: #FFF; color: #222; font-family: Verdana, sans-serif; }

Change the #fff to #fffff0 (that’s a zero) to see what happens. You can use a color picker to find a color you like. This one isn’t the greatest, but it works ok:
http://www.colorschemer.com/online.html

or just pick one from Photoshop or Gimp, or whatever design program you’re using. When Chris says that you’ll need to update the .psd file and the .gif files, it’s because other page elements are already set to a particular color. If you don’t change them to match or complement your new color, it could look pretty ugly.

As ShaneR points out, you can change the header color and other element colors in the custom.css file also.

#117 nathalie pelletier on 07.08.07 at 8:58 pm

cheers! i’ve just gotten the 3 column version to work so now i am playing with the look…and learning the code at the same time. it’s gonna be a long night.

all of your help has been great.

#118 nathalie pelletier on 07.08.07 at 9:03 pm

I want to add a background image to the top right side…like the post-it note on copyblogger. Can anyone tell me the, i’m sure, lengthy process?

#119 Lisa on 07.10.07 at 3:56 pm

Hi Chris,
I love this WP theme and want to use it for my new site. I finally got GoDaddy to make WP work but copyblogger doesn’t come up as one of the selections for a theme, just the default and classic. I have uploaded it to the site by putting the copyblogger folder that I downloaded from your site into the wp-content/themes folder. So it is wp-content/themes/copyblogger.

Any ideas on how I can get it to come up as a selection so I can start using it?

Thanks a bunch!

#120 Mark on 07.10.07 at 5:21 pm

Hi Lisa,

Check out Chris’s comment #16 above to Aaron about permissions. You may need to change the permissions on your content folder. You’ll do this using your FTP client, typically.

Mark

#121 Lisa on 07.11.07 at 11:25 am

Hi Mark,
Thanks for that. I tried both – changing permissions for both copyblogger and wp-content to 777 and it still doesn’t show up in options for themes.
Hmm…

#122 Mark on 07.11.07 at 11:48 am

Hi Lisa,

Well, that’s annoying, isn’t it!? Let me make sure that everything is where I think it is. So, your path should be \\wp-content\themes\copyblogger where is typically your site’s name.

If you’re on a multi-domain server setup it might look like:

\lisamain\public_html\lisablog\wp-content\themes\copyblogger

or it could just be

\lisablog\wp-content\themes\copyblogger

Is that right so far?

#123 Mark on 07.11.07 at 11:51 am

Oops, I forgot to escape my brackets. Should read:

So, your path should be \root\wp-content\themes\copyblogger where root is typically your site’s name.

#124 Lisa on 07.11.07 at 12:01 pm

Hi Mark,
Yes, that is correct.
\root\wp-content\themes\copyblogger

the ones that show up are
\root\wp-content\themes\default
\root\wp-content\themes\classic

I am on GoDaddy and use Dreamweaver. I copied the copyblogger folder to my local file and then used Dreamweaver to upload to my site. http://www.365parentingtips.com.

I set the permissions for copyblogger to 777 and then for the entire wp-content folder – they were 755 and I changed to 777.

Still not showing up as an option in my presentation menu on the admin panel.

Thanks for your help.
Lisa

#125 Lisa on 07.11.07 at 12:08 pm

I just found something funky. I have a wordpress folder on my server what has wp-content in it without copyblogger and wp-admin that has the wp-content in it with copyblogger.

I think I can figure this out now.

I’ll let you know.

#126 Mark on 07.11.07 at 12:14 pm

Ah, ok. Try deleting the one without the copyblogger folder in it, or at least renaming the original WP folder.

#127 Lisa on 07.11.07 at 12:19 pm

That worked. Thanks. :-)

#128 Mark on 07.11.07 at 1:13 pm

Great! Way to go.

#129 Graham on 07.16.07 at 3:17 am

Hi Chris ive just had a good go at adding a header and footer.
I think its ok but for the life of me I cant seem to get rid the title/description of the site off header.php (you will see why) I have placed the graphic as background in the custom.php – #header code – ive tried different ways but I am struggling to work out where to put using php etc

#130 Graham on 07.16.07 at 2:33 pm

Just figured it out so no need to reply—I just commented out the appropriate line in header.php.

#131 Mark on 07.16.07 at 4:55 pm

Hi Chris,

Sorry to bug you about this, because it’s probably very simple. I can’t seem to get my permalink structure to come out exactly the way it’s described in the tubetorial.

When I do all the steps, I end up with

http://eversmall.com/index.php/get-help-when-you-need-it/

As you can see, I get the index.php in the path, which isn’t what I want.

I’m also willing to bet that I’m just completely and utterly clueless at this point. I’m sure it’s pilot error, but if you get a chance maybe you could point out the error of my ways.

Many thanks,

Mark

#132 Jayne on 07.20.07 at 7:19 am

I’m just getting set up on Google Adwords. Does anyone know how to/where to put the tracking code in this (or any other) WP theme? I’m know how to do it in my FrontPage sites but not sure for my blogs.

#133 Jayne on 07.20.07 at 11:29 am

I figured out the Google Analytics- it’s a plugin.

Does anyone else but me see a formating problem with the comments on this post. I have not been able to seem my last two comments and the text box is misshapen. It appears like there is some funky code in the comments somehow.

#134 Eduardo on 07.27.07 at 2:20 am

Is it possible to leave the background color of the side bar different from the post colum? I would like this two colum to appear differents, like one is withe and other is black…

#135 JT on 07.29.07 at 10:29 am

I must be a total newbe in that I cant seem to get my site to look much at all like yours!

Your copyblogger theme is GREAT and I would really like for my site to have a very similar look but I just cant figure out how to make it happen.

So, what do I need to do to get my site to have the same look and feel as yours?

#136 Eduardo on 07.31.07 at 8:08 pm

Something here is goin wrong, since comment #130 i can’t see others commentary, not even the comment form, in firefox or ie.

#137 brandt on 08.01.07 at 12:01 pm

On my site (WP 2.2.1), the visited link is coming up in a shade a gray while my active links are showing the regular red (#a90000) color. I’ve been trying to change the visited link to stay the same color as any other active link within a Page or Post.

I don’t have access to an image editor where I am so I can’t just find the code for that shade of gray and do a search in the Stylesheet for that specific color code. What am I missing?!

http://www.lehighvalleymma.com (Very new site!)

#138 JT on 08.01.07 at 10:20 pm

What do I need to do to obtain the colored navigation links like the ones that are on the thop right of pearsonfied.com?

#139 JT on 08.01.07 at 10:20 pm

What do I need to do to obtain the colored navigation links like the ones that are on the the top right of pearsonfied.com?

#140 irene on 08.11.07 at 4:05 pm

I am trying to get the new pages I made to show up on the copyblogger theme at pwkproductions.com.

I think I followed the instructions – my Archive page and About page work, but the new pages I created…Contact us, Distributors, don’t.

Please help.

#141 HolisticGal on 08.24.07 at 9:48 am

Why don’t the comments from an author show up in yellow on the comment page anymore? Anyone fill me in? Thanks

#142 Patricia Haddad on 08.28.07 at 5:34 am

Hi, Chris! This is Patricia from Rio de Janeiro, Brazil. I’ve been looking for a new theme for my blog and don’t know exactly how I reached your page. I really appreciate the possibility of costumizing the layout, so that the blog looks a bit more personal. From this, we could say that the Copyblogger theme is the best solution. But… I must confess I preffer the header of the Cutline theme, the one where we can put random images. Is there any possibility of kinda “mixing” both themes? Well, in fact, what I would like the best is to have a space for images on the top, as well as the name of my blog with a small sentence below (just like Cutline) BUT with the rest as Copyblogger and all its features. Is it possible? Could you help me? Thank you a lot!

#143 Onur on 08.29.07 at 12:02 am

Chris, thanks for the great theme. My question is; the position of certain elements on the post pages looks a little different than the home page and seeing the shift going from one page to another is a little weird. How can I make sure everything is positioned the same? (Basically the content on the post pages is lower than the content on the homepage)

Thanks,
-onur

#144 Nettle on 09.04.07 at 12:44 am

I have a customized google search bar which I’m using. How do I disable your custom search field and remove it from my site?

#145 Moshe on 09.10.07 at 8:55 pm

C
Is there a reason my comments-questions are not getting posted?
J

#146 Moshe on 09.10.07 at 9:03 pm

c
maybe I have the computer problem not you. Please forgive above comment.
I cannot seem to get a header image in my blog – can you help. I followed the random image tutorial and to no avail. Where exactly in the header.php file do you insert the code?
Thanks
J

#147 Roger Arnfjell on 09.11.07 at 6:19 am

I would like to place the top with navigation closer to the content on the page. Where exactly do I change the code? I think it is possible to place it about 20 px closer and gain room for the articles….

Roger

#148 Mark on 09.11.07 at 10:28 am

Roger,

you’ll just need to mess around with the CSS in the custom.css file to see what works.

Mark

#149 Roger Arnfjell on 09.12.07 at 10:16 am

Mark,
Thank you for the advice.
I´m working on that know…
Roger

#150 Peter on 09.13.07 at 1:34 am

Hey,
Nice theme working to make mine look real custom but i’m having a problem with uploading the image in to the header. Its not stretching across the top of the page and it stops about half way. i put liquid design measurements in the stylesheet.css file and placed the tag below “logo” in header.php. still nothing and if you have a chance i’m working to change the background colors in the sidbars. but the first issue is definitely more important. thanks

#151 kristarella on 09.13.07 at 2:21 am

Peter, you need to give the header some kind of background. The easiest would be to figure out what the colour is at the very edge of your image and insert .custom #logo {background:#000000;} into your custom.css with the hex value of the colour. The gradient used for the lighting effect doesn’t resolve at the edge though, so it makes matching the colour difficult – perhaps you could extend the image a bit?

#152 Peter on 09.13.07 at 5:39 pm

thanks for the help i’m gonna get on that right now.

#153 Peter on 09.14.07 at 12:47 am

help please,
the image comes up on the home page but not on the rest of the pages, i.e., about page and archives pages. thanks.

#154 kristarella on 09.14.07 at 1:13 am

It might have something to do with the URL you’ve used for the image. You put in something like "img/better.jpg" so when you go to a page with the address http://netowls.com/about/ it’s going to think that the image is at http://netowls.com/about/img/better.jpg
You’d be better off giving it a more definite URL such as (gee I hope this code doesn’t go haywire) "/img/better.jpg"

#155 kristarella on 09.14.07 at 1:16 am

Ok, so the code didn’t go well…
Have a look at your header.php and notice that the links to the stylesheets uses a bloginfo(‘template_url’) thing. Copy that link and change the custom.css to /img/better.jpg and use that as your image source (assuming your image is in the template folder in a folder called img).

#156 Peter on 09.14.07 at 12:59 pm

lol, no way the addition of that forward slash in front of the “img” was the trick. thanks alot kristarella, you were a huge help.

#157 Robert on 09.15.07 at 10:00 pm

Great Theme… just implemented on my site with a few modifications… your work is very professional and beyond anything out there… keep it up! Thanks

#158 Irene Duma on 09.16.07 at 10:59 pm

Hi there,
I am trying to make the post field size larger in the admin area – but no matter what I put in the Options>writing page, it won’t change.

Any one have any ideas?

Thanks.

#159 Onur on 09.17.07 at 10:49 am

Before I start messing up with the code, I thought I should throw the question out there. Is there an easy way to add a link next to the “comments” link under the posts? You know, something like “add a comment” so for example it looks like:

3 comments | add a comment›

Thanks,
-onur

#160 Peter Beck on 09.18.07 at 2:43 am

Hola. A footer question:

How can I modify the footer, so that it includes a link to my sitemap?

I’ve generated the latter using Copyblogger’s easy “create a Page” method, and it looks fine, but I’d like to link to it in the footer.

#161 Bill Singers on 09.18.07 at 7:40 am

I would like to use Cutline style (one thick line above heading and one dotted line below) sidebar headings to the sidebar objects instead of CopyBlogger’s double line under the heading. Is it possible?

Thank you very much for your help.

#162 Mark on 09.18.07 at 5:35 pm

Hi Peter,

you can add an anchor link (a href) to the footer.php file. I added one on my site in the copyright notice that was already there. Your link needs to follow the footer div tag.

Hope this helps.

#163 kristarella on 09.18.07 at 7:48 pm

Onur – in the index.php go to class="post-meta" and change the bit that says 'No Comments', '1 Comment', '% Comments' to 'add a comment' (if that doesn’t work properly replace each individual phrase with add a comment). Then add the comment number link that’s described in the wordpress docs.

Bill – if you find #sidebar h2 in the style.css it says border-bottom: 0.166667em double #ccc;. That’s what is making the double bottom border.
I remember reading something by Chris suggesting that it’s better to localise changes to you template to the custom.css as much as you can (so you know where all your changes are, can’t find where I read it). If you find the css from Cutline that creates the heading borders you can put it in the custom.css. I’m not sure exactly what it is, but from looking at the theme, you want something like .custom #sidebar h2 {border-top:0.5em solid #000; border-bottom:0.2em dotted #000;}. Beware – this is going to make your sidebar different to the post headings and bottoms.

#164 onur on 09.18.07 at 8:18 pm

Thanks kristarella, that works fine. I guess I was also trying to put the number of comments as just an indicator, and not part of the link. So in the example below, only “add a comment” would be a link.

3 comments | add a comment›

#165 kristarella on 09.18.07 at 8:28 pm

Yep, I understand that – the “comments_number” tag is not a link.

#166 onur on 09.18.07 at 9:29 pm

The comments_number tag is exactly what I needed. Thanks a lot.

#167 Bill Singers on 09.18.07 at 11:07 pm

Thanks kristarella, I will give it a try.

#168 Bill Singers on 09.18.07 at 11:55 pm

It worked. Thanks kristarella. However even if I change the color of the borders, the color does not change. So, I have started to learn how to write CSS.

#169 kristarella on 09.19.07 at 12:07 am

Goodo! My favourite resource for CSS reference is at W3C CSS Specs, if you got to the index you can find alphabetically most things you need. Things are often called what you think they would be (e.g. font) so it’s not that hard to find.

Also if you have one CSS style in your style sheet and then another one relating to the same thing later, the second one overrides the first (if they’re about the same thing). That might be why the borders don’t change colour. You might have #sidebar h2, but later there might be another one just about h2, which covers all the different h2s. If you want to be sure, put your CSS at the end of custom.css.

#170 Bill singers on 09.20.07 at 6:59 am

I have created Drop caps and am able to apply to my first paragraphs using the tag . It works well.

However i have to insert this tag for each article manually. Is there a way to make it automatic by changing something in template files?

Thank you.

Thank you.

#171 kristarella on 09.20.07 at 7:48 am

I expect the easiest way would be to make it a CSS class and then add the class manually to the start of each paragraph (only slightly easier than adding the style to each paragraph). Here’s a good example.
Or Google for a plugin, your guess is as good as mine for which one is a good plugin. :)

#172 tresero on 10.03.07 at 1:23 am

I notice that comments are not enabled on pages. Is there a way to add them.
I don’t mean posts, I mean pages.

#173 kristarella on 10.03.07 at 9:17 am

If you want comments on all the pages you can add <?php comments_template(); ?> into page.php above <?php endwhile; endif; ?>.
You can also have comments on selected pages by creating a page template. I’ve called mine page+comments.php and it’s the same as page.php except with the comments_template call (as above) and then at the top it has
<?php
/*
Template Name: Page+Comments
*/
?>

To implement it you make a page as normal and in the sidebar on the right it has “Page Template” with a dropdown menu that should include Page+Comments.

Hope that makes sense! I recommend the second option, it might be odd to have comments on all your pages. If you ever had a disclosure policy or something like that it wouldn’t need comments.

#174 tresero on 10.04.07 at 2:48 am

kristarella,
Worked perfect thanks.

#175 kevin on 10.09.07 at 2:51 pm

hi chris,

downloaded copyblooger smart theme.

having a problem, nothing shows where catagories are on sidebar. I have tried everything and can get nothing there, any suggestions

cheers

kevin

#176 Helen on 10.12.07 at 11:03 am

Hi Chris, thank you for the theme! I love it. Is there a way to incorporate the code for google analytics? I couldn’t work out how to do it!

Thank you!

#177 Mark on 10.12.07 at 4:21 pm

Helen,

Just add the code Google gives you into the footer.php file before the ending body tag. Alternatively, you can add it into a text widget, but I prefer to reserve those for other items.

Mark

#178 db on 10.13.07 at 12:36 am

I would like to move the RSS feed button up to the header (lots of room up their right now).

Can anyone post some code that might make that work.

Thanks.

#179 kristarella on 10.13.07 at 1:00 am

db – I don’t want to sound narky, so please don’t take it that way. Have you looked up (Google or wherever) how you might be able to do it? It’s just that it takes some time to just “post some code” and it’s hard to tell how much know-how you have to implement it.
Essentially it would involve taking the bit from the sidebar that says <p id="rss"> until </p> and putting in header.php, but you might need more CSS to get it in the right place.

kevin – More information! What’s “everything”? Do you have the wigdet sidebar enabled?

#180 dave on 10.13.07 at 1:21 am

Kristarella, no problem, I actually tried that and the RSS button ended up floating above the whole header (I put it baack up there right now so you can see-Friday evening). I was hoping someone might have already done this (move the RSS button) and than it would be just a quick posting of code.

#181 kristarella on 10.13.07 at 1:33 am

Ooh, yep… okay :)

All of your content needs to go within the “body” tags. So you’ve put the icon just before the </head> tag, but it should go after the body one just below it. I think the best place would be after <div id="logo"> whole bunch of code </div> but before the next </div>.
Try that and then we can see what needs to be added to custom.css.

#182 dave on 10.13.07 at 3:20 am

Thanks for the help. Tried a bunch of different spots in that area. I think it needs some sort of command to make it justify to the right. I’ll leave it below the title for now. Getting to late for me to keep thinking straight. Any more ideas I’m willing to try them out.

#183 kristarella on 10.13.07 at 6:53 am

Yes, that’s what I mean by “style”. CSS lets us position things properly.
To put it to the right you need either (in custom.css)
# rss {
float:right;
}

or
#rss {
position: absolute;
top: 1em;
right:1em;
}

In the first it might need more “styling” to prevent it floating on top of the header border. In the second, those numbers can be changed to suit where you want it.

#184 kristarella on 10.13.07 at 7:07 am

Actually you might need to put .custom #rss { for the first line.
You may also want to find an image that wasn’t designed to go on white, perhaps at Feed Icons.

#185 Graham on 10.17.07 at 7:29 am

Hi there
I’m in need of a helping hand!!!!!
I am using the 3 col C.B. theme and have created a template that has two columns with a left sidebar. My problem is that the pages that use this template render badly in IE6. I have done a lot research into the problem but have not found any concrete solution. e.g. http://www.kawasakigear.co.uk/products-page/
I am fully aware of all the things relating to this prob and scanned the bug files and hacks but cant put finger on it.
I know also its something to with my css file .
Can anyone help?
thanks Graham

#186 Mark on 10.17.07 at 1:38 pm

Graham,

Did you do anything to the custom.css or style.css files or are they just as when downloaded? In other words, will we need to look at the css or just the source of the link you provided? I can definitely see the problem, but don’t want to muck around for a solution if I need to see the css. Thanks.

Mark

#187 Graham on 10.17.07 at 5:05 pm

Hi Mark , Thank you v much for replying. I did create copy and rename both custom and style.css files to create a new template. Not done that much to format so probably quick to fix. How would you want to view css?

#188 Mark on 10.17.07 at 5:50 pm

Hi Graham,

You can email either the copies of the CSS to me or just the parts that you changed (copy them into a text file and put the header comment for each section that you changed, so I can find it in my copies of the original stylesheets).

email to marks at eversmall.com, replacing at with the at-sign, of course. :-)

Mark

#189 Graham on 10.18.07 at 4:48 am

Mark , thanks again – I have emailed the files and look forward to your reply.
Graham

#190 karine on 10.21.07 at 5:17 pm

First, thanks for this nice and well done template !!!

But I have a question, I modify the color of the images for the comments and if someone post a link in his comment, it doesn’t appear anymore. (links are in the same colors as in posts).
Is anyone know how to modify the color of links in comments ? I try but did’nt manage to do it.
Thanks again

#191 Tanis on 10.24.07 at 2:58 am

Hi, I’m having a real problem with the archive. I used your great theme for a medical site, but did the mods of the theme at http://dotwizards.net/blogfccmg. On the development side, the archives page shows up. http://dotwizards.net/blogfccmg/archives/, but on the live site, I get a 404 error: http://www.fccmg.com/blog/ on click of archives. I did port this within the last 30 days. Is that the problem, or is something else going on?

#192 Mark on 10.24.07 at 12:35 pm

I don’t know if this has anything to do with it, but I noticed that your “nav” div section is outside of the “container” div. This is not the way the template was originally coded, as far as I can tell. You might consider moving your nav section back into the container div to see if that helps.

#193 Simon Townley on 11.02.07 at 12:11 pm

Sorry to be dumb, but how do I switch into the code view as described in this tutorial, in order to use the advanced styling effects? Has something changed in wordpress, because I don’t seem to have the option of code editor shown in the visual. I’m using 2.3.

#194 Mark on 11.02.07 at 12:24 pm

I haven’t seen 2.3, but usually, you can find the Theme Editor under the Presentation command in the admin module.

#195 Simon Townley on 11.02.07 at 12:24 pm

Sorry, feel free to ignore the comment about the code editor not being available. For the record, it’s not there using Safari (on a Mac), but it’s there if you switch to Firefox. Should have known, really.

#196 Mark on 11.02.07 at 12:43 pm

That’s good information for those of us on Macs! Thanks Simon.

#197 Gauhar on 11.05.07 at 1:23 am

Thank you Chris for creating and sharing such a wonderful theme. This is a great contribution.

I have used your theme on my blog. I liked the way in which only the summary of posts is given on the main page, and users can click on “Continue Reading” for the rest of the post.

Is there any tutorial on how to implement it on the blog?

Thanks for the contribution to the Great World of WordPress…

#198 rena on 11.05.07 at 12:44 pm

How do I center align the title in the header? What do I have to add to custom css?

#199 kristarella on 11.05.07 at 5:22 pm

Gauhar – please see The WP documentation regarding that. Using the <!--more--> tag is how I do the “continue reading” thing.

rena – Try adding text-align: center; to the .custom #logo a part of the CSS.

#200 rena on 11.05.07 at 7:43 pm

Kristarella – Thank for your help.

I uploaded images into the header. They are showing in Firefox browser, but not in IE6.

What could be wrong? How do I correct it?

#201 kristarella on 11.05.07 at 8:00 pm

I’m afraid IE6 can be very dumb sometimes. Try ending your images properly. E.g. <img src="http://www.shedthefat.com/images/maleabs.jpg" align="left" alt="" />. It’s semantically correct to have an alternative text option there (as I’ve shown in that code). If you don’t want any text to show up when the pics don’t load then leave the quotes blank. If you’re not going to change the width and height of the images I’d just remove those bits too. Anyway, the forward slash at the end there is the key part.

#202 rena on 11.05.07 at 9:40 pm

Kristarella – The images are showing in both firefox and IE. Thank you so much for your help!

#203 MC on 11.06.07 at 2:05 am

Ok, Im not a programmer by far, but I follow directions pretty well. For some reason my ABOUT page and ARCHIVES page….and any other links for that matter give me a 404 ERROR page. What am I doing wrong? Ive watched the video about permalinks which I did. But, my wordpress install never asked me to update my htaccess. I have wordpress version 2.3. I love this theme and want to use it, but this is the only theme that gives me a problem as far as generating links and new pages.

Somebody help me please. Ive got the oscandy 3-column version installed.

The only thing that works is the search box. And once that returns a result for the hello world post I click on it, and it gives me the same error. I’m sure it’s something small, and Im sure my frustration is causing me to overlook something.

Any and all help is greatly appreciated.

MC

#204 kristarella on 11.06.07 at 2:44 am

I don’t think the theme has anything to do with permalinks working or not. If I manually type in http://www.cubiclechatter.com/?p=1 then it redirects to http://www.cubiclechatter.com/hello-world/ so presumably the rewrite works. What did you set your permalink structure to? Can you take a look at what your .htaccess says?

#205 Graham on 11.06.07 at 3:25 am

MC – re the about page – have you created / published a page about yourself yet? If / when you do, make sure you name the page slug when editing the page ‘about’ – publish it and then I think the link will work ! Good luck

#206 MC on 11.06.07 at 3:35 am

Graham: I wish this was the case. Ive already created the about page, and used the about page slug.

Here’s the result I get:
Not Found

The requested URL was not found on this server.

I have no clue whats going on. If I switch to any other template they work fine.

Any other suggestions?

#207 MC on 11.06.07 at 3:40 am

Okay i just put up a test post. I clicked on the headline and its takes me to the same 404 error message. I know it’s gonna be something small.

Chris….any suggestions?

Thanks Graham.

#208 kristarella on 11.06.07 at 3:51 am

Sorry, I made a comment but it got held in moderation cos I had two links in it.
The redirect is working (sort of) because if you type your url and ?p=1 it goes to url hello-world/

What did you set your permalink structure to? Can you take a look at what your .htaccess says?

#209 MC on 11.06.07 at 4:01 am

Hey Kristarella:

I setup the permalink structure just like it instructed in the video. However after selecting the custom option and putting in /%postname….or whatever the command was, I didnt get the option to edit or update the .htaccess file.

But, when I selected to use date and number permalink structure which is what it is set to now it gave me the .htaccess option. Below is what my htaccess code looks like.

RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]

I would like to change it back to custom permalink though as this seems to provide the best looking link system.

#210 kristarella on 11.06.07 at 5:27 am

Ok, it doesn’t seem to be using date and name. In fact now it seems to be trying to use /archives/post-number Try setting it back to default and updating the permalinks. See if they work. If they do then go back and try custom permalinks. If they don’t work on default there’s a deeper issue.

#211 MC on 11.06.07 at 11:32 am

Hey Kristarella:

I changed the permalink structure back to default and now Ii you click on the individual posts they work. Yay!

But the ‘about’ and ‘archives’ links at the top dont work. they still take me to a 404 error. Im going to try switching to custom permalinks now.

Is it my navbar thats the problem? I’d like to add additional pages to feature in the navbar, but none of them are gonna work.

Thanks Kristarella

#212 MC on 11.06.07 at 11:36 am

Hey Kristarella:

I also notice that the about and archives page don’t display as the default structure.

#213 MC on 11.06.07 at 11:47 am

Hey Kristarella:

Ok, i just tried switching back to custom permalink and it doesnt work. Once I do that all of my links on the page give me a 404 error. As soon as I switch back to default, the posts all work, and only the archives page doesnt work.

#214 Chris P. on 11.06.07 at 1:22 pm

MC — If you only use the custom permalinks option and set the slug to /%postname%/, everything will work.

It’s also possible that your .htaccess file has been modified (automatically by WP) to suit a different permalink structure, so it may be necessary to edit that file.

You can literally delete everything inside that file right now, considering you don’t have any content or inbound links yet.

#215 MC on 11.06.07 at 1:55 pm

Chris:

I tried it. Its still not working for me. Would you be willing to have a look at my backend and help me that way?

Thanks Chris

#216 kristarella on 11.06.07 at 5:07 pm

MC, just a quick note too: the nav bar is found in nav_menu.php. The archives and about links won’t work when in default links because they’re set as url/archives/ and url/about/. So they’ll only work when custom permalinks are used (and thus post slugs come into action).
I’m just saying that so you know it’s to be expected that they won’t work when in default. If you type url/?p=2 you should get your about page when default links are on.

Maybe your server is doing something funny? I found it odd that you get the server’s 404 page rather than the theme’s one. Can you check that they allow rewrites?

#217 MC on 11.06.07 at 7:35 pm

Kris:

Its all greek to me.

im about to just delete it and move on. This is way too frustrating.

#218 Simon on 11.07.07 at 12:13 pm

Has anyone ever got archives working on the copyblogger theme? I love this theme, but I’m going round and round in circles trying to work out what you should to make archives work. A lot of the links in comments to solutions don’t actually work or go places where there’s nothing about his issue.
It seems this is a common problem. Could anyone write a definitive answer to how this is done (please without hyperlinks – just one structured explanation).
btw, I don’t have an “archives” option in my page template menu. That’s one one part of the problem, but I keep coming up against explanations which don’t match with reality (such as the link to the cutline theme explanation, which actually appears to work very differently, and is therefore no help really)

#219 MC on 11.07.07 at 12:40 pm

Simon, i second that. Im glad to know im not the only one having this problem. And all my other themes load and work fine. Can anyone help.

#220 ShaneR on 11.07.07 at 10:51 pm

Guys…I didn’t read through all the previous posts before I replied posting those links (after you asked us not to!) and I just realized, based on previous posts, that I was likely of no help at all.

Sorry about that…been a long day (as you can tell…I not writing well all all)

#221 kristarella on 11.08.07 at 1:44 am

Simon and MC -

I’m writing from what I’ve read, I quickly followed the links and instructions from this comment thread and the archives page worked within about 30 seconds.

It might be a good idea to delete previous attempts at an archives page before this.

1. Check that you have “archives.php” (different to archive.php) in your theme installation.

2. If you do, move on. If you don’t, download the theme and upload that file.

3. Create a new page with Post Slug “archives” and Page Template “Archives”. Give it a name if you want, but I don’t think it’s necessary.

4. Go to url/archives/ and it should work (if your custom permalinks are working, MC – if they’re not working already then this won’t work).

Guys, if this doesn’t work then please ask more questions – try to be specific with detail.

#222 Simon Townley on 11.08.07 at 5:04 am

Thanks Kristarella. This now works fine for me. I also know why I can do it this time when I couldn’t before. I’ll explain in case others have the same problem.
When I tried to follow the method explained above by Kristarella, it always failed, because there was no “Archives” option in the Page Template menu. This was using Firefox on a mac. But when I tired again, in Safari on a mac, the Page template drop down menu was working fine and showed the “Archives” option.
This is bizarre, because it’s normally Safari that has the problems. Firefox always seemed a better choice for me working with the WordPress admin end of things. But in this case, Safari worked and Firefox was broken.
For the record, it’s Safari 3 (Leopard).

#223 kristarella on 11.08.07 at 5:12 am

That’s really odd, but I’m glad it finally worked! It’s so hard working between browsers, but I guess it would be awful if we let one company monopolise the browser market…

#224 Mark on 11.08.07 at 1:22 pm

Simon, et al,

This is a bug in either Safari or Leopard (I’ve run into the same thing), which essentially disables the drop menus in Firefox. I haven’t looked into it yet, but it’s very annoying (along with a few other glitches in Leopard). It’s good that it worked for you in Safari though.

Mark

#225 Mark on 11.09.07 at 2:30 pm

Actually, after looking into it a bit more, looks like the browsers are starting to behave more consistently when it comes to the use of the Strict vs. Transitional DTDs. There’s a fair amount of info buried in comments on the Web, but the upshot of it is that you need to make sure that you aren’t being lazy with your CSS and XHTML. At least, so far, that’s what it seems to be all about, this aberrant drop menu behavior!

#226 zparacha on 11.10.07 at 9:08 am

Chris, I installed your Copyblogger theme and I like it very much. I have one issue though. The text on the sidebar is way too small, especially in IE6. Can you please help me fix this problem. Otherwise everything else is perfect.

Thanks

#227 Mark on 11.10.07 at 11:08 am

zparacha,

keep in mind that people can easily shift the size of text in the browser (I typically do this because of poor eyesight), so changing the size statically may not be what you want to do.

However, if you want to do so, you’ll need to modify the size settings (set as em numbers) in the custom.css. Look for the ‘li.widget’ element and change the value 0.4167em to something bigger. You’ll want to test different sizes. Make sure you leave the ‘em’ part, just change the number.

#228 zparacha on 11.10.07 at 12:06 pm

Mark, thanks for the response. I guess I’ll change the size to make it little bigger. But that piece of code is commented out since I am not using organic copyblogger. Another issue is with share-this plugin. In the dropdown menu the hyperlink text is invisible, only the logos are visible. Do you have any idea how to fix this?

Thanks

#229 Mark on 11.10.07 at 2:31 pm

Hm, well, try uncommenting it and see what happens. :-) That’s the best way to figure it out.

Unfortunately, I’ve never been able to get the Share This plug in to work with this theme. It always responds the way you describe. Maybe somebody else has had luck making it work.

Mark

#230 kristarella on 11.12.07 at 2:19 am

Hey guys,
I was just about to try to cook up some css to make the Share This plugin work, because I just finished an exam and I’m nice :P I also had that trouble when I tried to use it so I just went with the Sociable plugin.
Anywho, I found this customising tool, have you seen it? It might solve your problems, plus give you some tracking functionality.
I’m going to test it out. I recommend you do too. :)

#231 kristarella on 11.12.07 at 2:24 am

Actually, just try getting the latest version of Share This, it works fine on my tester install of WP with CB theme.

#232 Chris P. on 11.12.07 at 8:32 am

If my memory serves me correctly (it’s been quite a few months since I took a good look), the Share This plugin comes with its own stylesheet. This stylesheet interacts with the theme’s active stylesheet to produce a (theoretically) nicely formatted “Share This” link at the end of each post.

Problem is, the Copyblogger Theme’s default a:hover behavior is to color the background of a link red. Oh, and links receive a default padding, and this padding overwrites that from the Share This stylesheet. The end result is an ugly link that has text overlapping the Share This icon.

My personal recommendation for the fix would be to modify the Share This stylesheet by creating specific CSS declarations that will override the theme’s default styles (but only in the Share This context).

This solution requires a fair amount of technical knowledge, at least in terms of CSS manipulation, and that’s why I’ve refrained from posting a highly detailed solution.

Besides, how much is that plugin really doing for you, anyway? Is it something that is really making a tangible difference, or does it just seem like a good idea?

#233 zparacha on 11.12.07 at 10:00 pm

Chris, thanks for your response. No the share-this plugin is not very important for me. I just liked it and thought it might be helpful for users. I will deactivate it and will use “sociable” plugin. I installed that plug in before I found share-this. They both offer same functionality. I just like share this better. Too bad it won’t work with my chosen theme. If time permit I’ll try to play with its CSS to see if I can make it work with Copyblogger. Thanks again.

#234 zparacha on 11.12.07 at 10:39 pm

kristarella, the new version of share-this does work with Copyblogger. Thanks a lot.

#235 Shelby on 11.17.07 at 5:19 pm

I love the theme and it’s even simple enough for me!
The only problem I have is, the font at the top, the header, seems too large and it seems to be too low?

1) Is there a simple way to place my logo there?
2) How do you change the font of your title so it is not so large, especially if you want more wordage there.
3) How do you make the title in the header stay at the top rather than appearing down at the bottom of the header section?
Thanks for the great theme!

#236 kristarella on 11.17.07 at 9:48 pm

Shelby – In terms of font and size in the header, go to custom.css and to .custom #logo a you have a size (2.5em) under font-family. That won’t work, just change font-family to font and the size will respond. Try 2.3em.

It’s easy to add your logo in there – you can add the image to header.php or make it a background in custom.css. (You can ask for more details if you need.)

You should ask Sharing Matters how they made their font go to the bottom of the header area – that seems to be what’s happening with your blog. I had a look at the CSS, but I couldn’t pinpoint the cause.

#237 pokerplayer32 on 11.25.07 at 3:32 pm

Awesome template! Now I don’t know if I use this one or the Neoclassical! ;)

#238 jaced on 12.01.07 at 4:56 am

Hi Chris and all,

Outstanding work. A great example of the open source spirit.

Quick question regarding Closed Comments:

If we disable Comments on a given post, there is still the “No Comments” link displayed at the bottom of the post. This is getting confusing for people who intend to comment; when they click the “No Comments” link, they’re taken to the singlepost, yet there’s no comment form as implied by the link. They’ve clicked something unnecessarily, only to be disappointed.

For posts with comments disabled, it’d be much clearer if it said “Comments Closed” below the post instead of “No Comments”. Right now there’s no visible difference between a post with no comments and a post with comments disabled. Big difference between the two.

Another cool option would be to just eliminate the link altogether, unless comments are enabled.

Thanks a lot.

#239 Chris P. on 12.02.07 at 3:48 pm

Jaced — The “no comments” indicator at the bottom of each post is auto-generated from a built-in WordPress function, and if your comments are closed for a particular post, it’s not supposed to display anything.

Here’s a live example running on the latest version of WordPress (2.3.1): check out the post on this page entitled “Linkbaiting: Vote Yes or No This Week Only.”

You’ll notice that each of the other posts has a link to comments, but that particular post does not because the comments on it are turned off.

That’s how this function is supposed to behave, and I’ve used the same function on both this template and the one that currently graces Copyblogger.com.

If your mileage varies, it may be because the comments are not actually turned off on that particular post, or simply because you aren’t running the latest version of WordPress.

#240 jaced on 12.02.07 at 6:50 pm

Hi Chris.

I’m actually on 2.3, and plan to upgrade to 2.3.1 tonight. Did that extra .1 upgrade actually make a difference in this particular behavior?

I went in to one of my posts, and Comments are indeed off. However, Pings were on. I unchecked Allow Pings, and now the post reads “Comments Off”. Kinda odd.

What’s the difference between Comments and Pings in this situation?

Thanks again.

#241 Chris P. on 12.03.07 at 10:20 am

jaced — Apparently, the WordPress function used to indicate the number of comments is not robust enough to work properly when comments are off and pings are on.

In this context, pings are simply trackback links from other blogs. While nothing can stop a trackback from happening, you can control (via the checkbox) whether or not those trackbacks are actually displayed.

#242 Stephen Anderson on 12.15.07 at 7:34 pm

Hi Chris,

I love you WP Themes!
One thing that I am have problems with is spacing. I have a video tutorial on my blog and I want to put a list of links under that video.

I seem to be having trouble getting the space between the video and the first link to stick, it keeps reverting back to being really close.

I also have trouble with the links themselves and often the links will join together and the spacing is lost when I save.
Have you had any experience with this?

The other thing that I was wondering was when I make an internal link to another page in my blog, it shows up as a trackback in the comments on the page I am linking to. How do I stop that from happening?

They are fairly simple questions I know, but I would love to hear you advice.

Also do you have a recommend list of plugins? I watched the 7 essential word press plugin series (that was excellent), are there any others that you suggest?

Thanks

#243 Chris P. on 12.16.07 at 10:59 pm

Stephen — If you use the visual text editor to compose your posts, you’re going to fight endless formatting battles, and unfortunately, you’re probably going to end up coming out the loser in most of them.

I’d suggest turning off the visual text editor and instead trying the bare-bones environment. The primary reason for this is that you won’t have to deal with WordPress’ strange and unpredictable line breaks, paragraph groupings, and other miscellaneous styling nightmares.

In my own experience, this has been the best and easiest way to correct spacing in posts where you have embedded elements (like videos).

#244 Joe on 12.29.07 at 5:24 am

pretty awesome getting tutorials on the EXACT layout that one of my websites has…I know these little tid bits apply to most ALL wordpress related sites..but when you’ve used the exact same theme as the teachers going over, it makes it a lot easier..

#245 Mark on 12.30.07 at 1:39 am

Joe, you’re definitely on target about how great Chris and others are in helping with this theme. If you try working with many other themes out there, I can pretty much guarantee that you’ll end up trying to figure out a way to use one of Chris’ themes for your site instead. Most of the free themes I’ve downloaded (about 50 of them) aren’t even widget-enabled, let alone SEO-ready.

#246 Chris P. on 12.31.07 at 1:01 am

Joe, Mark — Thanks guys. One of my primary goals for 2008 is to bring a greater level of support, transparency, and community to my themes. I’ll be launching a new site very soon to serve as the hub for all this activity, and I’ll sure to announce on here when it goes live.

#247 Mike on 12.31.07 at 2:41 am

Yo Chris, love the theme. Can you tell me how I can make the nav bar extend past the main container… would look good if it was 100% with the header bar. I think? :)

Thanks buddy… love you’re work!

#248 Chris P. on 12.31.07 at 10:46 am

Mike — The nature of the theme’s default HTML makes the changes you’ve described more complicated than they might seem.

Custom changes like that are beyond the scope of what I’m able to cover in comments and posts here, so typically, I rely on theme users who are also good with CSS to lead the way in these areas.

Off the top of my head, I can’t think of anyone who has done exactly what you’re asking for, but I do know that Kristarella has cooked up a full-width header on her fantastic site. Perhaps she’ll be able to steer you in the right direction!

#249 Mike on 01.01.08 at 2:28 am

Thanks Chris, I’ll give Kristarella a try!

#250 lawton chiles on 01.01.08 at 11:08 am

Chris, is there any way to add a cool overlapping graphic like copyblogger has to the masthead or the sidebar?

The one that says Copywriting Tips For Online and Marketing Success. Where would I add my own graphic to the code?

#251 kristarella on 01.01.08 at 7:42 pm

lawton, there’s a way to do it – it’s been done on Copyblogger. It can be a bit difficult to explain.

When I was learning html, the way I started to figure out how to do things was look at other people’s code. In this instance – the image you’re talking about is a background image. So, you need to take a look at the CSS (if you’re not using a FireFox plugin: right click > view source > find the stylesheet location in the “head” of the page).
The relevant styles are under #header h1, #tagline.

I don’t want to publish the actual code, because it’s Chris’s. If you use the method I just told you, its up to you to use it to learn, not rip off chunks of code. :)

#252 lawton chiles on 01.01.08 at 7:53 pm

Ok, thanks so much. I will take a look and see what I can come up with.

#253 jaced on 01.02.08 at 1:43 am

Hi Kristarella, you CSS goddess you,

I’m pretty sure that many people have noticed that the Copyblogger theme has no left margin when the browser is resized. (i.e. shrink down your browser window and notice how the elements are kissing the left edge of the window.)

I’d like to add some elbow room on that left edge. Say, 1em. What attribute is that in the CSS? I imagine there may be a few separate values to tweak, including the header and footer.

Thanks in advance.

#254 kristarella on 01.02.08 at 2:42 am

Haha, sure.

Yeah – it happens with a lot of good themes. It’s more noticeable on wider 3 column themes.

If you give padding:0 1em; to #logo, #container, #footer p it should fix it. It’s giving padding to the left and right to keep it all centred.

#255 matthew on 01.03.08 at 5:02 pm

For anyone who’s been having the “Share This” problem their website has a good fix.

Great theme!

#256 deb on 01.06.08 at 11:55 pm

okay,

i am trying hard to find some answers. I have been tweaking and pressing to fix this challenge:

On the home page of my site the font is okay. However, on all other pages, the font is red. Can’t figure that one out to save my life. Please help.

Also, Why does the sidebar shift on the archive page? I thought I had this one fixed. To my dismay.

Again please help..

Thanks in advance..

Deb

#257 Mark on 01.07.08 at 10:24 am

Deb,

Any chance you can send a link to your site, so we can see what the problems look like?

Mark

#258 Mark on 01.07.08 at 5:21 pm

Deb,

Make sure you have changed any color attributes for the logo entry in both style.css and custom.css.

Also, with regard to the sidebar shifting, if you changed any of the [ core layout elements ] in style.css, such as the width of the container area, you can shift other elements, like the sidebar. You might want to check the column sizes in the [ core layout elements ] section of style.css.

#259 deb on 01.08.08 at 1:21 am

hey mark and others,

thanks for the feed back. I just noticed after spending ALL that time trying to fix it, that is isn’t broke – go figure. My site looks fine in Firefox. It’s that darn IE that’s the problem. It shows my font in red on everything else except the home page. GRRRRHHH.

I’m going to stop using that thing.

Anyhow, is there a fix for that. The site is at http://www.profitablesistas.com I thought you’d be able to click my name and see the page. I can see everyone else’s. (Although, that doesn’t mean i’m referring to that page right?)

Thanks again folks. You people are really a great help. This is my first attempt at a blog and it’s coming out just about the way I wanted it.

Kudoooosss!!!

#260 kristarella on 01.08.08 at 1:38 am

Glad it’s working deb.

Your linking to your site is fine, I think it was just unclear if you were talking about the same site that you linked to in your comment details because it didn’t look broken. ;)

#261 deb on 01.08.08 at 1:49 am

thanks kristarella,

you are truly a doll. and man are great at that php stuff.

#262 Mark on 01.08.08 at 1:41 pm

Yep, the site looks great Deb, at least in Firefox/Flock and on Safari.

#263 Andrew on 01.09.08 at 10:19 pm

Chris, thanks for the great headstart to my first blog. is there some code or a widget for email capture as on copyblogger.com ?

And I can’t seem to get the organic pack to work. I am sure this is my fault…i have installed and unzipped but no luck from there.

Sincerely,
Andrew

#264 Mark on 01.10.08 at 10:16 pm

Andrew, if you did everything that Chris explains in the readme file that came with the organic files, it should definitely be working. Make sure you put the custom.css in the right location, as described in the readme. As for email capture, I assume you mean that you want to capture emails in some other way than having people sign up to leave comments, which is already available in the theme (as you can see by your own use of the feature). If you want something more robust, you should check out cforms II at the deliciousdays.com or browse the WP plugins area at http://wordpress.org/extend/plugins/ Hope that helps.

#265 Markus on 01.13.08 at 11:03 am

Hi! First: Thank you for this great theme!!! I’m looking for a 3 colums version. Is there anything out there? Or do I have to modify the theme by myself? :)

Best Regards from Germany

Markus

#266 Mark on 01.13.08 at 4:56 pm

Markus,

Go to:

http://www.oscandy.com/wordpress/451-copyblogger-theme-for-wordpress-3-column-version

The folks over at oscandy.com have put together a 3-column mod of the theme. You can download it there.

#267 deb on 01.14.08 at 10:09 pm

hey folks,

I have a very interesting problem – what I am trying to do is create an html page, namely http://www.profitablesistas.com/thankyou/

I created a folder on the root named thankyou.html.

designed the page and got it all pretty. However, everytime I try to visit it loads the copyblogger theme 404 page error. I want that to stop.

It’s driving me half way up the wall – not quite all the way up yet :) )

Please help.

#268 kristarella on 01.14.08 at 10:45 pm

Deb,

To do it that way you need to create a folder called thankyou and then inside the folder put a file called index.html.

Why not just use WordPress’s page function? Go to Write > Page then put content as you would a normal post. In the writing sidebar there’s a section called page slug, just put the word thankyou in there and it will put the page at the address you have specified.

If you want to control the html use the code editor rather than the page editor.

#269 deb on 01.15.08 at 3:24 am

Thanks Kristella,

Perhaps I wasn’t clear. I don’t want to use the theme template. I want a stand alone page no template. I followed your directions and still it calls the darn template and I end up with a 404 page. This I do not want.

I just want a regular ole standalone page outside of my wordpress blog. How can I stop it from calling the template?

Thanks

#270 Graham on 01.15.08 at 3:39 am

deb have you tried creating a link using the full url to your html page eg. http://www.yourdomainname.com/yourhtmlpage.htm
you probably have I was just checking…
G

#271 Mark on 01.15.08 at 1:36 pm

Deb,

In that case, you are linking to a page as though it’s an external link. Just to make sure we understand what you’re doing, you created a folder in the root directory called /thankyou, right? The page you want to link to should be thankyou.html (not the other way around as you describe in your original comments). So, the link should be http://www.profitablesistas.com/thankyou/thankyou.html

I just tried this on a test site of mine and it worked fine.

Also, make sure your permissions are set correctly on the folder.

#272 deb on 01.16.08 at 7:34 pm

you know that’s funny because when i click on that link it goes to the wordpress template error page.

Mark, just so I understand, when you click on the above link, you are visiting a page WITHOUT the wordpress template?

Because I have it installed in the root directory it should read http://www.XXXXx.com/thankyou.html and when I click on that link I am directed to the 404 error page.

I can’t get the darn thing to work. what permissions should i set it at? Just so i’m clear.

Thanks guys. I really appreciate the help.

#273 Mark on 01.16.08 at 9:03 pm

Hi Deb,

Yes. You can go to http://newappreview.com to see it in action. I put a link to thankyou.html in the blogroll of this blog–you’ll see it on the righthand side. The link URL is:

http://newappreview.com/thankyou.html

thankyou.html is just the WordPress readme.html, which I renamed for this test, because I’m too lazy to create a new html page. ;-)

I put it in the root, which to me means the directory that contains all of the WP files and subdirs like wp-admin, wp-content, etc.

Here’s a link to an image of my FTP client, so you can see where thankyou.html is:

http://img.skitch.com/20080117-jh45xmsn9tqpqc9qxugemnxxf6.jpg

Also, the permission probably aren’t the problem, as I’ve tried this with permissions of 644, 744, 754, and 755 and all of those have still worked, as far as displaying the file.

Let me know if some or all of this is too confusing or nonsensical!

#274 deb on 01.16.08 at 9:04 pm

HELLLPPPP!!!!!!!

please hit my link and look at my site above. I don’t know what the blank I did. Please help.

My site has been biggie sized :( (

#275 Mark on 01.16.08 at 9:08 pm

Hi Deb,

(oops, I included too many links in this message so I’m resubmitting without all of those!)

Yes, that’s right. I’m not using the template for the target html file. Look at this site:

http://newappreview.com

You’ll see the link to the html file on the right side in the blogroll. The URL is exactly as you describe above.

I just used the WordPress readme html file, which I renamed for this test, because I’m too lazy to create a new html page. ;-)

I put it in the root, which to me means the directory that contains all of the WP files and subdirs like wp-admin, wp-content, etc.

Also, the permissions probably aren’t the problem, as I’ve tried this with permissions of 644, 744, 754, and 755 and all of those have still worked, as far as displaying the file.

Let me know if some or all of this is too confusing or nonsensical!

#276 Mark on 01.16.08 at 9:15 pm

Deb,

Looks like content_box and container elements in your CSS file are set to 99em.

That’s too big, I think.

Try setting them both to 72.8em which is the original size, I believe.

#277 deb on 01.16.08 at 9:21 pm

okay let me try that.

thanks for the quick reply Mark…

#278 Mark on 01.16.08 at 9:27 pm

Sure thing. That would be in your style.css file, btw. Let me know if that fixes anything.

#279 deb on 01.16.08 at 9:35 pm

nope. that didn’t work. OMG. I need to hire a techie. This is driving me up off the cliff :

#280 Mark on 01.16.08 at 9:47 pm

Did you add any new plug-ins today, or other new items, other than just regular old posts?

#281 deb on 01.16.08 at 9:58 pm

i got it fixed mark. OMG. That was a defining moment. I can’t handle pressure like that. What I did was reinstall the original style.css. I don’t even know how I managed to change it. I didn’t mess with it. I think expressions has something to do with it. I am consistently having some strange things happen when I use it.

I appreciate your help. I still haven’t figured out why my thankyou page wont work. I am about to give up.

mark. I saw your test page. it goes to the wordpress install page. is that what is was suppose to do?

let me know.

#282 Mark on 01.16.08 at 10:10 pm

Ah, that’s always a good idea! Yes, I just used the WP readme file, which is an HTML file, as a test. I renamed it thankyou.html. I’m too lazy to create new HTML files!

Go here to see a screenshot of my directory, and where the html file is located:

http://newappreview.com/2008/01/16/deb-heres-a-screenshot-of-the-directory/

#283 deb on 01.16.08 at 10:13 pm

okay, i get it mark. but you know. I did the same exact thing. but mine won’t work. i think it may have something to do with expressions. That is what i use. somehow, im thinking that this is what’s causing the problem for me. I have done this before and it worked. I think there’s a glitch in the matrix.

Thank you for listening to me rant and for helping a sista out. I reeeeaaalyyy appreciate it.

#284 Mark on 01.16.08 at 10:27 pm

Sure thing! I’m not sure what expressions is, but sounds like it’s some sort of HTML editor. Yes, sometimes those things have a mind of their own!

#285 deb on 01.16.08 at 10:42 pm

expressions is the new version of frontpage. what do you use?

#286 Mark on 01.16.08 at 11:02 pm

Ah, I see. Well, these files are pretty simple, so I just hand code them. A bit old-fashioned I guess. My son uses Dreamweaver, but I don’t do anything all that complicated. Maybe somebody else on this site knows something about Expressions! Kristarella seems to know a huge amount, so she may be able to help.

#287 kristarella on 01.16.08 at 11:59 pm

Sorry deb – this is a crazy weird problem. I don’t know what is wrong. I hand code everything myself, I don’t know anything about Frontpage or Expression.

I can try to look at your code, but sometimes Microsoft programs do crazy things and I might not be able to find a problem. However, if you change the name of thankyou.html to thankyou.txt and upload it to the same place I might be able to download it and check it out.

#288 deb on 01.17.08 at 12:24 am

would you. cool. i will do that right now..

http://www.profitablesistas.com/thankyou.txt is done. let me know…

you are a true doll..

#289 deb on 01.17.08 at 12:32 am

I have another question. Why is it that my archive page gets pushed over in IE7? it doesnt do that on any other pages.

Any clues?

#290 kristarella on 01.17.08 at 12:50 am

Dang – I’m on a mac, so I can’t see IE7, there could be so many reasons, the main one being IE doesn’t conform to css standards as much as it should, however IE7 is better than its predecessors.

One way to find problems is run your site through the validators. Some html or css problems can cause weirdness.

I just tested your archives page on browsershots. Yes, there is some strange movement. It might have something to do with this bug?

As for the thankyou.html – I don’t know why I can’t download it. Might be easier to just email it to me kristarella AT gmail DOT com.

#291 deb on 01.20.08 at 6:26 am

Thanks for all your help.

I managed to get the pages up that I wanted. I had to put them into the public folder and change the end to .php WHEW! What a challenge.

thanks again folks you are great…

Now off to figure out why IE is bugging out on me.

#292 Terry Heath on 02.02.08 at 12:05 pm

I love this theme and have implemented it on my site (along with the “organic” stylesheet and a few changes to the header). Thank you so much for a versatile and useful design.

#293 Liz W. on 02.29.08 at 12:28 am

Chris – I LOVE the theme. I’m having a strange formatting issue in Firefox (not in Safari). When I pull up my blog, the RSS feed icon and all the right column navigation appears on the bottom of the page. Does anyone know how to fix this?

#294 Mark on 02.29.08 at 12:53 am

Hi Liz,

It looks like your embedded videos are falling outside of any div tags. You might want to see how and where you are embedding them to see if you can move them. They are not within the entry div tag. That may not be the problem, but it’s worth a look.

Mark

#295 Liz W. on 02.29.08 at 9:17 pm

Hi Mark – The problem was indeed with the way I had embedded the video. Thanks for the smart insight! I was about to pull my hair out.
Liz

#296 Mark on 02.29.08 at 11:26 pm

That’s great. Glad to hear you were able to fix it. If you’re using Firefox or Flock, you should install the Firebug add-in. It lets you click on parts of your site and shows you the HTML and CSS and how the elements are interacting. This can be really helpful.

Mark

#297 Pinoy Money Talk on 03.13.08 at 6:34 am

So this might be also the designer of cutline? Nice theme too. I’m using cutline for a long time. And I’m loving it. Maybe after sometime I’ll use this Copyblogger theme which is more pro.

#298 Leonard Klaatu on 03.24.08 at 9:03 pm

Chris,

What’s the best/easiest method of creating a sidebar for specific posts (i.e. popular posts)? I want to be able to specify the posts that are displayed.

Thanks,
LK

#299 kristarella on 03.24.08 at 9:22 pm

Leonard – convenient timing! Chris just wrote about that on his blog: What every blogger needs to know about categories.

It doesn’t have all the surrounding sidebar code, but it should fit nicely into the Copyblogger sidebar.php, if you’re not using other widgets. If you are using other widgets then you need to put this code outside of the “if dynamic sidebar” stuff.

#300 Leonard Klaatu on 03.24.08 at 9:40 pm

Doh! I should have checked there first. Thanks. I am using widgets. So where exactly would I put the code?

This is where I see the “if dynamic sidebar” code:

#301 Leonard Klaatu on 03.24.08 at 9:47 pm

Oops. Here’s where I meant:

#302 Leonard Klaatu on 03.24.08 at 9:49 pm

Well, let’s try this ONE more time and see if it works -

?php if (!function_exists(‘dynamic_sidebar’) || !dynamic_sidebar()) : ?>

Should the code go before or after this line?

Thanks for the help,
LK

#303 kristarella on 03.24.08 at 10:06 pm

Heh, yep the comment form doesn’t publish stuff in between < and > symbols, you need to change them as you did in that last one.

If you’re happy for your popular post stuff to come before your widgets then it should go before that dynamic sidebar line.

There’s a Latest Blog Entries section after that line that you can copy (from <li class="widget"> to </li>) to understand where the li, ul and queries need to go.

If you want to popular posts to come after your other widgets then you should put the code after <?php endif; ?>.

You might be able to use the code as a widget if you find and use the ExecPHP plugin (acts like a text widget, but allows PHP).

#304 Leonard Klaatu on 03.25.08 at 9:35 am

Thanks. The plug-in works like a champ.

“You the WO-man!”

LK

#305 kristarella on 03.25.08 at 3:40 pm

Haha, thanks Leonard. Glad it worked.

#306 Satya on 04.28.08 at 2:05 pm

3 questions: If anyone can help me with these i would be super happy and grateful!

1: i recently set up the blog so wordpress wold run off the root directory. Unfortunately, though, not sure if i did this correctly, since i basically just moved index.php to the root directory and renamed the blog folder wordpress – i don;t know what they mean by ‘core wordpress files’ so i kinda ignored that. The main problem is, i need blog posts to be posted at mywebsite.com/blog so i can link to the page from nav menu.

2: In pages on the site with comments turned on – comments window isn’t showing up… any clues?

3: I’d like to move Chris’s search bar down the side bar below widgets and not sure how to do that…

Any help with any of these would be awesome

thanks you rock!

#307 kristarella on 04.28.08 at 4:49 pm

Woah, Satya! Did your whole blog break?

You need to move all of your WordPress files to the root directory. If your blog is broken, I recommend moving index.php back to where it was, then going to Settings and changing the address to just .com rather than .com/blog. After that you’ll need to move your files to the root directory. If you already changed the blog’s address then just move all the files.

There are solutions for all of those things, of course if anyone else wants to weigh in and make suggestions they’re welcome, but maybe you could email me… a bit easier for me to construct responses, maybe send you a couple of files to help show you what I mean.

#308 Satya on 04.28.08 at 5:37 pm

okay i’ll email you, just to clarify though – my wordpress folder is in the root directory, and already changed the the address to .com and the blog is running ok albeit maybe a bit slow…? thanks!

#309 Dante on 05.25.08 at 10:01 pm

In the layout image “home”, “archives”, “about”, and “contact” are in a different font and the heading and body text of the post is in a different font (different than the what I have native to the template).

I would like to know what fonts are being used and at what size? In addition, perhaps an explanation on how I can change my fonts to those font types.

I tried reading through the blog post but there are just far too many to read through, thank you.

#310 kristarella on 05.25.08 at 11:10 pm

Dante, are you saying that the nav is different to the posts, or both nav and posts are different to your blog?

The posts definitely look the same to me. Could it be different computers, or browsers and anti-aliasing that makes it seem different? Show us a screenshot of what you’re seeing so we can compare?

#311 Dante on 05.25.08 at 11:33 pm

Here is the screenshot. Upon closer examination it seems that the image in this post is just smaller however there does seem to be two differences noted in the screenshot.

http://practicalproadvisor.com/requested%20screenshot.jpg

Thank you very much for your response.

#312 kristarella on 05.25.08 at 11:46 pm

Hey Dante,

I see what you mean. I think it’s definitely your computer/browser. Your blog looks pretty much indistinguishable from the screenshot in the post on my computer. See screenshot.

Perhaps there’s an option for your browser to turn on antialiasing if it’s not already?

#313 Dante on 05.25.08 at 11:53 pm

Wow, I see what you mean as well. Thanks for the tip about antialiasing and your time.

Also thank you for educating me about photobucket.com. I’m signing up for an account right now.

I work with QuickBooks quite often, if there is ever anything I can do for you please let me know.

#314 Hussein on 06.10.08 at 6:55 am

Thanks for the blackquote align right. I didn’t knew it before.

#315 Doug on 06.22.08 at 4:57 pm

Wow, what a great tutorial for pullquotes. Starting using them already – make a real difference. Blogs are becoming online magazine they might as well format like magazines.

Doug
http://www.DailyNewscaster.com
News from a Constitutional point of view.

#316 Remy on 06.24.08 at 7:07 pm

Chris, what a great theme and i have to admit you do a great job of helping everyone here on your blog. Hats off to you. Will be trying your theme.

#317 Eduardo on 07.10.08 at 8:11 pm

Please, can anyone help me with CSS? I changed the sidebar color to a different one from the article area. But i can use another color at the other side of them both.
Like a black background in both sides of the 2 columms.
Help? :)

#318 Sherry on 07.12.08 at 11:09 am

How do I get the grey background and yellow sidebars like copy blogger.

One thing I like about their posts is that the html pulls up the entire article before it pulls up the side bars.

I do like the side bars but I want the SEO benefits of having the article read first in the code.

Can anyone help?

#319 kristarella on 07.12.08 at 11:05 pm

Eduardo, looks like you’ve already achieved what you wanted using borders on your sidebars? If you haven’t figured it out yet, please be more specific. I don’t really know what it is that you’re trying to describe.

Sherry, this theme does put the content first. It goes header, nav, content, comments, sidebar, footer, and should load in that order unless you have something very slow to load in the post.

It’s quite involved to get a grey background and sidebars like copyblogger. You need to change the background colour of the body, add a background image to the container to get the shadow, you could either use that background image to give the sidebars and content a background colour that’s not grey, or add CSS to all of those elements. If you used a background image like on Copyblogger, you’d almost have to rewrite the CSS because everything in this freely available theme is of relative size (in Ems), but using a background image you’d need everything to be set in pixels.
If you want to see how it’s done on copyblogger, try using Firefox with the Firebug plugin to look at the css and html.

#320 Eduardo on 07.13.08 at 7:46 pm

Hey, kristarella, thanks for the attention. Ando sorry about my bad english…
What i was trying to do, i think, is the same you responded in the end. The background color like Copyblogger. I’ll try to understand followin the tip.
Again, thank you very much!

#321 beau on 07.30.08 at 10:29 am

Can someone lend me a little coding feedback. I increased the width of the sidebar to accommodate more advertising. However, not being totally familiar with how the em system works, the entire page has been pulled ever so slightly to the left in Firefox, and significantly off center in IE. My Sidebar was increased to 22.5 em, and width of the container was increased to 85.

#322 Mark on 07.30.08 at 10:56 am

Beau,

The container, content_box, and content tags all work together as a system. You can’t change the width on one (generally speaking) without adjusting the other two. That said, it looks like you should try decreasing the width of your container first. I’m not sure what exactly you’re aiming for, so you’ll need to play with those three widths. Imagine that the entire page only allows a fixed amount of ems. If you increase one of them, you need to decrease the other.

I would suggest that you use Firefox and install the Firebug add-on–it let’s you check your page and shows the CSS and HTML in a split screen at the bottom of your browser window. It’s a very handy way of debugging your site.

Hope that helps.

Mark

#323 Sherry on 07.30.08 at 11:19 am

I’m not sure what I’ve done, but the sidebar is appearing below all my posts. Can you help at all?

And the font size of the earlier posts I made is huge. Do you know how I may change that?

#324 kristarella on 07.30.08 at 9:40 pm

Beau, you increased the sidebar by 2.5em (compared to what it was originally), but increased the container by 12.2em. Since the content and sidebar are both floating left (not left and right) they will have an extra ~10em on the right (rather than in between them) and the whole container is centered. So it will look off balance. Hope that makes sense! Kinda looks like you might have fixed it already though.

Sherry, which browser are you using? It looks fine on mine. As for font size, did you specify a particular size within the post text? You can check this by going to the edit post section and looking at the code. If it says font-size anywhere that could be causing the problem (I can’t have a look at your older posts to check it myself because something weird is going on with the redirects).

#325 john on 08.13.08 at 10:51 am

hey Chris,

nice work – so nice that I want to use it for my company page as the basic for the template.

is it coactive to have the (c) in the footer or is it still enough to name you in the imprint?

thanks a lot for your great job.

john

#326 Chris P. on 08.13.08 at 11:38 am

john — According to the GPL (licensing), the attribution in the footer should remain intact, just as it is on this page.

#327 bill on 09.18.08 at 2:41 pm

I really love this template and wanted to use it, but being a relative newbie to WP, I was having trouble making Chris’s existing navigation links show anything but a 404. Plus I hadn’t a clue how to add any new ones.

Through a combination of Chris’s comments and others, I culled together a little protocol that works for me and wrote down the steps so I’d remember them later. I thought sharing it might be helpful to others in the same jam, so here goes…

Note: This explanation assumes you’ve already switched to using custom permalinks, displaying post name, rather that WP’s garbage name.

For thoroughness, I’m also going to assume you want to add a new page, starting from scratch, and have it appear up in the navigation bar. I’ll use the arbitrary example, “articles.”

1. On your computer, find (or re-download) the copyblogger theme and add a new file to it: articles.php. The easy way to do it is duplicate one the already-existing page files (like “archives.php”) and rename the copy “articles.php”)

Re-upload this new version of the copyblogger theme to wherever your blog’s files are hosted–specifically, to WP content > themes folder.

2. Go to your Dashboard > Design > Theme Editor and open the nav_theme.php file. Copy line 3 (it begins <a <?php…)

Paste it in as a new line, but substitute “articles” for whatever page name was in the line you copied (i.e. “archives”).

3. If you’re using 2.5 or later, it’s hard to find page slugs, so here’s an updated procedure for what to do next:

Create a new page, and give it the title “articles.” Click in the content window and wait a few seconds till you see the permalink appear, just above the window. It will read “example/?11″ or whatever the WP permalink post name is. Click “edit” and change the permalink to read “example/articles” Save page.

4. That’s all. You should now see “articles” in the navigaton bar along with the other links. When you click on it, it should open a page ready for you to fill — not a 404. (If it DOES open a 404, you’ve either done something wrong, or my explanation needs a tweak.)

Hope this helps.

#328 bill on 09.18.08 at 2:45 pm

Sorry. The totally confusing sentence about creating a new file in the theme should read:

The easy way to do it is to duplicate one of the already-existing page files (like “archives.php”) and rename the copy (i.e.”articles.php”).

#329 dinu on 09.22.08 at 4:48 am

Guys, how do I change the sidebar color ?

#330 kristarella on 09.22.08 at 6:15 am

dinu,
you can try .custom #sidebar {background-color:#ddf;} in the custom.css, although all the sizes may also need tweaking to prevent things hitting the edges of the colour.

#331 dinu on 09.22.08 at 6:55 am

@ kristarella

thanks :) and yes, I will have to do more work on that
meanwhile, I need two more things

one, changing color for container,

two, adding a line to separate sidebar from the container .. a vertical line

#332 kristarella on 09.22.08 at 11:42 pm

dinu,
Colour of the container is the same code as before, but #container instead of #sidebar.
.custom #content {padding-right: 3.9em; border-right:0.1em solid #ccc;}
.custom #sidebar {margin-left:2em;}
Will do the separator, but again it needs tweaking due if you want to do background colour stuff.

#333 dinu on 09.23.08 at 12:17 am

@ kristarella

thanks :) it worked like a charm :)
now, I need to try to find how to add the same thing to the container, I am playing with this code

#334 Greg Perry on 09.24.08 at 4:38 pm

Sorry to be a newbie, but I learn fast.

My blog is very new with only one page and one mock-up post. Well it WAS until I changed to the CopyBlodder theme…

I copied the CopyBlogger theme to my Themes folder, signed in, then switched to it.

Now my LogIn link is gone, my blog’s opening page says It’s Time to Slap Somebody, and I really need to be able to edit posts and pages.

Although I am new to all this, when I switched themes before, only my style changed but my blog’s content did not change. Here, though, it’s like you replaced my content!

Please tell me how to change only the style and not the content. Thanks!

#335 kristarella on 09.24.08 at 7:30 pm

Greg, that slap somebody message only shows up when it can’t find any posts.

Could you tell me what the address of your example post is (find it by going to http://bidmentor.com/wordpress/wp-admin/ and going to Manage Posts and clicking “published”)?

I can’t find any evidence that you have any posts, pages or categories on your site… perhaps something screwy has happened to your database? Whatever it is I don’t think it’s caused by Copyblogger.

As for the admin links, they’re not built into this theme, but you can add them to the bottom of your sidebar by adding the Meta widget under Design > Widgets in the admin area.

#336 Greg Perry on 09.24.08 at 7:47 pm

Thank you Kristarella! Just knowing the strange SLAP message was due to no posts is encouraging. Knowing it is that and not an error means it will go away. I did a simple skeleton post and sure enough, it is gone.

I know, I know, I need to read and study the Copyblogger site and I will do just that NOW. But I had to know if anything was really wrong after seeing that strange SLAP message.

My ONE page is there and still active and accessible and it does take on the copyblogger theme so that is good. But one must go directly to the page’s web address, it’s no longer linked at the top of my blog but that is okay.

http://bidmentor.com/wordpress/coweta-library-friends/

The fact it’s not accessible from the home page is unimportant, it’s a stand-alone page for a group I spoke to and I used my new empty blog site because I needed to stream audio and knew there was a WordPress plug-in for it.

So I am ready to populate the blog. Thank you for letting me know no errors are present (except lack of content).

#337 kristarella on 09.24.08 at 8:00 pm

Glad to clear the air :)
Once there’s an about page and some posts the whole thing will start acting a little more normal.

#338 Ron on 10.10.08 at 10:18 pm

In IE7 my sidebar text is tiny. It displays fine in Firefox 3.
I saw in the style.css around line 198
li.widget,

If I remove the comma then Firefox duplicates the tiny text, but with the text IE is still small.

Any ideas?

Thanks

#339 PB on 10.12.08 at 4:58 am

I’m sure there’s a really simple solution, but how do you centre article titles? For example, how to centre the title at the top of this page?

Many thanks,

#340 kristarella on 10.12.08 at 5:18 am

PB,
Use .custom #content h1 {text-align:center;} in your custom.css.

Ron,
I can’t really figure out why it’s doing that in IE, but there’s a lot of errors in your code — several of them are unclosed images. They should have a slash at the end like <img src="/image.jpg" alt="" /> there are a few others as well.
Maybe IE hasn’t coped with that very well and there’s a style slipping through to the text or something.

#341 PB on 10.12.08 at 5:41 am

Kristarella,
I added the above code to custom.css as you suggested, but nothing happened :(

#342 kristarella on 10.12.08 at 6:29 am

Have you activated custom.css as described in the file?

#343 PB on 10.12.08 at 6:44 am

Sorry, you’ve lost me. How does one activate custom.css? And in which file is it described? – couldn’t find it in the file itself.

#344 kristarella on 10.12.08 at 4:26 pm

Sorry, I thought it said something in custom.css that it doesn’t actually say…

The code works for me, if you have a link that you can show me I can troubleshoot it further.

#345 PB on 10.13.08 at 6:51 am

Sorry, I had only looked on the homepage where headlines had not been centred, but they are on individual article pages. Thanks.

#346 Paul on 10.15.08 at 1:24 am

I’m a great fan of the Copyblogger theme. Thank you for making it available here.

I’m trying to customise the header and navigation areas and would welcome any advice. I want to add a logo in the black header area (left) and include five navigation buttons into the same space on the right (removing the navigation from its current position).

I’m not sure which of Chris Pearson’s theme files I’ll need to amend nor how to do so without breaking the theme. You can see what I’m trying to achieve in the image file at http://paulboakye.net/pics/site_compo.jpg.

If anyone has an example that they’ve altered in a similar way, I’d be grateful for instruction details or a sample of the codes.

Many thanks in advance.

Paul

#347 kristarella on 10.16.08 at 4:06 am

Paul, I gave some instructions on how I modified mine.

Not all of it would apply to what you’re doing, but the principles of using custom.css would.

You could move your nav with
.custom #nav {width:40em; float:right; margin-top:-3em;}
Then you would give the LIs background images or CSS for the backgrounds.

You could use
.custom #logo a {display:block; background:url(custom/header.jpg); text-indent:-999px;}
for the name of the blog.

#348 Paul on 10.17.08 at 3:27 am

Thank you, Kristarella, you’re a gem!

I’ll pass this on to someone who knows more about these things than I in the hope that we can get it sorted soon.

If anyone hear can fix this quickly and earn a few dollars via PayPal, do let me know.

Cheers,

Paul

#349 Paul on 10.17.08 at 3:28 am

Thank you, Kristarella, you’re a gem!

I’ll pass this on to someone who knows more about these things than I in the hope that we can get it sorted soon.

If anyone here can fix this quickly and earn a few dollars via PayPal, do let me know.

Cheers,

Paul

#350 Rosie on 10.17.08 at 8:35 pm

HI,
How do I hide the blogroll in this theme?

Thank,

Rosie

#351 Mark on 10.17.08 at 11:27 pm

You remove the Links widget from the theme–In the Admin panel, look for Design > Widgets.

#352 Rosie on 10.18.08 at 4:54 pm

HI,

How do you get a bio photo in the sidebar, kind of like you have on yours Mark?

Except I only have one sidebar on the right.
Thanks for the help….

#353 Ron on 10.18.08 at 7:53 pm

Thanks Kristarella
I’ll see what I can find and try to fix the media loader to include a closing / from now on.

Mark ~ I love the 3 columns! I need to do this for another site using this theme.

Ron

#354 Mark on 10.18.08 at 8:06 pm

@Rosie: Add a text widget to your sidebar, and then add an img tag that references your image (which you will need to upload to your host server).

@Ron: yes, I like it too! The oscandy.com folks are redesigning their website, but you can download their 3-col version of Copyblogger from their main page still.

#355 Rosie on 10.18.08 at 8:52 pm

Mark, I lost you after adding the text box…

I do have the file uploaded to host service already because i’m using the same pic on my about page, like you did.

i don’t get how to put in the text widget.

thanks…

#356 Mark on 10.18.08 at 9:41 pm

Hi Rosie,

No problem.

1. Sign in to your admin dashboard:

yourblogname/wp-admin

2. Select Design > Widgets. The page is divided into two columns: Available widgets and Current widgets.

3. Make sure you select “Sidebar” or “Sidebar1″ from the drop-down menu on the Current Widgets side of the page.

4. Locate the “Text” widget toward the bottom of the page on the left side.

5. Click “Add.” This puts the widget into a list on the right side of the page.

6. Click the “Edit” button at the side of the Text widget label on the right side of the page. The one that you just inserted by Adding it. This will open a small edit box.

7. In the edit box, add your img tag:

(or wherever you saved the image file)

8. Click “Save Changes.” That should do it, though you might or might not want the center tag.

Give that a shot.

Chris–sorry about the links in my earlier “waiting for moderation” version of this message–it’s been a while since I’ve answered anybody and I just plain forgot about that!

#357 Mark on 10.18.08 at 9:48 pm

Rosie,

Check out w3schools.com for quick reference and tutorials on the html image tag.

#358 Paul on 10.19.08 at 1:58 pm

OK, have solved my previous query. Thanks, Kristarella! Couple more things.

I get a stray navigation link that points to “Previous Entries” on a page2 that doesn’t exist. Can’t quite work out why this happens.

Maybe because I’m using the “Show on Frontpage” plugin to restrict the number on entries showing up on the index page. Anyway, I want to stop it happening, any thoughts?

Also, what’ the issue with the Share This plugin and this theme?

Cheers,

#359 Mark on 10.19.08 at 3:51 pm

Hi Paul,

I have looked at your site and I don’t see the stray navigation link you refer to. I’m using Firefox on a Mac. The site looks great to me.

Also, just a note, but you should really put Chris’ copyright notice/link back into the footer, as per the terms of use. Many of us include our own copyright notices in addition to Chris’ so that shouldn’t be a problem. Chris’ link lets other people who like your site find this one, which is really the least we can do for getting a free theme of this quality. :)

At any rate, if you are still having problems with the link, please let us know where exactly it’s showing up and what browser you’re using. Thanks.

#360 Paul on 10.20.08 at 5:38 am

Point taken, Mark. I greatly admire and appreciate the work Chris does. I even subscribe to his RSS feeds. I’m more than happy to include a link back here in the more subtle footer area of my site.

I see countless examples of Copyblogger being used across the Net in various altered forms without any credit given to its creator. I do hope therefore that you’ll be sending the Footer Police Force out on a more general petrol, too. :)

The “Previous Entries” navigation link I spoke of can be seen at the end of my “Home” page just above the footer zone. It seems to show up in all browsers I use and links to a 404 page not found.

Was there ever a fix found for the Share This plugin? The link displays oddly on my site.

Thanks again for your help.

#361 kristarella on 10.20.08 at 5:56 am

Paul, I’m not sure what’s going on with your previous link. You have older posts so there should be an older page. I even tried to go here (the default permalink 2nd page), but it redirects to here and not found. Have you tried disabling the plugin you think is the culprit and testing it?

Share This was fixed, but it was merely fixed by upgrading the plugin, something in the plugin fixed its compatibility with Copyblogger. However, it looks like you have a reasonably new version because it has some kind of rotating GIF that I’ve never seen before.

Try .custom a.stbutton:hover {padding-left:22px; color:#000;}. Not really sure what the problem is ’cause Firebug isn’t grabbing the hover style. Also, not sure how well :hover will work after a class, but give it a go anyway.

#362 dinu on 10.20.08 at 5:58 am

@ paul

good job, with the modifications .. :)

#363 Mark on 10.20.08 at 11:30 am

Hi Paul,

Unfortunately, I won’t be able to muster up the Footer Force out on the web, but when they show up here, look out! ;-)

OK, I see the link now. There appears to be an anchor tag (“a href”) that points to page 2 and contains the “Previous Entries” text, in your navigation div. If you look in navigation.php, you may find the culprit.

I’ve never been able to get the Share This plugin to work properly. Maybe somebody else has some advice about this. Sorry.

#364 Greg on 01.16.09 at 5:23 pm

Does anyone know how you would get the sidebar AND the widgets to not show up on pages? I have my site with the blog as its main page, but want to have the other pages of the site possibly not show the sidebar. I used a custom template and tried hiding the sidebar, but when I did that, the sidebar *widgets* still show up, with funny formatting in addition. Anyway, any ideas?

#365 Hornetsfan on 01.17.09 at 11:41 pm

Hi,

Can you guys give some more details on comment #236 ?

I’m looking to add a small logo just on the left of blog name. Here is a picture of what i’m trying to do.

I’ve try to edit the header.php, but i can’t manage to place the logo next to the blog title…

Can you please give me the code to place in the header.php and custum.css ?

Thanks for your help

#366 Gus on 03.20.09 at 6:28 am

Hi,
I just downloaded the copyblogger (CP) and it looks neat. However I’m a fan of the 3 column themes. I went through the thread to see if that exist with CP and it looks like it can be customized. Will anyone please walk me through the steps to convert it from 2C to 3C? Will really appreciate it.

Thanks

#367 Mark on 03.20.09 at 2:43 pm

Gus,

You’ll need to download the osCandy version of Copyblogger.

http://www.oscandy.com/index.html

#368 Steve on 06.03.09 at 11:04 am

Absolutely brilliant , been looking for a theme like this for ever.
Thanks for making it available.

#369 Roger on 06.14.09 at 8:08 am

I’m little confuse (newbie).when i make the changes to “custom.css: nothing happens. when i edit the “style.css” i see the changes in effect. i created a directory under the theme call “custom” move “custom.css” to the directory. am I missing something?
Thanks

#370 dinu on 06.14.09 at 10:01 am

you don’t need to put custom.css in a /custom folder .. it should be within the main folder of the theme …

#371 Roger on 06.15.09 at 5:34 am

Thanks for your quick response. Ok, I thought i read that somewhere. I did put the custom.css back into the main folder. like I said when I make the changes to custom.css i do not see any changes. I do see the changes when I work with style.css.

#372 dinu on 06.15.09 at 5:45 am

what changes are you making on the website ? code used ? also, after making the change, did you try changing cache of your browser…

#373 JG on 07.22.09 at 6:43 am

Hi, I’ve enjoyed using this theme for my blog, and now I’m trying to adapt it for a static personal site. The home page will not have much content, so I’m running into the problem of the footer showing up in the middle of the browser. I’ve found the sticky footer solution, but I’m no programmer and haven’t been able to get it to work. I understand that I should add the CSS code to style.css, but I’m not sure where to add the HTML code. Any advice would be much appreciated.

#374 kristarella on 07.25.09 at 1:05 am

JG — You will need to add <div id="wrap"> to header.php, just after <body class="custom">. Then add </div> to the top of footer.php.

You might need to add class="clearfix" to <div id="container" in header.php, but I’m not sure if it is needed. Then in the CSS given by the Sticky Footer site change #main to #container.

#375 JG on 07.25.09 at 1:09 am

Thanks for the reply! I was able to sort it out.

#376 Greg on 08.14.09 at 8:58 pm

Amazing, the sticky footer fixed my problem too. Awesome.

#377 How to Format Your Images with Copyblogger | Bizimhost.biz on 12.01.09 at 4:58 pm

[...] In our first example scenario, we want to align an image to the left, and we’d also like to have our paragraph text wrap around the image so as to maintain a clean, uninterrupted flow. You’ll start by inserting an image into your post just as you normally would, but in order to apply the proper CSS class, you’ll need to switch over to code view by clicking on the “Code” tab. A quick explanation of that process along with a visual can be found here. [...]

#378 Dom on 12.22.09 at 3:24 pm

Hi,

I cannot for the life of me figure out how to get the left-hand nav widget bar working, can anyone help me please?

Cheers,
Dom

#379 Mark on 12.22.09 at 4:20 pm

Dom,

This isn’t a 3-column theme, by default, if that’s what you mean. If you want both right and left widget sidebars you will need to locate the oscandy version (there are several mentions of it in other comments on this site with links, I believe) of the theme, which is retrofitted for 3 column use. Otherwise, could you be more explicit about what you are trying to do?

Mark

#380 jasmine on 12.29.09 at 5:20 pm

SO i dowloaded the zip folder for the copyblogger theme. how do i set it to my wordpress account? Is there a way to do this myself or do i need to have a designer do it?

#381 Mark on 01.24.10 at 12:59 pm

Hi Jasmine,

You need to upload the theme to your host. If you have installed WP using Fantastico or Simple Scripts from your web hosts cpanel system, you should be able to log in to your WP site (http://www.yoursitename.com/wp-admin), go to Appearance, click “Add New Themes” and then click the Upload link at the top of the page. This allows you to browse your local machine and upload a zip file containing the theme. Otherwise, you will need to unzip the files and use an FTP program to upload to your web host, typically into the public-html directory, or sometimes into a public-html/www directory, depending on how your host sets things up.

#382 unwuakeable on 04.08.10 at 2:05 pm

Gracias!!
Best regards

#383 meg on 06.29.10 at 8:42 am

i saw one comment earlier about the search function, but didn’t spot any follow-ups. does anyone know how to remove the search function from the theme? i love chris pearson’s work, but i do not want a search function. i’m deleting it wherever i find it in the code, and yet, it persists. it has to be the sturdiest part of the whole theme.

#384 kristarella on 07.02.10 at 4:06 am

Meg, you need to remove the following from sidebar.php
<li class="widget">
<h2>Search</h2>
<?php include (TEMPLATEPATH . ‘/searchform.php’); ?>
</li>

#385 Jase on 08.07.10 at 6:15 pm

Question – I don’t see any customisation on the theme but I like how copyblogger.com use a left sidebar -anyone know how I can do that? Thanks.

#386 Tofik Online on 08.18.10 at 12:04 pm

thanks for the advice. The problem was that I already had a directory called ‘links’ in the doc_root of my web server. I removed that and all is good.

#387 technupower on 01.29.11 at 3:27 am

great simple wp theme,.. thanks Chris :)

#388 arramuse on 03.14.11 at 7:18 pm

Cool, thanks.

I’ll try on my blog that using thesis. :D