← Subscribe to Comments Plugin Updated for WordPress 2.2+

How to Add Navigation Links to Your Header

July 5th, 2007 | How To

As you add content to your site, you’ll no doubt want to edit the navigation links that appear at the top of each page. Fortunately, this is extremely easy to do with the Copyblogger Theme, and with the help of this tutorial, you’ll be able to get the job done in less time than it’ll take you to brew that next pot of coffee.

You need two things in order to get started:

  1. FTP client
  2. text/code editor

Since you needed an FTP client to upload this theme to your server, I’m betting you have #1 covered. Also, since 97% of you are running either Windows or OS X, you’ve likely got a default text editor you can use to satisfy #2 (Notepad or TextEdit).

Oh, and this tutorial assumes that you’ve already implemented smarter permalinks. If you’re not sure what that is or how to do it, I highly recommend checking out this video for more info on the topic. But hey, even if you haven’t changed your permalink structure or are unable to do so, I’ll still show you how to add navigation links to your header (cause that’s how I roll).

Navigation Menu Example Tutorial

spacer For the purposes of this example, let’s say that we’ve created a contact page by visiting WritePage in our WordPress Dashboard. We’ve also made sure to write contact in the Page Slug box on the right, as this will determine the final URL for our newly-created page.

Once you’ve created your page, it’s time to fire up that text editor and open the nav_menu.php file that is included with the Copyblogger Theme. The file contains only three lines of code, and you’ll want to pay special attention to line #3, which will serve as a “template” for adding your new link. If you haven’t edited anything, line #3 should look like this:

  1. <li><a <?php if (is_page('about')) echo('class="current" '); ?>class="<?php bloginfo('url'); ?>/about/">about</a></li>

In order to add your new contact page link, you’ll need to copy and paste line #3 on a new line. Now, replace all references to the word “about” (shown in orange above) with the Page Slug you created earlier. In this example, our Page Slug is contact, so our new navigation menu link code should look like this:

  1. <li><a <?php if (is_page('contact')) echo('class="current" '); ?>class="<?php bloginfo('url'); ?>/contact/">contact</a></li>

Now, all you have to do is save the nav_menu.php file and upload it to the Copyblogger Theme directory on your server. Voila, your navigation menu is updated!

Oh, and your coffee is ready spacer

I use the default permalink structure… can you help?

spacer If you’re using the default permalink structure, then you’ll create a page just as shown in the example above, except this time, once your page is created, you’ll need to visit ManagePages and locate the unique ID of the page you wish to link. Now, after copying and pasting line #3, you’ll need to replace the second reference to the Page Slug with a reference to the unique ID. For the example scenario posed above, the proper code should look like this:

  1. <li><a <?php if (is_page('contact')) echo('class="current" '); ?>class="<?php bloginfo('url'); ?>/?page_id=8/">contact</a></li>

Note that there is only one change to the code—the destination of the link has become ?page_id=8 instead of contact. Pretty simple, huh?


#1 JHS on 07.08.07 at 1:47 pm

Since this theme does not have the usual verbiage just before the Comment box, how do I find my trackback address?


#2 Chris P. on 07.08.07 at 6:19 pm

JHS — Trackback addresses in WordPress are universal, meaning that they are the same no matter which theme you are actively using.

For WordPress blogs, simply using the post’s URL is adequate for a trackback. For other blogging systems like MovableType or TypePad, you’ll need to append the post URL with trackback/ in order to properly generate a trackback.

#3 JHS on 07.08.07 at 7:33 pm

Thanks, Chris. I never knew that! spacer

I love the Copyblogger theme and am using it on 2 of my sites: jhsiess.com and tokaylodi74.com

#4 Fredrick on 07.09.07 at 10:25 pm

Chris, thank you for an excellent theme. And assistance you provide on this blog.

I have a question about the plugin More From Google (windyroad.org/software/wordpress/more-from-google-plugin). Is it compatible at all with Copyblogger?

It appears, not surprising, that the two search functions interfere with each other. I get a “parse error: syntax error” message, when I click on the More From Google link. It references line 7 in the theme’s search.php.

