A powerful yet user friendly plugin that automatically creates a context specific index or table of contents (TOC) for long pages (and custom post types). More than just a table of contents plugin, this plugin can also output a sitemap listing pages and/or categories across your entire site.
Contents
Description
Built from the ground up and with Wikipedia in mind, the table of contents by default appears before the first heading on a page. This allows the author to insert lead-in content that may summarise or introduce the rest of the page. It also uses a unique numbering scheme that doesn’t get lost through CSS differences across themes.
This plugin is a great companion for content rich sites such as content management system oriented configurations. That said, bloggers also have the same benefits when writing long structured articles. Discover how Google uses this index to provide ‘Jump To’ links to your content.
Includes an administration options panel where you can customise settings like display position, define the minimum number of headings before an index is displayed, other appearance, and more. For power users, expand the advanced options to further tweak its behaviour – eg: exclude undesired heading levels like h5 and h6 from being included; disable the output of the included CSS file; adjust the top offset and more. Using shortcodes, you can override default behaviour such as special exclusions on a specific page or even to hide the table of contents altogether.
Prefer to include the index in the sidebar? Go to Appearance > Widgets and drag the TOC+ to your desired sidebar and position.
Custom post types are supported, however, auto insertion works only when the_content()
has been used by the custom post type. Each post type will appear in the options panel, so enable the ones you want.
Screenshots
- An example of the table of contents, positioned at the top, right aligned, and a width of 275px
- An example of the sitemap_pages shortcode
- An example of the sitemap_posts shortcode
- The options panel found in Settings > TOC+
- Some advanced options
- The sitemap tab
Install / upgrade
Install the plugin by searching for Table of Contents Plus from the plugin add menu, or directly from the WordPress plugins repository.
There are no special upgrade instructions (woohoo!). Overwrite your existing folder with the latest or use the streamlined approach in the plugin menu. Your options will not be lost.
Help
The simplest approach
For the impatient, all you have to do is enable the plugin.
The plugin will apply default settings and produce the table of contents before the first heading on pages (not posts, nor custom post types) with four or more headings.
No shortcodes are needed.
Where’s my table of contents?
- In most cases, the post, page or custom post type has less than the minimum number of headings. By default, this is set to four so make sure you have at least four headings within your content. If you want to change this value, you can find it under ‘Main Options’ > ‘Show when’.
- Is auto insertion enabled for your content type? By default, only pages are enabled.
- Have you got
[ no_toc ]
somewhere within the content? This will disable the index for the current post, page or custom post type. - If you are using the TOC+ widget, check if you have the “Show the table of contents only in the sidebar” enabled as this will limit its display to only the sidebar. You can check by going into Appearance > Widgets.
- You may have restricted generation to a URL path match. The setting can be found in the advanced section under Main Options.
How do I stop the table of contents from appearing on a single page?
Place the following [ no_toc ]
anywhere on the page to suppress the table of contents. This is known as a shortcode and works for posts, pages and custom post types that make use of the_content()
I’ve set wrapping to left or right but the headings don’t wrap around the table of contents
This normally occurs when there is a CSS clear directive in or around the heading originating from the theme (Twenty Eleven and Twenty Twelve are two themes which do this). This directive tells the user agent to reset the previous wrapping specifications.
You can adjust your theme’s CSS or try moving the table of contents position to the top of the page. If you didn’t build your theme, I’d highly suggest you try the Custom CSS plugin if you wish to make CSS changes.
Try adding the following CSS to allow the wrapping to occur around the table of contents:
h1, h2, h3, h4, h5, h6 { clear: none; }
How do I include the name of the page in the table of contents title?
As the title of the page changes depending on the page you’re viewing, you can use the following special variable to automatically insert the title of the page into the table of contents heading:
%PAGE_NAME%
You can use it as is or place text either side of the variable.
As an example: if your page is named Great Expectations and your table of contents title is set to Contents for %PAGE_NAME%, the final title would read Contents for Great Expectations
My site has 100 pages but I only want the table of contents to appear on 10 of them
You could put [ no_toc ]
on the 90 pages but that wouldn’t be fun… so try the following:
- Go to Settings > TOC+ and disable the auto insertion option for pages (or the content type you’re working with).
- Add
[ toc ]
onto the 10 pages that need them. Note that the table of contents will appear where you placed the shortcode.
Alternatively, you could also experiment with the restrict path option if the pages you want to include the index on all fall within a certain section of your site (eg /doc/).
I want to ignore certain headings
Use the ‘exclude headings’ option if you would like to ignore certain headings. Separate multiple headings with a pipe |
. Use an asterisk *
as a wildcard to match other text. Note that this is not case sensitive. Some examples include:
Fruit*
ignore headings starting with Fruit*Fruit Diet*
ignore headings with Fruit Diet somewhere in the headingApple Tree|Oranges|Yellow Bananas
ignore headings that are exactly Apple Tree, Oranges or Yellow Bananas
Use the TOC+ widget and drag it into your desired position. If you want the table of contents to only be displayed in the sidebar, then make sure you tick that option in the widget.
Unlike Wikipedia, I want all my anchors to be lowercase and use hyphens rather than underscores
There are two options that allow you to adjust the casing and use of hyphens. If you still require more, you can massage it a little more by attaching into the toc_url_anchor_target
filter. See the developers section for an example.
I would like to incorporate a sitemap
- Create a page for your sitemap (if you have an existing one, use that instead).
- Add
[ sitemap ]
into your page and save.
The above is the simplest example of integrating a sitemap listing all pages and categories. You can customise the sitemap options under Settings > TOC+ or check out some of the more advanced uses with the sitemap related shortcodes below.
You could also incorporate a sitemap using a text widget and pasting any of the sitemap shortcodes.
The sitemap uses a strange font dissimilar to the rest of the site
No extra styles are created for the sitemap, instead it inherits any styles you used when adding the shortcode. If you copy and pasted, you probably also copied the ‘code’ tags surrounding it so remove them if this is the case.
In most cases, try to have the shortcode on its own line with nothing before or after the square brackets.
Shortcodes
The plugin was designed to be as seamless and painfree as possible and did not require you to insert a shortcode for operation. However, using the shortcode allows you to fully control the position of the table of contents within your page. The following shortcodes are available with this plugin.
When parameters are left out for the shortcodes below, they will fallback to the settings you defined under Settings > TOC+.
Shortcode | Description | Attributes |
---|---|---|
[ toc ] | Lets you generate the table of contents at the preferred position. Also useful for sites that only require a TOC on a small handful of pages. |
|
[ no_toc ] | Allows you to disable the table of contents for the current post, page, or custom post type. | |
[ sitemap ] | Produces a listing of all pages and categories for your site. You can use this on any post, page or even in a text widget. | |
[ sitemap_pages ] | Lets you print out a listing of only pages. |
|
[ sitemap_categories ] | Similar to [ sitemap_pages ] but for categories. | |
[ sitemap_posts ] | This lets you print out an index of all published posts on your site. By default, posts are listed in alphabetical order grouped by their first letters. There are CSS classes for each section, letter and list allowing you to customise the appearance. |
|
For developers
How do I customise my anchors?
If you’re still not happy with the anchors, you can modify them to suit your needs through a custom function hooked into the toc_url_anchor_target
filter. As an example, place the below code snippet into your functions.php file to convert all anchors to uppercase.
function my_custom_anchor( $anchor ) { return strtoupper( $anchor ); } add_filter( 'toc_url_anchor_target', 'my_custom_anchor' );
toc_get_index( $content = ”, $prefix_url = ” )
Returns a HTML formatted string of the table of contents without the surrounding UL or OL tags to allow the theme editor to supply their own ID and/or classes to the outer list.
Both parameters are optional:
$content
is the entire content with headings. If blank, will default to the current content found in $post (eg within “the loop”).$prefix_url
is the URL to prefix the anchor with. If a string was provided, it will be used as is. If set to “true” then will try to obtain the permalink from the $post object.
These examples assume you are within “the loop”:
- Obtain the index for the current page
echo '<ul id="my_toc">' . toc_get_index() . '</ul>';
- Create a listing of all children and their headings
$children = new WP_Query(array( 'post_parent' => get_the_ID(), 'posts_per_page' => -1 // get all children )); while ( $children->have_posts() ) { $children->the_post(); echo '<h3>' . get_the_title() . '</h3>' . '<ul>' . toc_get_index( get_the_content(), get_permalink( $children->post->ID ) ) . '</ul>' ; } wp_reset_postdata();
Versioning scheme
I have adopted the same Ubuntu versioning scheme so the first release is 1107.
Other releases in the same month will be dot releases, eg the second release in July 2011 is 1107.1.
I love it, how can I show my appreciation?
If you have been impressed with this plugin and would like to somehow show some appreciation, rather than send a donation my way, please donate to your charity of choice. Feel free to leave a short note here if you’d like.
I will never ask for any form of reward or compensation. Helping others achieve their goals is satisfying enough 🙂
Questions or suggestions?
If you have questions or suggestions, please place them below.
Actually, what happened is I created a fixed header section. It required added a top-padding to the body to even everything out, so now the links are offset. What I’m wondering is if there’s a way to move the so it doesn’t cover the tags, but rather precedes it. That way I can individually offset each span using CSS. Thanks for your help. And if you need a donation of any kind, just supply me with your paypal. Tnx.
If you’ve enabled the smooth scroll option, go into the advanced options and you can specify an offset to accomodate for your custom header section. Failing that, you could try the CSS suggestions at http://stackoverflow.com/a/13184714
Hey. So when I click something on the TOC, it takes me to a tad BELOW the specific header. I’d rather it take me so it shows
—– TOP OF PAGE
header
content
// VERSUS //
—– TOP OF PAGE
content
//
Any tips? I’m not sure what part of your code I need to edit to make this happen. Thanks!
Yeah that’s because of the WordPress admin bar and non logged in users won’t have that issue. However, if you enable the smooth scroll feature then it’ll accomodate for the admin bar if present.
Hi There,
I just installed your plugin on my blog, but I cannot see the Table of Contents. I’ve tried using and omitting the [toc] shortcode, neither option gives me any results. Here is the page in question, as you can see there are more than 4 headings…
http://uniquecontentwriter.360nourishment.com/services
Great plugin in BTW and it’s also great to see that you are quite active on this blog – even after 2 years – and show no signs of slowing down.
Yeah it’s good to see the development (mostly suggested by the community) over the years!
I had a chance to look at your page just now and I think this will be an easy one. The headings you have aren’t actually coded up using heading tags (eg h1, h2, h3 and so on). You need to edit your content so that each of those headings are real headings. This can easily be done by selecting the desired heading number in the style drop down in the rich text editor. If you don’t see it, you’ll need to click the kitchen sink button which will give you another row of buttons to play with.
Hello, I was using your TOC, it was brilliant. For some reasons I haven’t been to my site for 2 weeks and when I returned today, the TOC doesn’t work anymore. It’s in the code [toc].
Even when I view html of my site, there is:
But the TOC itself isn’t in the post anywhere.
I swear I didn’t do anything in the past 2-3 weeks with my blog. It just.. happened.
Today I tried the now release update but for no avail.
Any ideas?
For example it should be on this page: http://www.noirgoku.mablog.eu/pp-09-prutove-soustavy/
The setting page: http://songokussj4.abonas.com/screeny/2013-04-02_132623.png
Did you update your theme? Did you install or update any plugins?
Can you try auto insertion? Eg ticking either (or both) page and post and remove the shortcode to see if that worked?
Hi, thanks for the reply.
I’m affraid it didn’t work. I checked the page/post boxes, deleted [toc] in my post and nothing.
As I said. It worked flawlessly and 3 weeks after that (I haven’t visited my site for 3 weeks), nothing. It just isn’t displaying anymore.
I didn’t change a thing.
Maybe my web-host provider did something that could caused this?
HI Mike,
Despite being a total newbie, I have a post sitemap working on my sandbox page, so that is awesome.
But, I have changed the appearance to a white background, and yet the sitemap still has a grey background.
And then, two dreams:
1) I would love the ‘the’ to be dealt with, so “The Bacon Life” becomes “Bacon Life, The” or maybe even “Bacon Life”. Any thoughts?
2) I would love this to be in two or three columns instead of one wide one. Is that doable?
Thank you for this.
Ruben.
Hi Ruben – I have a feeling you’re referring to sitemap_posts and if so, then the presentation options do not apply here as it’s for the table of contents (eg the index found at the top of this page). Anything sitemap_* will always use your theme styles. If you can provide a link, I can confirm which it is.
1) Nice suggestion! This should be doable for sitemap_posts but I’ll need to invent a new orderby option as it currently uses the WordPress API selections. Also this would only be useful to English sites.
2) If you’re talking about the table of contents then not without modifying PHP. A few people have suggested it earlier. If you’re talking sitemap_posts then you could as each letter section is enclosed in their own div so some CSS could split them in thirds.
HI, thanks for the plugin, very bnice.
But have a problem: The TOC is directly shown as my excerpt, for example in the featured image … when I switch off the plugin, I get the first sentences again… I want the toc not to be on top of the post, but a paragraph down, so my seo is untouched also…but even if I manually add [toc] a paragraph down it shows at the right (lower) place, but immediately tales over the excerpt
What can I do?
Thx
Dan
nevermind 🙂
think putting it on automatic and one paragraph down seems to have solved the issue
though when I used [toc] one paragraph downit still showed up in the excerpt
Thx
Pingback: Table of Contents Plus 1303.1 released | dublue
Pingback: Table of Contents Plus 1303 released | dublue
Dear Mike,
First of all, thank you for the plugin! I have a styling question though. When I create the TOC for my pages, I get the following result:
http://www.gem-rg.com/projects/competitive-fund-projects/
Surely the theme’s style overrides the TOC’s style, but how can I manage it to be a numbered list instead of a bulleted list? It really looks weird right now…
Thanks for your help!
Have you fixed it already as I see numbers and no bullets… I used Firefox and Chrome.
I’ve managed to set this up somehow, but I’m not sure if it’s the right way. I have a “Custom CSS” field for in my theme’s options which practically creates an internal stylesheet, so it’s successfully overrides both the theme’s default CSS and the plugin’s screen.css.
I’ve put this in “Custom CSS”
#toc_container ul li {
list-style-image: none;
}
Hope this helps somebody!
hello,Thangk you for you plugin which is perfect .
I use toc in my wordpress. My blog is Chinese , I want to custom the anchor . if use efg, the plugin won’t generate #abc while will generate #efg. so how could I use the custom the anchor #abc ? Thanks.
Hmm, it can’t as it automatically creates the anchors based on your headings that are within your content.
I’m guessing you’re not seeing the heading as the anchor? My guess would be because your content is in non ASCII characters (which I’m certain most Chinese dialects are), then none of the characters will actually qualify as the anchors. See http://www.w3.org/TR/html4/struct/links.html#h-12.2.1
As an example, see http://zh.wikipedia.org/wiki/%E5%A4%96%E5%88%87%E9%AB%94%E8%A4%87%E5%90%88%E7%89%A9 and check the links within the TOC.
(1) First, I really, REALLY like the TOC+ Plugin!
(2) Next, an issue I noticed: When making a change to TOC+ (settings for TOC+), it resets the control for the TOC+ Sidebar Widget (unchecks it) for: Show the table of contents only in the sidebar (option). This is really inconvenient, as you have to go back into Widgets and remember to re-check it. (Logic should be where it checks for this setting and maintains it during a Settings Update save…)
(3) Another issue is: The difference of the final scroll -or- jump to anchor point displayed depending on whether you Check or Un-check the option for: Scroll rather than jump to the anchor link. If CHECKED, then it scrolls perfectly to show the Chapter Title (or section name) heading within view. If UN-CHECKED, then it jumps to the beginning of the content only and passes by (hiding) the Chapter Title (section name). (The tags).
That’s it for now. Keep up the great work on this Plugin!
1) thanks for the nice words.
2) Nice feedback! Will address it.
3) This is due to the WordPress admin bar and only appears to logged in users that haven’t disabled it. Normal visitors to your site won’t be getting that bar so the bar won’t appear under it. You could move the admin bar elsewhere (eg bottom) easily enough with a plugin or some custom CSS but there’s nothing else really that you can do.
Hi there
have you by any chance considered making a home for this plugin on github? I’ve already git svn cloned the existing history, which I could you send you that so you could upload it from your own account. There’s a couple of patches I have that I think are probably useful for the plugin, blog comments probably aren’t the most sensible way to discuss them, or wdyt?
I’m old school and still use Trac with SVN on my personal dev server where it has tickets/tags/milestones, etc. Moving to git now would mean some investment to learning the git way, and to verify that all prior commits, tickets, milestones, tags, etc aren’t lost.
I agree that a blog isn’t the most efficient way to support plugins but it presents zero barriers for engagement for users of any background. I thought about putting a forum somewhere but that’s old tech too.
For now I’m happy for you to send diffs through (michael @ this domain).
Hey,
Is it possible to allow inclusion of _posts_ in the sitemap generated (I’d like to display it as a navigation on pages, including post titles from child categories) and if yes, what do I need to change?:) What would be really cool if you expanded on the plugin when you have time, making it possible to include not only pages and categories, but also posts with thumbnails and excerpts. A cool looking tree-like sitemap would be awesome for a variety of implementations!
Yeah it sitemaps doesn’t include posts as you can imagine with the name of this plugin, it focuses more on the table of contents side of things. Nice suggestion and not too tough to implement.
Could it be possible to make a table of content without index-NUMBERS? in many cases there is no need for any numerology, but the different headings stand good by themselves.
Yes, turn off ‘number list items’ in settings > toc+
thank you for the plugin – it’s exactly what I’ve been looking for! Everything works great, except that there are bullets AND numers in the table of contents. But I don’t want to have any bullets there…
When I go to the plugin editor and chose the screen.css it looks like this:
” table-of-contents-plus/screen.css (inaktiv)” the same with the admin.css.
According to firebug the settings of the my theme- style.css file are used for the -Tag and the list-items. So ‘Table of Contens’ seems to use not its own settings, but the settings I use for the rest of my site.
Have you any idea what could be wrong here?
Thanks!
Nothing wrong with how it operates. Your theme’s style is simply taking precedence. Does it have !important in the CSS lines? If it does, try removing it. What’s the selector that Firebug is showing.
hi,
very nice plugin but i have a problem…i think it comes from css file of my woothemes but impossible to be sure.
i have the same effect as html anchors.
for that moment i deactivated toc to be sure not to pertubs my followers.
If i click on a link inside the toc menu, i reach the good part of the text but something wrong happens:
the link is modified as http://www.mywebsite.com/page/#menu3 and all text from this article before menu3 disappears..
any idea about that ?
tks a lot for your help
Wow, I’ve never heard that happen before… It’s probably a compatibility problem with another plugin or maybe even the theme itself. I don’t have a wootheme so I can’t confirm.
I just found this Plugin that I’m looking for long time.
It works great, but the table doesn’t show up on some page.
there are my shortcode like “[showonepost id=123]”.
if I put this shortcode, the table of contents doesn’t appear.
I guess this shortcode recognized as [no_toc] by this plugin.
please tell me some solution. 🙂
It’s doubtful that your shortcode is triggering the no_toc switch. At the end of your shortcode function, are you returning the content? Are you exiting or dieing in the function? All shortcodes should return content. If you exit or die, it may stop other queued up shortcodes.
http://codex.wordpress.org/Shortcode_API
Is there anyway to set a user defined height for the toc in addition to width? I’m hoping this would create a multiple column like view v. a long list that takes over all above the fold space.
Specifying a height probably won’t give you the effect you’re after. The closest you may get is by using CSS3’s columns but it doesn’t have wide browser support.
http://www.w3schools.com/css3/css3_multiple_columns.asp
Ahh that’s what you meant. Then yes you can create manual table of contents for any web page creating your anchors, then linking to them. See ‘the id attribute’ from http://www.w3schools.com/html/html_links.asp It’s manual, tedius and you have to remember to update it when you make changes to the structure of your content.
For what you’ve done already, if you’re not using the smooth scrolling capability then you don’t need to load any JS or CSS file. It’ll continue to link to the anchors within your content fine.
Is there an easy way to add it to non-WP HTML page?
Nope – it’s a WordPress plugin and won’t work without it.
Actually, I’ve managed to place it on a page on my non-WP site simply by copying CSS/JS and the HTML div with ToC from a WP site. Then I modified the links manually. Now it seems to be working perfectly but I am wondering if I really need all that JS and CSS or is it safe to remove parts of it? Since I use only one color scheme and do not need to control any of the plugin settings.
A fantastic plugin and thank you! One suggestion. I’m particularly frustrated by the wrapping point. To me, the best place would be to place it either (a) after the “more” tag commonly used, especially if not using excerpts for your article, or (b) after the first header tag used in the article which will frequently come after that opening paragraph or two. The reason for this is simple. You can left/right align the TOC *after* the first header and header will extend naturally across the article content area with the subsequent text wrapping nicely around the TOC. But if you place the TOC before the first header as designed, you are guaranteed to have a header that will almost certainly stretch the length of your article content area be wrapped to the next line(s), presenting not the most pleasing appearance.
Nice feedback. I’ll add an option for it to be outputted after the first heading.
Great plugin! it works perfectly on pages, but I can’t force it to work on posts. Option is turned on, but it is not shown even with shortcode. Please help! thanks
Have you used the TOC+ widget? If so did you click that one checkbox to limit display to the widget?
Have you tried viewing the individual post? By default, the indexes do not appear on the homepage. Also, they never appear on archived, listings, or search pages.
Have you placed a URL path restriction (under advanced options)?
Is it a custom theme? If so, make sure you are using the_content to output the content for posts.
I’ve discovered that this plugin’s front.js file creates a clash with one of my other scripts. I know which script it is clashing with, but don’t know jQuery well enough to figure out how to stop the clash (if possible). Any ideas of potential solutions? I’ve tried smooth scrolling both on and off.
Is the other script available from another plugin that I can use or is it your own custom one? Do you have a link I can use to have a quick squiz?
Here’s the script that it is clashing with. It is in my theme and runs a scroller.
http://theturtleroom.com/wp-content/themes/spicy1-9/js/scrollable.min.js
I included the script on my dev and can see it in the HTML source but I’m not sure what I need to do to get it to conflict. Have you got a page with the problem?
Yeah, my homepage actually has the problem. As long as your script loads in the head, it doesn’t matter if the TOC appears or not, the scroller doesn’t work. The only thing I could do to get teh scroller to work again was deactivate TOC+. You’ll notice the scroller is partway down the page below the text “Breeding Projects”.
http://theturtleroom.com
Ok thanks, I’ve got the HTML and can see what you mean. I’ll see if I can look into it further. At first glance I can’t see any JS collisions. My thoughts are the clicks on the back and next arrows aren’t flowing through to your script, probably due to something in front.js.
It looks like there is a collision with ‘scroller’ or ‘smoothscroll’ as when I take out that whole definition at the top of front.js, the scrollable area works from the homepage. However, instead of doing this and because you have full access to the theme, I’d suggest to move spicy1-9/js/scrollable.min.js file below where you have wp_head() so that it loads after front.js and takes precedence. You could also load that file in the footer to achieve the same result. This probably also means that you won’t be able to get the smooth scrolling feature provided with TOC+ which is disabled by default anyway.
For information, I’m using https://github.com/kswedberg/jquery-smooth-scroll to provide smooth scrolling.
Thanks. I haven’t been planning on using smooth scrolling anyway!
I’m missing this feature, too. Looking for a kind of “List of posts from A to Z”, displaying all the post titles in alphabetical order for quick finding.
Hey Mike,
Love the plugin it works flawlessly, 1 feature request though. Is it possible to have a class attached to a heading that will be ignored, so i can omit certain heading tags from the table of contents? something like toc-ignore, which would be omitted?
Let me know if this is something that can be included!
Thank you
Nope not yet but it’s something that has been requested and should be coming.
http://dublue.com/plugins/toc/comment-page-4/#comment-1749
Plugin seems to work on WP 3.5 🙂
Feature Suggestion: option to display contents of all pages of a multipage post
thx
Hi Mike,
On this website (this is a page with a table of contents) –> http://fr.yoga-laurence-lhermitte.be/les-cours/cours-collectifs/
I’d like the font-size of the TOC list to be smaller than my default font-size (which is 14 px). In the plugin settings/Appearance/font size, I’ve tried 11 pt, then I tried % but nothing works. The list in my TOC is still 14 px.
Can you help ?
Thanks in advance,
Fran
It looks like one of the CSS rules from the theme is taking precendence over the TOC customisation. I’ll do a little more work from the TOC plugin to see if it can override existing theme specs.
Thanks Mike.
Regarding the Widget…I’ve installed the plug-in and placed the widget in one of my custom sidebars. However, the TOC is not appearing on any of the pages that use that sidebar. Any suggestions?
If you’ve used custom loops (extra wp_query calls and the like), you need to make sure you reset them using wp_reset_query at the end to restore the state. Likewise, if you’ve changed get or post variables, you’ll need to reset them too (wp_reset_postdata). This is important because when the widget runs, it needs to pull in the current post/page ID to obtain the content and if that ID has changed – it no longer makes sense for the current page.
First check is to see if the current content is appropriate for the page you’re on when the widget runs, edit toc.php and at line 1493 add:
var_dump($post->post_content);
Reload the page in your browser and see if the debugging output contains the correct content for the page. If it does, then it’s something else and more troubleshooting is required. I would then see if the widget works with another theme to isolate an issue with the current theme you’re using.
Content loads correctly (I thought it would since it works as a shortcode in the post). I’ll have to test another theme with it tomorrow.
Mike,
This looks a great plugin! I’m currently building a site that will have multiple authors. So I have two lines of headers that I’d like excluded from the ToC, namely the title and the author’s name.
ToC+ currently automatically excludes the first header (i.e. the title). Is there an adjustment I can make so that it will exclude the second header (i.e. the author’s name)?
Thanks very much!
Tim
Currently, you can exclude certain heading levels from the TOC in your advanced options (or if using the shortcode, then using heading_levels – see the help tab). As an example, if you hide all h2 headings, you can then mark up the author’s name as a heading 2 and it will not be displayed in the TOC.
There isn’t a current way that allows you to define a text match for exclusion, eg I want to hide headings that contain AAA, BBB or CCC. It does sound useful so don’t be surprised if it finds its way in…
Thanks, Mike. I’m aware of that option, but it won’t work here because the author’s name is one type of h2 and subsections are another type of h2 (and I don’t want to exclude the latter).
That’s why I was hoping that I could simply exclude the first two headings instead of (as currently) just the first one. But I’d certainly be happy if you created an option to hide headings that’s even more powerful than I was asking for!
Thanks again,
Tim
Mike, I’ve now hacked your code in two places to get it to do what I want. I thought anyone else who wants to achieve the same results might be interested.
In order to make the ToC automatically appear after the author’s name, without having to insert the [toc] shortcode manually each time, I went into table-of-contents-plus/toc.php and changed the line after “case TOC_POSITION_BEFORE_FIRST_HEADING: default” to read: “$replace[1] = $html . $replace[1];” (without the quotes)
Then, to hide the author’s name and bio details appearing in the ToC itself, I added the following to your screen.css: “#toc_container li:only-child{display:none;}” (again, without the quotes).
Tim
Hi Mike,
thanks for your reply. I ended up using wp_page_menu() which is similar to wp_list_pages() you suggested (haven’t found the big difference yet…), and some CSS styling.
Still, some sort of easy submenu “selector” would be nice, no? I understand that there is no WP built-in function to just select one page tree, but only to exclude trees. Wonder why nobody ever had that idea before.
Anyway, thanks again for your help that hinted me in the right direction, and have a great new year!
Cheers from Italy
M
I believe this is already possible out of the box. WordPress adds structural classes to elements within output of page listings. This allows you to show or hide nonrelevant parts using basic CSS. I use this for showing children and grandchildren links for the current page while hiding cousins. The benefit of this is that it is context specific and will adapt depending to the page you’re on without modification.
See http://codex.wordpress.org/Function_Reference/wp_list_pages#Markup_and_styling_of_page_items for a list of the classes.
I installed your plugin on a wordpress blog that uses the Thesis 1.85 theme. I want to change the presentation of my table of contents. I have tried switching to one of the fixed options presented and I have tried a customized option. After making these changes I hit the “update” button, then visit and refresh my site. Nothing changes. Do you know why?
Got a working link I can look at? The one you provided gives me a login prompt.
My feeling is that the theme is overriding the CSS provided by this plugin.
Is there a way to build a TOC based on POST Titles across my entire site? I am trying to make sense and organize the hundred plus posts so that they can be found in ways other than searching.
You could leverage tags or categories and then output a listing to the desired appearance. If you can make theme related changes, it doesn’t need to look like a traditional archived page.
Hey Mike,
Fantastic plug-in! I’m using it for my co-op housing manual pages and policies. I have 2 questions.
1. the manual will end up being printed. I was going to add page breaks in the HTML like what you’d do to format for a kindle . I’m wonder if a potential feature to add page numbers could be added to support page breaks.
example: 5.1 Conditions of Possession …………………………..2
2. Perhaps this isn’t possible but I’d like to link from one page to another. For example a policy would link to “5.1 Conditions of Possession” from a separate page. Can I do this?
https://falsecreekco-op.com/wordpress/?page_id=10
Thanks in advance!
Hi R
1. My gut feeling is not consistently possible as the web (html) version is meant for screen where the content flow is more fluid rather than print (fixed). I’m not sure of a way to format to a consistent print medium, factoring in the various paper sizes too. You may be best providing a link to a compiled PDF with built in table of contents. At least you won’t need to reformat the content as it would be marked up well with proper heading tags.
2. Nope sorry, the index provides in page links, so it isn’t suitable for a “book with multiple pages”. That said, I’m still working on providing support for <!–nextpage–> so you could break the content over many pages later.
Hi Mike,
first, thanks for the plugin, and your restless support to all its users. Your enthusiasm is truly admirable!
I have a feature request that has already been mentioned in other posts – or ask your for a work-around (I am sure there is, but I’m more of an interested novice to PHP rather than a techie):
Would it be possible to create a “sitemap” for a specific tree only that can be shown on any page of that tree (parent, child or grandchild page)?
And since I am already making a wish list so close to X-mas…: possibly also to show where you stand within the tree (highlighting current page item or so)
In other words, something similar of what http://wordpress.org/extend/plugins/subpage-listing/ is proposing, but in your very stylish way?
As I understand it, you actually DO offer the possibility, just the other way around, i.e. creating a sitemap for a tree by excluding all other pages on the site. That is of course a possibility, but surely not the best way to go forward.
Thanks for any answer – or even suggestion for a easy workaround!
Cheers
M
Hi Milanouser – it seems like you’re trying to create a section navigation (ie secondary navigation) that is context specific to where you are within the site’s structure. I wouldn’t use the sitemap function of this plugin to do this as it’s intended to provide an overall view of the your site.
However, I come across your need with many of the sites I produce and have always used wp_list_pages and then CSS to style it to fit the theme. Check out the list sub pages section for some sample code.
The subpage listing plugin appear to do a similar job, so all you may need is some CSS to make it appear the way you want.
Hello, Mr. Tran: Lovely plugin! Thank you. We need to have a site map with PAGES and POSTS only. I see how to create one with pages and categories, but there is nothing for posts. We need to have a complete listing of all posts’ titles on the sitemap. Can you help, please?
Thank you,
William
Unfortunately, you can’t list posts with this plugin.
If you can edit your theme, query_posts will do what you want
http://codex.wordpress.org/Function_Reference/query_posts
I’m trying to use this plug-in for a post of mine. But for some reason, the links are not working. Here’s what I did:
Included [toc] in the content. Gave tags to the sub-headings. When I click on the URL, it is taking me to the homepage of the site with URL –
http://xyz.com/#introduction
http://xyz.com/#subheading1
Can you please help me with it?
Regards,
Syed Naimath
Did you do use WP_Query or query_posts anywhere? If so, make sure you reset the loop with
wp_reset_query
Which SEO plugin are you using, if any?
Does it only happen on the one page or all of them? Try using the TOC+ widget, is it the same?
Why minimum number of Heading has to be 2 before TOC displays? I have posts with only Heading 1, and no other headings – can the TOC work in such posts?
The minimum used to be 4 (similar to Wikipedia) but eventually went to 2 as more people were requesting it. I can’t see why a TOC with only one entry would be useful if that is the only meaningful heading on the page – why would that warrant a TOC?
If you’re dead keen on adding it, follow the instructions at http://dublue.com/plugins/toc/comment-page-2/#comment-791
any way this plug can create single TOC across a few posts? I have a long book that will go unto a few posts – but it is one single book, and wanted TOC across all posts. Your plug can create separate TOC for each post, but I am looking for a single TOC that will ‘read’ a few posts. Let me know?
Nope it can’t as WordPress doesn’t feed it content for multiple pages when the_content is run.
URGENT
Hi there. First of all thank you for the stunning yet so simple plug in.
I have installed it ( WP 3.5 ) and worked well.
I needed a dictionnary and used ” Explanatory Dictionary “.
The problem:
When there’s a word in a heading that corresponds to a definition set in the dictionnary, your TOC does add the complete definition right to the given word in the TOC itself.
Please, can you try looking for a solution rapidly or should I try other toc plug-ins instead ?
Thank you one more time and for having given me that little time.
Hv a good day. Samuel
Explanatory Dictionary is running before TOC+ and inserting the definitions for words wheever they occur. If there are terms in headings, then the definition will be inserted as ‘hidden text’ within the heading. So once TOC+ runs, it doesn’t know it’s hidden so it includes all text within the heading. Btw, it’s hidden via CSS.
The simple fix is to tell explanatory dictionary to run after TOC+. Edit explanatory-dictionary.php and change line 480 with:
add_filter('the_content', 'add_explanatory_dictionary_words', 101);
Great plugin!
Hi Mike,
I used the built in functionality from the woothemes framework. Here is a functioning codepen using the js/css and html. http://codepen.io/shackep/pen/tlufK On our site that is under development you can see it at http://mainsite.arbor.edu/admissions/adult-and-professional/
Your TOC is really great for making what the page covers obvious. It pairs nicely with the http://wordpress.org/extend/plugins/sb-child-list/ widget that shows sibling and children pages to the page you are on, since we have a strict IA.
Peter
Edit front.js (unfortnately, it’s minified now so it’s hard to edit) and search for
if(target){$.smoothScroll({scrollTarget:target,offset:offset});}
Try changing with
if(target){$.smoothScroll({scrollTarget:target,offset:offset});$(target).closest('h4.toggle-trigger a').trigger('click');}
Not sure if it’ll work but it should be close. It might need to be slightly different:
$(target).closest('h4.toggle-trigger').find('a').trigger('click');}
If this works, you’ll need to reapply the change everytime you update TOC+. The alternative method may be to use something like scrollspy to trigger the click event when the target changes. This would be the better solution as you won’t be changing TOC+ files but it’ll be more effort.
Thanks Mike,
Thanks for your help.
I was able to hack together something that almost works. I tired a dozen iterations of the above code but it did not work. A coworker suggested that I add ids to both the toggle and the TOC list.
For anyone else who is looking to do something similar:
To toc.php I added: `id=”TOC-‘ . sanitize_title( strip_tags($matches[$i][0])) . ‘” to ` `$html .= ‘url_anchor_target( $matches[$i][0] ) . ‘” >’;`
I duplicated the theme toggle function from (admin-shortcodes.php) into my function.php folder where I could override it.
I changed $main_trigger to this:`’‘ . $title . ‘‘ . “n”;`
Then using the below bits in front.php was able to get a working toggle.
`elementID = $(this).attr(‘id’);
elementID = elementID.replace(‘TOC’,’Toggle’);
var elementID = document.getElementById(elementID);`
`if(target){$(elementID).trigger(‘click’);$.smoothScroll({scrollTarget:target,offset:offset});`
I will continue working on it. As it stands if the ID content don’t match neither will the toggle and scroll.
Again, great plugin Mike.
I am building a site using woothemes canvas theme. I have an issue where I have some content inside of content toggles that are created via short code. The header of the content within the toggle is an H2, so it shows up in the TOC. So far so good.
When clicking on the TOC link we get no action since TOC is not aware of the need for the toggle to be triggered.
I know this issue that I am facing is unique and am sure that it is beyond the scope of your generous plugin support. I am just puzzling out what approach I would take to make this work. My guess would be to look at the js that runs the toggle and the js that handles the TOC and see if I can make TOC aware of toggles. If you are interested in taking this on as freelance work let me know. In the meantime I will keep hacking away at it.
Peter
Are you able to provide a link for me to take a quick look? It will definitely be in the javascript.
Did you use another plugin to provide the toggle function?
Hi,
I really like your TOC Plus and I would like to keep it on my site but I found a bad side effect on my “Accordion” function. As you can see there : http://www.agiliste.fr/a-propos/ when you click on any Accordion’s item, you can see a bad scrolling movement. When I desactivate the TOC Plus extension, there is no problem.
Any solution?
Regards
Florent
I had a look at your site but it looks fine to me in Firefox… I was going to suggest for you to turn off smooth scroll and it looks like you’ve already done this.
Yes it seems to work. I don’t know what I did. Perhaps, the upgrade of TOC Plus. I also cleaned my cache, activated and desactivated all plugins. I met the problem with chrome but there is no more problem.
Thank you 😉
Hi Mike,
Excellent plugin. I was just wondering is there a short way of showing only a certain custom post type in the sitemap shortcode?
Nope sorry, the sitemap only does pages and categories.
I’m a very picky individual with some OCD tendencies. I love your plugin but can’t stand the formatting of the anchor links. Instead of #Blah_Blah_Blah I want the anchor links to be #blah-blah-blah. See, told you I’m picky. Anyways adding a filter to the url_anchor_target() function would be superb!
return $return;
would become
return apply_filters(‘toc_url_anchor_target’, $return, $title);
This would pass the $return value you figured out and the original $title. That’s it. Cheers!
Nice idea, you’re the second to prefer lowercase and hyphens. See Jan’s comments. This sounds like a way to maintain TOC upgrades without having to redo any customisations.
Also, you have the ability to exclude pages/categories… how about a way to include specific pages or categories, and when that is used nothing else shows up except what was included.
I checked this out because I wanted to be able to make a TOC for the pages in my post. I use the feature to separate the pages. It would be nice to be able to generate a TOC based on that, or even a manual TOC based on an argument that accepts text and links.
Getting this to work with nextpage is a highly requested feature. I had it working OK for flat lists but stumbled with all the heirarchical stuff so had to pull out for now.
Hi Mike
Is there anyway to put TOC+ code directly into a template file? I’ve tried with but it didn’t do the trick.
Thanks up front!
/Jan
@ Jan, you can’t call TOC+ code directly because it needs to run when the_content happens for the following two things:
1. it creates the index at the top
2. adds the anchors next to the headings throughout the content
If you only did #1, then they wouldn’t link to anything.
That said, you could do either of the following in your theme:
apply_filter('the_content', 'all my custom html text goes in here...');
Add your custom function to run when the_content is called, see
http://dublue.com/plugins/toc/comment-page-3/#comment-4287
Or just use
the_content()
if you’re within the content.Pingback: Table of Contents Plus 1211 released | dublue
Hello,
cool Tool! 😉
But… 😉
I wish to load the Page with a closed TOC (with the show – tag) ..
Is it possible..?
Bye
It’s been a requested feature so who knows what will come in the next version… no really, I haven’t decided if it has been in scoped yet…
Well guess what’s coming in the next version… 🙂