PHPackages                             smongey/writer-marks - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. smongey/writer-marks

ActiveKirby-plugin[Utility & Helpers](/categories/utility)

smongey/writer-marks
====================

The easiest way to add custom marks in Kirby 4/5 Writer fields

044JavaScript

Since Oct 13Pushed 7mo agoCompare

[ Source](https://github.com/smongey/writer-marks)[ Packagist](https://packagist.org/packages/smongey/writer-marks)[ RSS](/packages/smongey-writer-marks/feed)WikiDiscussions main Synced 1mo ago

READMEChangelogDependenciesVersions (1)Used By (0)

Writer Marks
============

[](#writer-marks)

> The easiest way to add custom marks in Kirby 4 Writer fields

Writer Marks lets you add custom marks to any `Writer` fields by simply adding a few options to your `config/config.php`.

Installation
------------

[](#installation)

Install via Composer:

```
composer require smongey/writer-marks
```

Or download and extract the plugin to your `site/plugins/writer-marks` directory.

Adding Marks
------------

[](#adding-marks)

```
return [
  "debug" => true,
  "smongey.writermarks" => [
    "marks" => [
      "highlight" => [
        "icon" => "sparkling",
        "label" => "Amazingly Highlighted Text",
        "tag" => "mark",
        "class" => "super-highlight",
        "style" => "text-decoration: underline",
        "attrs" => [
          "x-data" => "highlight()",
          "x-click.prevent" => "alert(message)",
        ],
      ],
    ],
  ],
]
```

### Tags and Attributes:

[](#tags-and-attributes)

The above code will add a "highlight" mark to the text that is rendered inside of a ``-tag in both, the writer field and the actual frontend-code of the page. The tag will feature all attributes added to the `attrs` array in both writer field and the actual rendered frontend.

### Styling

[](#styling)

The `style` argument allows you to pass inline css to the mark that will be rendered **in the writer field only**. Frontend styling should be done via the actual classes. (Note: *Technically* you *could* add the `style` argument as another value on `attrs` to get it to show up in the frontend but that's generally not a smart idea).

### Label and Icon

[](#label-and-icon)

The `label` and `icon` arguments set the label and icon for the button in the writer field. They do not show up in the rendered frontend. The icon can be any named icon from [Kirby's own iconset](https://getkirby.com/docs/reference/panel/icons)

Using Marks
-----------

[](#using-marks)

You will have to add your custom mark to the blueprint of your Writer field's in order to be able to use them.

**Example:**

```
text:
type: writer
marks:
  - bold
  - italic
  - strike
  - highlight
  - buttonLink

```

Links
-----

[](#links)

Links are special kinds of marks that allow you to add editable ``-tags with custom classes and attributes to your Writer fields.

You can add them like so:

```
return [
  'smongey.writermarks' => [
    "links" => [
      "buttonLink" => [
        "label" => "Special Link Button",
        "icon" => "attachment",
        "tag" => "button",
        "class" => "superspecial",
        "style" => "text-decoration: line-through",
        "attrs" => [
          "x-data" => "awesomeHighlight()",
        ],
      ],
    ],
  ]
];
```

The attributes and settings of links function exactly like those of regular marks. The only difference is in how they behave in the editor.

### Avoiding issues with links:

[](#avoiding-issues-with-links)

**Link fields have to have a class set on them. Otherwise the writer field will confuse them for regular links**

Todo
----

[](#todo)

These tasks still need to be completed before a public release;

- \[\] Report docs being broken to Kirby
- \[\] Report event-propagation bug to Kirby
- \[\] Report issue with inlining JS into the panel to Kirby
- \[\] Add comments
- \[\] Touch up ReadMe
- **Find a better name** (Now called Writer Marks)

###  Health Score

18

—

LowBetter than 8% of packages

Maintenance45

Moderate activity, may be stable

Popularity8

Limited adoption so far

Community6

Small or concentrated contributor base

Maturity13

Early-stage or recently created project

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

### Community

Maintainers

![](https://www.gravatar.com/avatar/a0e3e97bbe0656595acd8717f64b9692443276cada289a79db7dcbd9ab323e2e?d=identicon)[smongey](/maintainers/smongey)

---

Top Contributors

[![smongey](https://avatars.githubusercontent.com/u/1285493?v=4)](https://github.com/smongey "smongey (4 commits)")

### Embed Badge

![Health badge](/badges/smongey-writer-marks/health.svg)

```
[![Health](https://phpackages.com/badges/smongey-writer-marks/health.svg)](https://phpackages.com/packages/smongey-writer-marks)
```

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)