I have tried the plugin on only one page of the blog: blog.readrinky.com/howie-schneider-creator-of-eek-meek-dies-at-77/

Any work-arounds you can think of are appreciated. Of course, if the MFG plugin and your theme just can’t play together, I understand. Thanks for any help you can provide.

#5 Lisa on 07.11.07 at 10:58 am

Hi Chris,
Thanks for the theme. I’d like to use it but it isn’t coming up in my choises under the presentation. I have uploaded the folder copyblogger and its contens to wp-content/themes/.

Any ideas on how to get it to show up as one of my choices for presentation?


#6 Hopeful Spirit on 07.11.07 at 1:40 pm

Is it possible to put a graphic in the header of this theme?

#7 Roshan on 07.14.07 at 4:05 pm

Chris, thanks. Is it possible to include external links in the header navigation? I run the blog as an extension to my webiste and would like to include a few links from the main site.

#8 Marshall on 07.16.07 at 2:04 am

I really like your theme, thanks! I’m very new to wordpress but can understand instructions. I’d like to know how to get the “about” page to link to one of the pages I created. I created a page and put the slug to “about” but that didn’t work. Any advice is appreciated. Keep up the good work!

#9 Mike on 07.19.07 at 1:04 pm

Thanks for your insight. Is there a similar mav_menu.php in the 3 col Cutline Theme. I ‘m challenged with getting pages to show up – can you pint me to current files.

#10 cburell on 07.24.07 at 12:51 pm

Love the theme, and wonder if it would be easy for you to share how to modify it to allow comments on pages as well as the blog page?

Thanks spacer

#11 Test user on 07.29.07 at 9:40 pm

How can I add the calendar to the side bar?

Thank you all.

#12 The Mixtape Monster on 08.03.07 at 12:58 pm

Hey Chris, I use your cutline theme at www.themixtapemonster.wordpress.com , but I can’t figure out how to get my Blogroll links to show up on it. Any ideas? Shoot me a line at themixtapemonster@gmail.com if you get the chance. Love the theme.

#13 Armen on 08.06.07 at 10:13 pm

Thanks for this…I was a little puzzled for a few minutes!

P.S. – I had a nice little chuckle to myself when I read the 404 page…very witty!

#14 Ben Licher on 08.10.07 at 3:25 pm

Just discovered that the search function doesn’t find anything on pages like about and archive. Also not on this site. Does anybody knows about it and about solving the issue?

#15 Kirk T on 08.10.07 at 4:21 pm

Ben Licher – I’ve been using the Search Everything plugin, and it seems to work for what I need.

#16 Ben Licher on 08.10.07 at 5:32 pm

Thanks a lot Kirk, I wil check the plug in.

#17 Ben Licher on 08.10.07 at 5:40 pm

Well Kirk, I searched your site for: The Views of a Tardy, which is on your ‘about’ page and ‘Hmm, no results… try again?’ was the result spacer .
I’m using the theme as it came. I will dive into it. And let you know if I find something.

#18 Kirk T on 08.10.07 at 11:14 pm

Ben – I have the option turned off to allow the search to include other pages. My “About” page is empty for the most part, but once I put something there, I’ll keep the Search Everything turned on.

I went ahead and turned it on so you could check it out. Just type any word from my “About” page, and it should work.

Here is what else I’m using at the moment as far as plugins I’ve found helpful.


#19 Kirk T on 08.10.07 at 11:17 pm

Previous link didn’t work…here it is again.

#20 Ben Licher on 08.11.07 at 1:51 am

It works Kirk, thanks a lot. Lovely list of plugins you use! I wil check them.

#21 Fixing the archives link in the Copyblogger theme — Andy Sylvester’s Web on 08.11.07 at 1:32 pm

[...] link in the header of the page did not display the archives for my site. I reviewed this article which talks about adding links to the header navigation area, but it did not have any information [...]

#22 Robin on 08.14.07 at 6:40 am

hey guys, I am a teacher and all of my students need to use IE6 ( I know!) anyway, the font for the navigation links renders really badly for them, does anyone know whick file I would edit to change that font? I think it is just courier, but if nothing else I would like to make it a little bit heavier.

