To TinyMCE Or Not To TinyMCE

Some time ago, Mark expressed a wish for sliding notes editor support in form of a button in the visual editor toolbar.

That is, we’re talking about extending TinyMCE here.

Now, I’ve never done that, and I suspect it’d be quite some extra work, but unexplored territories and a rough terrain have never stopped me from trying things out. On the other hand, I naturally ask myself if all that will be worth the effort. Why?

Read more >>

A New Plugin Is Born: TOC Boxes

Just (a really) short note:

Most of my spare time this year 😉 I’ve been a busy bee working on WordPress plug-ins. Besides making advances towards the next Sliding Notes milestone, I’ve implemented a new plug-in: Table Of Content Boxes. It’s ajaxish, freely positionable, good looking… 😉

Check it out on the plug-in homepage,1 and have fun with it.

1. I’ve closed comments on this post in favor to the plug-in homepage. [↩]

WordPress SEO Table Of Contents

This is the home of the WordPress SEO Table Of Contents plugin: A freely positionable, AJAX-ishly collapsible, CSS styleable, fancy table of contents box for WordPress posts and pages.

[toc style=”margin: 1em 12em”]

WordPress SEO Table Of Contents Features

• Automatic recognition of headings up to any level.12
• Table of contents wrapped in an aesthetically shaped box.
• Dynamically collapsible to an unobtrusive size, to maximize space for content. (Click on the table of contents box header to see it.)
• Freely positionable through a WordPress shortcode. (Where the shortcode is, there the table of contents box will appear.) Great if you want an intro chapter to be displayed before the table of contents.
• Freely styleable via CSS classes and inline styles, all supplied via shortcode arguments.
• Multiple table of contents boxes embeddable, through multiple shortcodes in the post. Useful for long posts.
• As of version 1.1: Handling of hyperlinks in headings.
• As of version 1.2: Support for multi-page posts.
• As of version 1.5: Table of contents auto-insertion
• As of version 1.5: Free choice of table of contents box title
• As of version 1.5: Default values can be specified via settings for all shortcode parameters

See more live examples on the WordPress SEO Table Of Contents demo page.

Recent WordPress SEO Table Of Contents Releases

Please check out the post related to the WordPress SEO Table Of Contents version you are using or are interested in. It contains important information specific to the individual release.

WordPress SEO Table Of Contents Installation

1. Download WordPress SEO Table of Contents.
2. Extract the plug-in archive to your wp-plugins directory.
3. Activate the plug-in as usual.
4. Copy the CSS template fragment from below to your CSS file (either your theme’s style.css file, or, which I’d recommend, through the MyCSS plug-in), and adjust it to your liking. (It’s a live extract from my own my.css file.)

div.toc {
	border: 1px solid #ccc;
	font-size: .75em;
}
div.toc.toc-left {
	max-width: 22em;
	float: left;
	margin: 5px 5px 5px 0;
}
div.toc.toc-right {
	max-width: 22em;
	float: right;
	margin: 5px 0 5px 5px;
}

div.toc a.toc-header {
	display: block;
	background-color: #f8f8ec;
	border-top: 1px solid #fcfcfc;
	border-left: 1px solid #fcfcfc;
	border-bottom: 1px solid #f0f0e0;
	border-right: 1px solid #f0f0e0;
	color: #777;
/** Styling regarding TOC title: **/
	padding: 1px 2px;
	text-align: left;
	font-size: 1.25em;
	font-weight: bold;
}

div.toc a.toc-header:hover {
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	border-bottom: 1px solid #fcfcfc;
	border-right: 1px solid #fcfcfc;
}
div.toc ul {
	list-style: none;

	margin: 0;
	padding: 5px;
	background-color: #fcfcfc;
	overflow: hidden;
	white-space: nowrap;
}
div.toc.auto-collapse ul {
	display: none;
}

div.toc li a {
	text-decoration: none;
	border: 0 none;
	color: #777;
}
div.toc li.toc-level-1 {
	font-weight: bold;
}
div.toc li.toc-level-2 {
	font-weight: bold;
	padding-left: .25em;
}
div.toc li.toc-level-3 {
	padding-left: .5em;
}
div.toc li.toc-level-4 {
	padding-left: .75em;
}

WordPress SEO Table Of Contents Usage

The WordPress SEO Table of Contents plug-in automatically recognizes the headings3 in your post, so there’s no need to specifically mark up the table of contents entries.

To position the table of contents box on the page, place the toc shortcode where you want the box to appear. Use the class or style shortcode parameter to make the table of contents box float to the left or right (it’s similar to positioning an image). Use the hint parameter to specify the text shown when the mouse hovers over the table of contents box header.

Example:
[toc_usage]

Note: A WordPress table of contents is never shown on the blog front page, only in single posts and pages. And of course: No headings – no table of contents. (That is, the table of contents shortcode will be ignored if there are no headings in the post.)

