WP Anchor Header

Description

WP Anchor Header generates anchored headings (H1-H6), creating a heading like this:

<h2 id="the-heading">
   The Heading<a class="anchorlink dashicons-before" href="#the-heading"></a>
</h2>

The links are styled using the following CSS:

/* show IDs for anchors */
h1[id]:hover a.anchorlink:before,
h2[id]:hover a.anchorlink:before,
h3[id]:hover a.anchorlink:before,
h4[id]:hover a.anchorlink:before,
h5[id]:hover a.anchorlink:before,
h6[id]:hover a.anchorlink:before {
    content: "\f103"; /*dashicons-admin-links*/
    color: #888;
    font-size: smaller;
    text-decoration: none;
    vertical-align: baseline;
}
a.anchorlink {
    text-decoration: none;
    margin-left: 0.5em;
    font-size: smaller;
}

Credits

The plugin is inspired by Christian Weiske and his article Usability: Clickable heading links.

Installation

  1. Download the plugin and extract the read-online.zip
  2. Upload the extracted read-online folder to the /wp-content/plugins/ directory
  3. Activate the plugin through the ‘Plugins’ menu in WordPress

Reviews

Awesome plugin! Great time saver! A few suggestions.

This plugin saved me a significant amount of time adding anchor links throughout an existing website. It worked exactly as expected.

My only suggestion would be a settings panel in the admin where users can specify exactly which header elements get anchor links automatically associated with them. So for example, I can go in and select “apply anchor links to <H4> only.”

The ability to have a setting to turn on/off the hover link icon would be very helpful too. I had to manually edit the CSS to hide these icons on everything but H4’s in my entry content.

Very useful

Finally, I found this plugin.
This plugin is what I need for my site to create Heading ID as an anchor link.

Extremely useful and simple

To tell the truth I had no hope searching for a plugin that would add links to headers.

And I was so surprised when this plugin did exactly what I wanted.

Thank you, Per Soderlind, for this plugin!

P.S.: Sorry for my English, I am Russian.

Read all 6 reviews

Contributors & Developers

“WP Anchor Header” is open source software. The following people have contributed to this plugin.

Contributors

Translate “WP Anchor Header” into your language.

Interested in development?

Browse the code, check out the SVN repository, or subscribe to the development log by RSS.

Changelog

0.2.3

  • Tested & found compatible with WP 4.7.

0.2.2

  • Tested & found compatible with WP 4.6.

0.2.1

  • Fix: Don’t run if the_content is empty

0.2.0

0.1.8

  • Fixed UTF-8 parsing bug, added mb_convert_encoding to loadHTML(): @$doc->loadHTML( mb_convert_encoding($content, 'HTML-ENTITIES', 'UTF-8') );
  • Added singleton
  • Added comments to code

0.1.5

  • Initial release