Bainternet WordPress Consultant
  • WordPress Services
  • Blog
    • Fancy Functions
    • ShortCodes
    • How To’s
  • Plugins
    • Post Editor Zen Coding
    • Advanced Code Editor 2.0
      • other older versions
    • ShortCodes UI
    • User specific Content
    • Simple QR Code
    • Sidebar per user role
    • Simple TOC
    • Post Creation Limits
      • Posts Creation Limits older versions
    • User Ranks
      • Bainternet User Ranks v1.0
    • Custom Category Template
    • Author category
    • Simple Gist Embed
    • WordPress Simple Instant Search Plugin
    • GoTo Redirect
    • Simple Google +1 plugin
  • About Me
    • Donations
  • Contact me

Simple TOC – table of contents plugin

Posted on May 08, 2011
Ohad Raz
61 Comments
simple toc,table of contents,toc
Plugins
  • Share on Facebook.
  • Share on Twitter.
  • Share on Google+
  • Share on LinkedIn
Simple TOC - table of contents plugin


Contents
  • Simple TOC:
  • Background:
  • Screenshots
  • What does it do?
  • Download:
  • Installation:
  • Usage:
  • Change Log:


Simple TOC:

This plugin generates table of content for a post or a page using shortcodes, with a few clicks you get something that looks just like the table of contents to the right of this very text.


Background:

Nothing special, just read a question asking for a plugin that generates a Table of contents for a post or a page, and i figured that most of the plugins that do that are outdated and buggy.


Screenshots

table of contentstable of contentstable of contents


What does it do?

This plugin makes it easy to create a wiki like TOC (table of contents) in your posts or pages using shortcode, no linking or creating anchor is needed.

Main features:

  1. Auto generate heding links in TOC based on given tag eg: h2,h3 (new)
  2. New TinyMCE (WordPress editor) button. (new)
  3. Added a new heading for TOC. (new)
  4. Create as many TOC as you want.
  5. TOC is per page/post basis.
  6. No coding or coding knowlage is required.


Download:

Download the latest Version from WordPress.org

Installation:

  1. Extract the zip file and just drop the contents in the wp-content/plugins/ directory of your WordPress installation.
  2. Then activate the Plugin from Plugins page.
  3. Done!


Usage:

Once the plugin is activated you will see a new button in your tinymce (WordPress default) editor, and when you click on it a popup will show with 3 options:

  • Auto TOC heading – insert once in the place you want your TOC to show and enter the tag used for your headings (eg: h2,h3…).
  • TOC place holder – insert only once in the place you want your TOC to show.
  • TOC Header – insert once or none at all, anywhere you want, this will show as the TOC itself heading.
  • TOC Heading – insert as many headings as you want include there heading, this will be the text at the TOC link, Usually insert anywhere you have heading (h2,h3..).

When using “Auto TOC heading” then don’t use “TOC place holder” and the other way around, they don’t work nice together

Styling:

I left the styling up to you, the code generated includes a container div with the class “toc” and you can use that as your selector, or you can use this in your style.css file to get a similar look and feel of the default wikipedia TOC.

.toc{
    background-color: #F9F9F9;
    border: 1px solid #AAAAAA;
    padding: 5px;
}

this is it, enjoy and any feedback is welcome, also make sure to submit bug if you find any.

Change Log:

  • 0.3 new auto heading generation, fixed html errors
  • 0.2 New tinymce button for easy shortcode insertion. added a header for TOC.
  • 0.1 initial release.

Incoming search terms:

  • simple toc wordpress plugin some links do not work
  • bainternet-simple-toc/simple-toc modification
  • toc html code header
  • toc for heading wordpress
  • tinymce toc
  • tinymce tableofcontent
  • simple toc wordpress
  • html simple toc

Related posts:

  1. User specific Content Plugin
  2. Bainternet User Ranks v1.0
  3. Posts Creation Limits






Loading comments...
  • About the author

    Ohad Raz

    I'm a WordPress Consultant, a WordPress Developer and a WordPress Freelancer
    Currently in my third year of Software Engineering B.Sce Degree.
    I've been developing Websites and web applications on WordPress for over 5 years.
    I live in Kiryat Gat , Israel.

    • Write an E-Mail
  • Other Methods of contact

    My profile on WordPress Answers

    profile for Bainternet at WordPress, Q&A for WordPress developers and administrators

    • My Code Poet listing

    • My Careers 2.0 Profile

    • My Gravatar.com Profile

    • My About.Me Profile

    • Contact Form

  • Enter your email address to subscribe to this blog and receive notifications of new posts by email.

  • Contribute

    If you like this plugin and want to contribute to future development of the plugin, or simple show your appreciation please consider make a small donation









  • Recent Comments

    • WordPress Developer Ohad Raz on Custom taxonomies extra fields
    • WordPress Developer Ohad Raz on Advanced Code Editor 2.0
    • WordPress Developer Gomy on Custom taxonomies extra fields
    • WordPress Developer javier on Advanced Code Editor 2.0
    • WordPress Developer Ohad Raz on Advanced Code Editor 2.0
  • Enter your email address to subscribe to this blog and receive notifications of new posts by email.

  • Top Posts & Pages

    • WordPress Taxonomies Extra Fields the easy way
    • Custom taxonomies extra fields
    • how to - WordPress Category Extra Fields
    • How I add a WordPress MetaBox


  • About Me
  • Blog
  • Contact me
  • disclaimer
  • Donations
  • home posts
  • WordPress Services
© 2011 by Bainternet WordPress Consultant