diff --git a/README.md b/README.md
index 9da054a..6cc75f1 100644
--- a/README.md
+++ b/README.md
@@ -113,6 +113,40 @@ Usage:
```
+### Tolkie
+
+Enqueues the Tolkie script and adds the button placeholder.
+It [automatically](./src/Hooks/Tolkie.php) adds a placeholder bellow every `H1` heading.
+
+Usage:
+
+1. Add the Tolkie token to the config
+ ```
+ return [
+ ...
+
+ 'tolkie' => [
+ 'token' => 'yourtokenhere',
+ ],
+ ];
+ ```
+2. If needed add the button placeholder component to the templates
+ ```blade
+
+ ```
+
+If needed you can configure the Tolkie script in the config. Every attribute you would normally add in `wp_print_script_tag()` can be added here.
+
+Lets say you want to add a new `data` attribute:
+```
+'tolkie' => [
+ 'html_attributes' => [
+ 'data-tolkie-new-option' => 'new-value',
+ 'data-tolkie-state' => 'separateButtons',
+ ]
+],
+```
+
### Nav
Navigation component with optional dropdowns. Provides the right ARIA attributes and keyboard navigation for accessibility.
diff --git a/config/components.php b/config/components.php
index e4bcebd..ad0fe14 100644
--- a/config/components.php
+++ b/config/components.php
@@ -37,4 +37,11 @@
'disable' => '',
'automaticallyAddToH1' => true,
],
+ 'tolkie' => [
+ 'token' => null,
+ 'automatically_add_to_h1' => true,
+ 'html_attributes' => [
+ 'data-tolkie-state' => 'separateButtons',
+ ],
+ ],
];
diff --git a/resources/views/components/tolkie.blade.php b/resources/views/components/tolkie.blade.php
new file mode 100644
index 0000000..ef0c740
--- /dev/null
+++ b/resources/views/components/tolkie.blade.php
@@ -0,0 +1 @@
+
diff --git a/src/Components/Tolkie.php b/src/Components/Tolkie.php
new file mode 100644
index 0000000..3458b1c
--- /dev/null
+++ b/src/Components/Tolkie.php
@@ -0,0 +1,17 @@
+ 'separateButtons',
+ // ]),]);
+ $hooks[] = Hooks\Tolkie::class;
+ }
+
(new Registrar($hooks))->registerHooks();
}
}
diff --git a/src/Hooks/Tolkie.php b/src/Hooks/Tolkie.php
new file mode 100644
index 0000000..8c2cf45
--- /dev/null
+++ b/src/Hooks/Tolkie.php
@@ -0,0 +1,39 @@
+ 'separateButtons',
+ ]),
+ 'class' => 'tolkieIntegrationScript',
+ 'id' => 'tolkie-script',
+ 'type' => 'module',
+ 'src' => 'https://app.tolkie.nl/',
+ 'crossorigin' => 'anonymous',
+ 'defer' => '',
+ 'data-tolkie-token' => config('components.tolkie.token'),
+ ]);
+ }
+
+ #[Filter('render_block_core/heading')]
+ #[Filter('render_block_core/post-title')]
+ public function addTolkieTag(string $content, array $block): string
+ {
+ if (config('components.tolkie.automatically_add_to_h1', true) && 1 === ($block['attrs']['level'] ?? 0)) {
+ $content .= '';
+ }
+
+ return $content;
+ }
+}