Feb 6, 2013 / Intermediate

Creating an Index on WordPress.com

A good example of an index from http://all4ballet.com/

A good example of an index from All4ballet.com

WordPress.com gives you many flexible options for organizing your content. You can create a Custom Menu to organize your pages. You can group your posts into categories and use category pages in your menu to display them in archives. You can put a Custom Menu widget in your sidebar if you’d like your navigation be to the side of your content rather than in your header area.

Sometimes, though, you might want to create a more specific index of your contents than category pages or monthly archives allow. For example, a food blogger might want to create an index of all his recipes, grouped alphabetically or by main ingredient. Or a journalist might want to create an index of all her published articles, grouped by publication or topic.

For some inspiring examples, check out this index of ballets by dancer Prisca, or this recipe index by chef The Weekend Gourmande. These bloggers used page jumps to create their beautiful, functional indexes.

To try it yourself, just list your headings (whether A-Z or Entrées-Desserts) at the top of your index page. You’ll want to make sure you’re entering this code in your Text Editor, rather than your Visual Editor. Add the following code to each heading (I’ve used Side Dishes as an example heading):

<a href="https://wordpress.com/dailypost/2013/02/06/creating-an-index-on-wordpress-com/?like_comment=145038&_wpnonce=21f098dcdf#side-dishes">Side Dishes</a>

Then, add the following code to wherever each heading link should point when clicked, or “anchor”:

<a id="side-dishes">Side Dishes</a>

In this example, my anchor is a Side Dishes subheading, under which I could list all my side dish recipes. The ID after the # sign can be anything you want it to be, as long as the ID in the original link matches the one in the associated anchor. You can also use this method to link to content on another page entirely.

On a related note, did you know that you can customize your archives pages using the archives shortcode? A shortcode is a code shortcut – by enclosing certain words in brackets, you can do magical, wonderful things on WordPress.com.

With the archives shortcode, you can control whether your archives list your posts from only the last three weeks or from the last three years, in a drop-down menu or an unordered list, with a post count or without. You can also use the same shortcode in a text widget to create a custom archive list in your sidebar. You can even use this shortcode to create a chapter index, if your blog is really a book!

For example, the following shortcode will display all of your posts published in the last 20 days in a drop-down menu with a post count:

[archives format=option type=daily limit=20 showcount=true]

And voila! Here are The Daily Post’s last 20 days:  

For more details on how to use the archives shortcode, check out the support documentation here.

Do you use an index to organize your site’s contents? What tips can you share for how to help readers easily find their way to the most interesting posts in your archives?

Psst – if you clicked Side Dishes above, you’re here now. See how that works?

Show Comments

53 Comments

Comments are closed.

Close Comments

Comments

    3. Here’s what each code means
      herf= “link to” on this example we are linking to an id symbolized by # and what ever id you give such as side dishes.

      are open and close codes and allow the link to work. You put what you want to link (side dishes- just the name) between the two. In your first is where you put the link command herf=”#side-dishes” . Make sure it’s the same as the example or else the code won’t work.

      id just gives the link a name so if you have multiple links you can have different id’s

      You get your head around it 🙂

      Like

    4. It seems more complicated at first glance than it really is. I know I blanch any time I hear the word “code,” but it’s really quite simple. Check out the linked articles – they’ll take you through it step-by-step. And if you have any trouble, let us know!

      Like

  6. I have a sticky post (pinned to the top of the page) called “Everyone needs to manage their career, not everyone needs to manage SharePoint” that explains my blog’s content, and lists the most popular content from (a top ten list) from each category.

    It does require some manual maintainence occasionally, as newer posts move up in popularity, but I find that it is helpful to casual readers.

    Like

  7. I’ve searched for and found this info online more than once, but in such an unorganized presentation, I could only hope I grasped it and never dared actually try it. 🙂 Thanks for making it clear.

    I won’t have to be sure I’m editing in text rather than visual, because for some reason, my edting page has begun defaulting to there.

    Also, I hope the limit=20 actually means 20 posts, and not 20 days. 🙂

    Like

    1. I believe the default is whichever Editor was selected when you last published a post. So, next time you post, click to the Visual Editor before clicking ‘Publish.’ Then, see if it defaults to the Visual Editor when you next add a new post.

      And it does mean 20 days! But you can set it to however many days, weeks, months, or years you like, or leave it at the default, which will list all your posts. 🙂

      Like

  8. I use an index and a contents page. The contents only has entries once, but the index is in alphabetical order of posts with some included twice in the place their topic would be if it came first. For example. Back to business: Work (part 2) appears under B and W.

    Index

    Like

  12. Wow! You described indexing in such a simplified and fun way. It used to look to me like a bunch of rigorous codes, but it now looks like some fun to try out.
    Welldone! 🙂

    Like

      1. Yes on the first question! I do use the categories widget in my sidebar, but I was thinking it would be useful to be able to create a page with an index of tags (similar to an index in a book). My blog (americanturban.com) has over 1,500 tags at this point, so to do this manually would be rather time-consuming.

        Like

  15. My new years resolution (now Chinese new year resolution) is to create a functional index page for my cooking and travel blog. This couldn’t have come at a better time, thanks WP!

    Like

  17. I’ve been doing this for quite some time, and I’d like to add a couple of comments. (If no one understands this, then just ignore it.) First, as the number of your posts grows, some topics in the index will becomes too large. If that happens, consider moving that topic’s links into a sub-page, and then change the jump-code to a link to the sub-page.

    Second, be careful not to lock yourself into an index that you may want to revise and expand in the future. Bear in mind that as the number of posts grows, you may re-arrange things and move some topics to other indices. I suggest that you don’t put “helpful” links in your posts leading to the index, which probably say “For more like this, see …..” When you eventually re-arrange the index, all those links will become obsolete.

    Like

    1. This is really great advice – if your index gets too big, it can become unwieldy, both for you to manage and for your readers to peruse.

      The tip about breaking it up into sub-pages is a good idea.

      Liked by 1 person

    1. That’s very cool feature. Don’t know much about wordpress or another social network that much. Thanks for the info. I definitely need to learn more about it and implement this when I got more time. Thanks Elizabeth and a good day.

      Like

    4. Often (as in your index) the first line of the note is hidden by the wordpress-bar when one clicks on the jump.
      You can avoid this by setting the anchor (#) in the line above what you want to show. E.g. before the last full-stop of the previous paragraph.

      Technically challenged

      Like

  20. I read the wordpress.com documentation on the archives shortcode. I do use it for my “site map” page.

    In the documentation it advises: ” Last 17 weeks with some before and after text:
    [archives type=weekly limit=17 before='some before text' after='some after text'] ”

    Please give an example of before and some after text in the short code. I’m befuddled here.

    Like

    1. That allows you to add some text and/or HTML before or after the archive link. But to be honest, I’m not sure what sort of text or HTML people would use that to include.

      Does anyone else have an example of how that option is useful?

      Like

  24. I have a visual index of my projects using inlinkz. I actually had page jumps (the anchors are still there), but wasn’t quite satisfied with how it looked. I’m probably going to add them back in at the top, but using the headers I made instead of links. Check out my project gallery:

    Project Gallery

    Like

  25. Can anyone explain why my blog looks nothing like the way I designed it when viewed via Internet Explorer and yet looks exactly the way I designed it when viewed using Google Chrome? [I realize this is not the forum to post questions like this but I didn’t know how to reach out to Word Press.]

    Liked by 1 person

  30. I had removed my index page earlier because I thought it might be tedious for my readers to scroll through the long list. The jump feature changes that! Struggled with it a bit, but finally got it up and working! Thank you so much Elizabeth 🙂

    Like