If anyone knows how to do this, would you please e-mail me and share….



#23 Chris P. on 08.17.07 at 10:04 am

Robin — Line 46 of your custom.php file begins with .custom #logo a. Locate that line and modify the font-family attribute to something like this:

font-family: Tahoma, Verdana, sans-serif;

#24 DJ on 09.07.07 at 7:00 pm

I just added this theme to one of my blogs. When I go to post a comment it doesn’t work. The site gets stuck on wp-comments-post.php

#25 hkarthi on 09.08.07 at 3:26 pm


i like your theme very much and i tried using it for my blog. But when i create a new page such as “about” or “contact” it is not getting linked to the top header. i get the following error:

Not Found
The requested URL /blog/about/ was not found on this server.

Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request.

Any advice is much appreciated. Keep it going!

#26 Neil on 09.16.07 at 6:00 pm

Great Theme Chris, i`m having a play around with it now. Same as hkarthi i`m unable to get the new pages to be `found` …. I`ll dig about in the header file.

#27 Neil on 09.16.07 at 10:31 pm

Got it …. changed to the below approach and no probs!


Thanks again Chris!

#28 Fahmishah on 09.19.07 at 10:38 am

dude! my blog is not nice to view in IE.can anyone help me?

#29 Leonard Klaatu on 09.21.07 at 11:54 am

Chris, how can I display author’s names on each post. I’ve got a site with 3 different authors. I love the template. Great work.

#30 JHS on 09.21.07 at 9:15 pm

Chris: I started to modify comment.php to separate comments and pings, but then noticed the verbiage referencing that.

I get pings, but they don’t show up on my site. On the front page of one post, for instance, it says “16 comments.” When you click on the perma-link and open that post’s unique page, you find 5 comments displayed.

1) How do I get pings and trackbacks to show up?
2) Will they be separated simply by virtue of using this theme or do I need to do something further?


#31 eric on 09.23.07 at 5:59 am

Hi, first of all – I like your theme very much. But i have a problen with the Flickr Photo Album plugin in combination with firefox.
With the Internet Explorer everything looks nice but with Firefox which most of my friends use, the page looks a kind of defaced. Have a look at: servus.homelinux.org/blog/fotos/album/72157601916931875/

The footer of the Photos page is above the the main page. Any ideas how i can fix this?

Kind regards.

#32 Lisa on 09.25.07 at 8:57 am

Hi, I am trying to add a link on the navigation to my static website which is a different domain hosted elsewhere. Is there a way to do this? I cannot find a link id for this site in my blogroll so i wouldn’t know how to reference it using your tutorials above.


ps lovely, lovely theme, Chris!

#33 JHS on 09.28.07 at 1:45 am

Hi Chris:

I just wanted to note that I use Copyblogger on several of my sites. I upgraded to 2.3 on 3 of my smaller sites and it works just fine! The only problem is an error message related to categories that is showing up on the dashboard. I believe Brian wrote about a fix . . . I just haven’t had time to play with it fixing it yet.

You can see 2.3 + Copyblogger in action at:


I have not yet tried upgrading my main site, Colloquium, due to time constraints. I will play around with it this weekend.

Thanks for your wonderful theme! I love it and receive a lot of compliments on the clean, easily readable and navigable layout. I have had fun customizing it, too. I just dabble . . . don’t know php, but do know html from the old days of building static sites, so I’m slowly but surely figuring a few things out. I appreciate that the files are easily understood by lay folks like me.

#34 carl on 09.30.07 at 7:25 pm

thanks for providing this great theme!
would also have been great to see an updated version for WP 2.3 so that tags can be showed in each post spacer

#35 william on 10.01.07 at 12:16 pm

I just wanted to say thank you, you really went out of your way to document a great free theme.

We are using it as a temporary design on our new los angeles magazine; www.la.cityzine.com the designer who is making the final theme was little surprised to see it looking so good in the interim.

#36 Kevin on 10.03.07 at 10:52 am

Is there an updated 3-column theme for WordPress 2.3?

#37 Personalising the Copyblogger theme — This and that on 10.06.07 at 12:17 am

[...] process are nav_menu.php, style.css, custom.css and footer.php. There is already a good post about changing or adding navigation links on the theme homepage, so I’m not going to talk about that. Chris Pearson, on his own blog, [...]

#38 engel on 10.09.07 at 11:03 pm

Hi, I’ve translated this theme into Esperanto, if you’d like to offer a translation download somewhere.


#39 dave on 10.12.07 at 10:31 pm

Thanks for the theme and the super easy instructions. Adding the sitemap was easy once I found this article. Thanks.

#40 K-SAN on 10.14.07 at 8:44 pm

Chris, I like this theme but I have a problem to enable “Archives” page.
Could you include this archive page instruction like Cutline theme do?


#41 Ryan on 10.19.07 at 12:40 pm

How do we move the navbar from the header to the left sidebar like on Chris’s site copyblogger.com?


#42 todd on 10.23.07 at 2:21 am

I am trying to add navigation links to the sidebar, and want them to have the ‘bullet.gif’, like the other links do.. what controls that being included with links? Thanks!

#43 db on 10.25.07 at 5:38 pm

Chris, thanks for the article. I changed the archive in the header to something else because I figured the sitemap does the same thing.

#44 AngelArs on 11.30.07 at 11:43 pm

Chris, love this theme!

We’re trying to center our logo in the header. What is the best way to do this? Thanks.

BTW-logo already appears, we just can’t get it to center properly…

#45 John on 12.06.07 at 8:47 pm

I like it.. Just tried it out and it worked, no problems. Thanks.

#46 Chris on 12.21.07 at 10:50 am

Awesome theme and thank you for putting so much time into it! I hate to ask but will there be an updated version for wordpress 2.3?

#47 Joe on 12.29.07 at 5:13 am

Hi, just wanted to say I LOVE the theme. I used it already on a website that’s been up for months…very clean. I love how when you highlight a link it blocks it in red. Yeah, I appreciate the little things. spacer either way, good job.

#48 Chris P. on 12.31.07 at 12:21 am

Chris — The actual list of changes that must be made for complete 2.3 compliance is short. If you’re talking about tags, however, I probably won’t include those because of their contributions to link saturation on people’s sites. This is a condition that negatively affects a site’s SEO (more of my thoughts here in paragraphs 4 and 5), and it’s not something I’m going to encourage by including it in my templates.

Of course, if the situation ever changes and tags are nofollowed by default, then yes, I’ll absolutely make room for them on my themes.

Be that as it may, I’m hoping to have an updated version of Copyblogger complete with a new, modified version available for purchase by the end of January. When the time comes, I’ll be sure to announce the news on this site.

#49 Chris P. on 12.31.07 at 12:51 am

Chris — I have posted even more in-depth thoughts on the use of tags with WordPress sites.

#50 JHS on 01.01.08 at 3:13 am

Chris: I just want to be the first to say that when you have an updated version of Copyblogger ready, I want to know about it! I LOVE this theme and have been using it on several sites since shortly after you released it.

What I would LOVE to have is all the current cool features of Copyblogger == especially the type styles, etc. — in a magazine format. In fact, if you need someone to test such a product, let me know because I will happily do so and advertise it on my sites! I love many of the magazine-style themes, esp. Brian’s, but the fonts are always too small. I just wish I had the ability to do the coding to implement Brian’s Revolution Magazine style, for instance, into your overall Copyblogger “look.” To me, that would constitute the penultimate WordPress theme!

#51 Brad on 01.01.08 at 4:48 pm


Awesome Theme! It is GREAT. I was wondering if anyone knows how to make the sidebar be on the left, instead of on the right.

I’m looking for a more traditional type layout, and would love it if anyone could help out in this sidebar movemento.

Mucho Gracious,


#52 Manas on 01.06.08 at 11:35 pm

Hi Chris,

Amazing theme. I edited the theme to make the primary column wider. I also resized the comment backgrounds, but why is the comment_top image being chopped off from the right ?

#53 James on 01.08.08 at 11:03 am

very useful tip,just learn it,thanks

#54 Mia Roman on 01.10.08 at 3:45 pm

Chris, great theme! I’m trying to figure out how to change the header to include my logo and a cool flash gif show – is it possible – reading like a fiend here to figure it out! Thanks, Mia at www.neofusenews.com

#55 RA on 01.21.08 at 10:44 am

Hi, Chris – I’ve installed the theme on my site, and so far, it’s been great! I echo the question from Manas (#52) about widening the main column. In addition, I have two other questions:

I can’t quite figure out how to make all of the links on my site, when hovered, show a green underline. It seems to only work on my widgetized links (archives, categories), but all others don’t behave the same way.

Also, is it possible to make the internal navigation links appear on the same line? Or is that just a built-in safety for longer titles?

Thanks for your help!

#56 3rd test | rebtnetwork.org on 02.14.08 at 9:27 pm

[...] ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vivamus ac dui auctor orci varius pharetra. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla eget diam. [...]

#57 middleman on 02.15.08 at 10:23 am

wow! this one is good and thanks but can i customize it for my own taste?

#58 kermit johnson on 02.17.08 at 1:41 pm


My Copyblogger works great on Firefox but not on IE. Any suggestions?

#59 Unfaigelileasp on 02.17.08 at 3:01 pm

Jesse scabbarded the forearm for what seemed like hours, but what was tactiemily only 30 minutes. I turned my proposal to erupt his spasmotic move.

#60 di.stilled on 02.21.08 at 10:36 am

I can’t make my site work correctly in ie7 and ie6… Using this theme and haven’t changed anything in code and CSS. What am I doing wrong?

#61 ufc videos on 02.22.08 at 7:49 pm

well maybe its not IE compliant you may apply some IE CSS hacks for that to make it both IEs

#62 Lena on 02.22.08 at 10:07 pm

Hi Chris:

First let me start by saying, I know you’re not for hire. spacer

We just added the copyblogger theme to the our blog and we cannot add Permalink, Email This or Trackback to append each post.

Editing the Main Template has not worked and editing Single Post has not worked.

Any ideas?


#63 sam i is on 02.26.08 at 8:05 pm


i’m wanting to put a image/navigation menu in my header…? how do i do that? I built it in fireworks as a png, and then can export it into htm format… is there anything i can do or am i out of luck?

seen here: www.duregger.net/header.htm

thanks, btw – your themes are killer

#64 Nate on 03.06.08 at 3:00 pm


Like Leonard I run a group blog and would to know how to make the authors names show up. I am new to Word Press, and while I have little trepidation about going on my own any help would be greatly appreciated.

#65 wh on 04.05.08 at 10:56 am

Great theme.

Thought I’d mention that with wp 2.5, the permalink settings have to be changed to allow for editing slugs.


#66 A1 on 04.08.08 at 2:13 pm

WH, thanks for the tip on the permalinks. Much appreciated.

#67 Lee on 04.21.08 at 10:09 am

I have been trying to set up a blog for two weeks now, and tonight I found, downloaded, and edited (with basic CSS skills only), your theme, with barely a hiccup. Just wanted to say a huge thanks, hopefully my dreams will not consist of CSS coding tonight!

I just have a small problem in regards to a graphoc header I put in, it shows opposite in Firefox and IE browsers, I want it to centre with the text body, but when I try putting the code it, it reverses on each browser….

Thanks again….

#68 @balootisme.com on 04.24.08 at 10:59 pm

i’d download this theme; and copyblogger theme too.

thanks a lot.

but need a small tweak to looks like copyblogger.. spacer

#69 mangiaspaghetti on 04.27.08 at 7:49 am

Hi Chris, thanks for this great theme. I’m a newbie and I’m having a problem with the nav menu links.
I’ve created a contact’s page using your instructions, but when I click on the link in the nav menu, I can’t visualize it. The browser tells me that in the folder /contact/ there isn’t an index page and that I have to create a page named index.html or index.htm or index.php.
The fact is that I’m using the Altervista’s host and I don’t know how to fix the problem. In the blog’s database there isn’t any folder named “cont

gipoco.com is neither affiliated with the authors of this page nor responsible for its contents. This is a safe-cache copy of the original web site.