WP Anchor Header
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.
Download & install the zip archive
The plugin package installer can be downloaded from the WP2E project tab called “code”.
1 – Select the version to download if this option is available otherwise the “latest” version of the main plugin will be used.
2 – After downloading the zip archive install the plugin package installer in you local environment and activate the script from the plugin list.
3 – Under the section “Plugins” of the admin dashboard you should see a new “Dependencies & Licenses” link. Follow the instructions from this panel to finalize the installation of the missing dependencies.
-
- Give a name to your project
-
- Download the Installer Package
-
- Install & activate the plugin locally
-
- Install the suggested dependencies
Tips: Use the WP2E panel to add/suggest new dependencies to the local installation. Press F5 in the list of dependencies if the changes are not displayed right away.