diff --git a/themes/buha/assets/scss/generator.scss b/themes/buha/assets/scss/generator.scss
index 8f8cf354..22e73b9a 100644
--- a/themes/buha/assets/scss/generator.scss
+++ b/themes/buha/assets/scss/generator.scss
@@ -27,9 +27,22 @@ form {
     max-width: 1920px;
 }
 
-.button {
-    font-size: .8em;
-    padding: .5em;
+.generator {
+    .button {
+        font-size: .8em;
+        border-radius: 0;
+        margin: 0;
+        background: var(--background);
+        padding-right: 2em;
+        padding-left: 2em;
+        &:hover {
+            background: var(--background-alt);
+        }
+    }
+    .textarea {
+        margin-top: 0;
+        border-radius: 0;
+    }
 }
 
 p {
diff --git a/themes/buha/content/tools/generator.de.md b/themes/buha/content/tools/generator.de.md
index cccee618..d69d5228 100644
--- a/themes/buha/content/tools/generator.de.md
+++ b/themes/buha/content/tools/generator.de.md
@@ -6,6 +6,7 @@ description: "generator"
 type: "tools"
 tool: "generator"
 divide: "Getrennt durch Komma"
+js: ["visibleIf.js","generator.js"]
 forms:
   - to: info@bunteshaus.de
     realnames: false
diff --git a/themes/buha/content/tools/test.de.md b/themes/buha/content/tools/test.de.md
new file mode 100644
index 00000000..1ad214a6
--- /dev/null
+++ b/themes/buha/content/tools/test.de.md
@@ -0,0 +1,6 @@
+---
+title: "Test"
+js: ["test.js"]
+---
+{{< test >}}
+
diff --git a/themes/buha/layouts/partials/tools/generator/form.html b/themes/buha/layouts/partials/tools/generator/form.html
index 6d05da9a..1b6a2453 100644
--- a/themes/buha/layouts/partials/tools/generator/form.html
+++ b/themes/buha/layouts/partials/tools/generator/form.html
@@ -34,10 +34,10 @@
                     {{ $translation := index $b 1 }}
                     {{ $n := index $b 0 }}
                     {{ $nn := printf "%s;%s" $button_target $n}}
-                    <button class="button" onclick="button({{- $nn -}})" type="button" value="{{ $n }}">{{ $translation }}</button>
+                    <button class="button tabs" onclick="button({{- $nn -}})" type="button" value="{{ $n }}">{{ $translation }}</button>
                 {{ end }}
             </div>
-            <textarea class="w100" name="{{ .title }}" id="{{ .title }}" rows="10" {{ if .placeholder }}placeholder="{{ .placeholder }}"{{ end }}></textarea>
+            <textarea class="w100 textarea" name="{{ .title }}" id="{{ .title }}" rows="10" {{ if .placeholder }}placeholder="{{ .placeholder }}"{{ end }}></textarea>
         </div>
     {{ else if eq .input_type "radio" }}
         <div class="radio {{- if .group }} visibleIf margin_left_1rem" data-visibleif-rule="{{ .group }}group == 'true'{{ end }}">
@@ -182,7 +182,7 @@
                         {{ $direction = .direction }}
                     {{ end }}
                     <div class="margin_left_1rem" style="display: flex; flex: 0 1 auto; flex-wrap: wrap;">
-                        <button class="button" type="button" value="Clear" onclick="clearThis({{ .title }});" />Clear</button>
+                        <button style="background: #8e3333;" class="button" type="button" value="Clear" onclick="clearThis({{ .title }});" />Clear</button>
                         {{ $button_target := .title }}
                         {{ range sort $finale }}
                             {{ if . }}
diff --git a/themes/buha/layouts/shortcodes/generator.html b/themes/buha/layouts/shortcodes/generator.html
index aa116d0f..8a98e28d 100644
--- a/themes/buha/layouts/shortcodes/generator.html
+++ b/themes/buha/layouts/shortcodes/generator.html
@@ -2,5 +2,3 @@
 <div class="generator">
   {{ partial "tools/generator/form" (dict "context" . "form" 0) }}
 </div>
-<script defer src="{{ "/js/visibleIf.js" | urlize | relURL }}"></script>
-<script defer src="{{ "/js/generator.js" | urlize | relURL }}"></script>
diff --git a/themes/buha/layouts/shortcodes/test.html b/themes/buha/layouts/shortcodes/test.html
new file mode 100644
index 00000000..ec09f18e
--- /dev/null
+++ b/themes/buha/layouts/shortcodes/test.html
@@ -0,0 +1,4 @@
+<noscript><p><b>Bitte aktiviere Javascript, sonst funktioniert der Generator nicht.</b></p></noscript>
+<div>
+
+</div>
diff --git a/themes/buha/layouts/tools/single.html b/themes/buha/layouts/tools/single.html
index 76dee69a..00b9b8cb 100644
--- a/themes/buha/layouts/tools/single.html
+++ b/themes/buha/layouts/tools/single.html
@@ -15,5 +15,11 @@
     {{ end }}
     <article>
     {{ .Content }}
+    {{ if .Params.js }}
+        {{ range .Params.js }}
+            {{ $js := printf "/js/%s" . | safeURL }}
+            <script defer src="{{  $js | urlize }}"></script>
+        {{ end }}
+    {{ end }}
     </article>
 {{ end }}
diff --git a/themes/buha/static/js/generator.js b/themes/buha/static/js/generator.js
index d6602d4a..275cf458 100644
--- a/themes/buha/static/js/generator.js
+++ b/themes/buha/static/js/generator.js
@@ -38,7 +38,7 @@ function Input(str) {
     typeInInputfield(out);
     var end = id.value.length;
     id.setSelectionRange(end, end);
-    id.focus();
+    id.focus({preventScroll: true});
   }
 }
 
@@ -105,7 +105,7 @@ function button(str) {
     typeInTextarea(out);
     var end = id.value.length;
     id.setSelectionRange(end, end);
-    id.focus();
+    id.focus({preventScroll: true});
   }
 }
 
diff --git a/themes/buha/static/js/test.js b/themes/buha/static/js/test.js
new file mode 100644
index 00000000..8b137891
--- /dev/null
+++ b/themes/buha/static/js/test.js
@@ -0,0 +1 @@
+