Parameters

All parameters except auto have default values supplied via plugin settings from the dashboard. (Note: In the dashboard page, don’t use quotes around the values.)

Predefined CSS classes

toc

The main CSS class of a WordPress SEO Table of Contents box. Most CSS styling is bound to this class.

toc-left, toc-right

table of contents box styling for floating alignments. These are in addition to the above class. For example, to make the table of contents box float to the right, pass the shortcode parameter class=toc-right.

WordPress SEO Table Of Contents Tips And Tricks

RaftaMan reported that some themes (like iNove) contain CSS padding definitions in a way that interferes with the table of contents CSS styling. A workaround is to redefine padding-left in the table of contents CSS for all levels. There is an example is in his comment.

Other advice:

• Placing a TOC In The Sidebar Revisited - First Aid For Naughty Themes
• Table Of Contents In The Sidebar
• How To Couple a TOC Box to an Image
• How To Auto-Collapse TOC Boxes

The Story Behind WordPress SEO Table Of Contents

I wanted a WordPress table of contents box similar to the one in MediaWiki, but to my surprize there seemed to be no WordPress plug-in for that.4 Besides, as I tend to prefer a short intro to precede the table of contents, I wanted one that’s freely positionable in the post, and “traditional” table of contents solutions seemed to have implicit positioning at the top only.

So there I was, engineering yet another WordPress plug-in of own, of which I hope it would be to the benefit and liking of a wider audience, too.

If you use this plug-in, please consider making a donation to support the further development. Donate whatever you feel appropriate. Any amount is appreciated.
Thank you.

Please note: technical support will be provided to donators only.

1. The maximum heading level to include is configurable. [↩]
2. Headings are formatted with “Heading x” from the drop-down box in “Kitchen Sink Toolbar” of the visual editor, or wrapped in <Hx>...<Hx/> tags in HTML mode (where x is a number denoting the heading level). [↩]
3. The maximum heading level to include is configurable. [↩]
4. At least, not one that does only that. Some series plug-ins include a sort of a table of contents, but I consider it overkill to install a series manager plug-in to get a table of contents, in particular when I don’t quite like the way it’s done. [↩]

Mindfulness And Boredom

Some time ago, I discovered yet another article praising the “single-tasking” mode of the human brain. Once more, an artificial parallel to programming is drawn, and the inherent losses of context switching in multithreaded software.

As if the human brain was anywhere close in function to a computer!

Usually, I’d just smile and move on to more funded writing, but this time I decided I’d make a statement or two on the topic.

Read more >>

The Noosphere And The Return Of Honor (My Closure Of The Year 2008)

It’s the last day of the year, and I chose not to write any technical, nor critical article. Instead, I’d like to turn my attention to a phenomenon that’s one of the greater, even if overlooked, achievements of the Internet.

Besides the zillion apparent ways the Internet has changed human life on this planet, there are also several less apparent ones. One is the concept of “honor” in Internet-based cooperation.

Read more >>

Adblock Plus Footer JavaScript Impedance

According to the Yahoo Extreme Web Performance Team, javascript loading should be moved to the END of the page to improve the perceived page loading speed. (And Vladimir Prelovac has provided us with a plug-in that does this.)

However, users of Firefox and the exceptionally powerful Adblock Plus extension, might encounter the opposite effect.

Read more >>

The Right Way To Shortcodize WordPress Widgets

A couple of days ago, I’ve been asked how to make Sliding Notes work in sidebar widgets. The general answer is, as with any shortcode: “Enable shortcodes in widgets”.

As it turns out, finding out how to do it right is not nearly as easy as it should be, due to some tricky interweavement with plug-in loading and execution order.

Read more >>

Sliding Notes 1.2.1 Released

After much struggle with an annoyingly pertinacious cross-browser issue, and a thorough rework at both conceptual and code level, here it is, at last:

Sliding Notes 1.2.1

Download it as as usual, and see the plug-in homepage for details.

Read more >>

In Memory Of Srinivasa Ramanujan

Yesterday would have been the 121st birthday of one of the brightest minds this planet has ever been a home to: Srinivasa Ramanujan.

Little known to a wider public, this guy, although born and raised in poverty, and with absolute no formal education, managed not only to reproduce by himself – in a self-tought fashion – much of the mathematical knowledge from antiquity to the 20th century, he also invented countless mathematical methods that are the foundation of many modern theories, not least Superstring Theory.

Read more >>

Sliding Notes Back On Air

I’m pleased to announce that my efforts to overcome the cross-browser issues have yielded a promissing new Sliding Notes version. I’m running it on this site alredy, and I’d be grateful for your feedback on how it works with different browsers.

Stay tuned while I’m running some more tests and prepare an official release.