Awesome Open Source
Awesome Open Source

Anchors for Craft CMS

This plugin makes it possible to automatically add linkable anchors to HTML headings in Craft.

The anchors are named based on the heading text. The algorithm Anchors uses to convert the heading text to IDs is similar to Crafts algorithm for automatically generating entry slugs.

Requirements

This plugin requires Craft CMS 4.0 or later.

Installation

You can install this plugin from the Plugin Store or with Composer.

From the Plugin Store

Go to the Plugin Store in your projects Control Panel and search for Anchors. Then click on the Install button in its modal window.

With Composer

Open your terminal and run the following commands:

# go to the project directory
cd /path/to/my-project.test

# tell Composer to load the plugin
composer require craftcms/anchors

# tell Craft to install the plugin
./craft install/plugin anchors

Templating

To use Anchors in your templates, just pass some HTML into the |anchors filter.

{{ entry.body|anchors }}

By default, the anchors filter will only search for <h1>, <h2>, and <h3> tags. You can customize which tags it searches for by passing in a comma-separated list of tag names.

{{ entry.body|anchors('h2,h3') }}

The anchors filter will convert any non-ASCII characters to ASCII, using the current sites languages ASCII character mappings by default.

If you are displaying content in a different language than the current site, use the language argument to override which ASCII character mappings should be used:

{{ entry.body|anchors(language=entry.site.language) }}

Configuration

To configure Anchors, create a new anchors.php file within the config/ folder, which returns an array.

The following config settings are supported:

  • anchorClass The class name that should be given to named anchors. (Default is null, meaning no class will be given.)
  • anchorLinkPosition The position that anchor links should have within headings, relative to the heading text ('before' or 'after'). (Default is 'after'.)
  • anchorLinkClass The class name that should be given to anchor links. (Default is 'anchor'.)
  • anchorLinkText The visible text that anchor links should have. (Default is '#''.)
  • anchorLinkTitleText The title/alt text that anchor links should have. If {heading} is included, it will be replaced with the heading text the link is associated with. (Default is 'Direct link to {heading}'.)

Plugin API

Other plugins can take advantage of Anchors using the provided API.

$parsedHtml = \craft\anchors\Plugin::getInstance()->parser->parseHtml($html);

Like the |anchors templating filter, parseHtml() also allows you to specify which HTML tags should get anchors.

$parsedHtml = \craft\anchors\Plugin::getInstance()->parser->parseHtml($html, 'h2,h3');

You can also pass some heading text directly into Anchors to get its generated anchor name:

$anchorName = \craft\anchors\Plugin::getInstance()->parser->generateAnchorName($headingText);
Alternatives To Anchors
Select To Compare


Alternative Project Comparisons
Related Awesome Lists
Top Programming Languages
Top Projects

Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
Php (284,724
Plugin (113,980
Cms (14,028
Yii2 (6,286
Ascii (4,147
Craft2 (2,676
Craftcms (2,676
Craft3 (2,676
Anchor (2,375
Craft Plugin (411
Anchor Links (8