# Adding a custom CMS element

**URL:** <https://forum.shopware.com/t/adding-a-custom-cms-element/64569>\
**Category:** Programmierung\
**Created:** [10. Februar 2020 um 08:37 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569 "2020-02-10T08:37:58Z")\
**Posts on this page:** 16\
**Page:** 1

<div class="post-metadata">

**Author:** ![bluewolf](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/bluewolf/32/7886_2.png) [@bluewolf](https://forum.shopware.com/u/bluewolf)\
**Post date:** [10. Februar 2020 um 08:37 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/1 "2020-02-10T08:37:58Z")

</div>

Hallo,

leider scheint es in der Doku noch ein paar Lücken zu geben - mir fehlte der Hinweis, das über storefront:build / administration:build noch der Import aus der main.js generiert werden muss, damit das Element funktioniert.

Leider funktioniert das aktuell bei mir nicht, DEV Umgebung aktualisiert am 7.2.2020.  
Wenn ich bei dem Beispielcode des&nbsp;[swag-docs-custom-cms-element](https://github.com/shopware/swag-docs-custom-cms-element)&nbsp;den Ordner src/Resources/public lösche, wird dieser auch nicht wieder erstellt.&nbsp;

Hat sich da wieder etwas verändert, was in der Doku noch etwas versteckt ist oder nicht vermerkt wurde?

&nbsp;

Matthias Wolf

---

<div class="post-metadata">

**Author:** ![jfranke](https://avatars.discourse-cdn.com/v4/letter/j/a5b964/32.png) [@jfranke](https://forum.shopware.com/u/jfranke)\
**Post date:** [22. September 2021 um 10:55 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/2 "2021-09-22T10:55:46Z")

</div>

Hallo @bluewolf,

ich stehe gerade beim selben Problem. Ich habe dieses Shopware [Tutorial- Add CMS element](https://developer.shopware.com/docs/guides/plugins/plugins/content/cms/add-cms-element) gefolgt aber irgendwas klappt nicht und die admin Seite wird leer gerendert, also die Seite ist komplett weiß. Nur, wenn ich das Plugin deinstalliere wird die Seite richtig geladen. Das heißt, irgendein File macht alles kapput.

Hast du eine Lösung für deine Problematik gefunden? Würde mich sehr interessieren 🙂

LG

---

<div class="post-metadata">

**Author:** ![bluewolf](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/bluewolf/32/7886_2.png) [@bluewolf](https://forum.shopware.com/u/bluewolf)\
**Post date:** [22. September 2021 um 12:37 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/3 "2021-09-22T12:37:36Z")

</div>

Hallo @jfranke  
in meine Not hatte ich das Plugin von jemand anderen programmieren lassen, kann da also leider nicht weiterhelfen. Sorry

---

<div class="post-metadata">

**Author:** ![AlexGalax](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/alexgalax/32/9925_2.png) [@AlexGalax](https://forum.shopware.com/u/AlexGalax)\
**Post date:** [22. September 2021 um 12:42 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/4 "2021-09-22T12:42:27Z")

</div>

schau doch in den Logfiles nach oder in den Browser Dev-Tools, da siehst du welcher Request eine fehlerhafte Response zurückgibt. Dort steht in der Antwort auch der Fehler drin.

---

<div class="post-metadata">

**Author:** ![f.mertens](https://avatars.discourse-cdn.com/v4/letter/f/7993a0/32.png) [@f.mertens](https://forum.shopware.com/u/f.mertens)\
**Post date:** [24. September 2021 um 06:20 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/5 "2021-09-24T06:20:18Z")

</div>

Ich komme bei dem Thema auch nicht klar.  
Ich habe eigentlich alles aus der Doku übernommen und der Ordner Resources/public/administration ist mit allen Dateien angelegt worden.  
Aber in die app.js vom Backend wurden die Sachen nicht mit reingenommen, weshalb das Element dann auch fehlt.  
In der dev.log kann ich nicht wirklich was finden und beim ./psh.phar administration:build ist auch alles sauber durchgelaufen.

Jemand eine Idee woran es liegen könnte?

---

<div class="post-metadata">

**Author:** ![f.mertens](https://avatars.discourse-cdn.com/v4/letter/f/7993a0/32.png) [@f.mertens](https://forum.shopware.com/u/f.mertens)\
**Post date:** [29. September 2021 um 07:14 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/6 "2021-09-29T07:14:44Z")

</div>

Hat keiner eine Idee.

Ich bekomme aus der Doku weder einen CMS Block noch ein CMS Element in die Erlebniswelten, nach dem adminstration:build wurden werden die CSS und JS ganz normal in den Resource/public ordner erzeugt, aber im Backend sehe ich trotzdem nicht.  
Erhalte auch keinerlei Fehlermeldungen oder so

---

<div class="post-metadata">

**Author:** ![ninja](https://avatars.discourse-cdn.com/v4/letter/n/53a042/32.png) [@ninja](https://forum.shopware.com/u/ninja)\
**Post date:** [29. September 2021 um 09:26 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/7 "2021-09-29T09:26:15Z")

</div>

Nutzt du schon das neue App-System von Shopware oder noch das alte Plugin-System?

Soweit ich weiß gibt es aktuell noch Probleme bei CMS-Elementen im App-System. Mit dem alten Plugin System kann man allerdings ohne Probleme CMS-Blöcke und Elemente anlegen.

Die Ordnerstruktur bei den Elementen ist sehr wichtig, wie eigentlich überall in Shopware. Bei den Blöcken also genau darauf achten → src/Resources/app/administration/src/sw-cms/blocks/HIERBLOCKEINTRAGEN(z.B. text oder commerce/BlockName/

Dann wie in der Doku component und preview Ordner anlegen und alles in den .js Dateien regestrieren. Hier ist auch der Name wichtig damit was im Backend ankommt…

Und dann am Ende den CMS Block regestrieren in der index.js mit

```auto
Shopware.Service('cmsService').registerCmsBlock({
 name: 'name',
 label: 'label,
category: 'blockCategory'
....

```

Dann am Ende den ./psh.phar administration:build durchführen und der Block sollte in den Erlebniswelten unter dem entsprechenden Block erscheinen.

---

<div class="post-metadata">

**Author:** ![littleAmused](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/littleamused/32/13261_2.png) [@littleAmused](https://forum.shopware.com/u/littleAmused)\
**Post date:** [29. September 2021 um 10:25 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/8 "2021-09-29T10:25:00Z")

</div>

Hallo wertes Forum,

ich klinke mich hier mal mit einem eigenen Problem ein, welches ebenfalls CMS- **Elemente** betrifft. Ich betone hier „Elemente“ ausdrücklich, da ich beim Erstellen von Blöcken i.d.R. weniger Probleme habe.

Ich habe mir für den Wunsch eines Kunden das Element „product-box“ kopiert und so angepasst, wie ich es brauche. Die Backend-Komponente habe ich einwandfrei zum Laufen bekommen. Im Frontend scheint es allerdings zu Schwierigkeiten zu kommen:  
Ich habe mir natürlich auch zur Ausgabe meiner neuen Produktbox das Template von `/views/storefront/element/cms-element-product-box.html.twig` kopiert und ebenfalls angepasst. Hier kommt es nun zu meinem Problem: Die Shopware-Relatierten Twig-Funktionen zum Einbinden und Erweitern von Template-Dateien scheinen an dieser Stelle nicht zu funktionieren. Die Erweiterung der klassischen Produktbox mittels `sw_extend` erzeugt ein leeres `div`, ebenso die Verwendung von `sw_include`. Die Standard-Funktionen von Twig habe ich an dieser Stelle nicht getestet, da die Verwendung von sw\_\* ja schon sinnvoll ist.

Ich hab das Gefühl, dass mir ein Schritt zwischen Config im Backend und Ausgabe im Frontend fehlt. Hat da jemand eine Idee?

LG;LA

---

<div class="post-metadata">

**Author:** ![ninja](https://avatars.discourse-cdn.com/v4/letter/n/53a042/32.png) [@ninja](https://forum.shopware.com/u/ninja)\
**Post date:** [29. September 2021 um 10:42 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/9 "2021-09-29T10:42:22Z")

</div>

Du brauchst einen entsprechenden DataResolver und ein Struct Element. Wenn du das beides korrekt anlegst bekommst du auch eine Ausgabe im Frontend.

---

<div class="post-metadata">

**Author:** ![f.mertens](https://avatars.discourse-cdn.com/v4/letter/f/7993a0/32.png) [@f.mertens](https://forum.shopware.com/u/f.mertens)\
**Post date:** [30. September 2021 um 05:55 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/10 "2021-09-30T05:55:18Z")

</div>

> [@ninja](#):
>
> `category`

Du hast jetzt einen anderen Pfad geschrieben wie es in der Doku steht, hast du das auf die schnell übersehen oder ist die Doku hier verkehrt.  
Zum einen der Pfad, bei dir ist es "…src/sw-cms/… in der Doku „…src/module/sw-cms“…

So sieht meine Struktur aus

 ![image](https://europe1.discourse-cdn.com/flex013/uploads/shopware/original/2X/8/857a7184b5ef759e7d6ed4959dd7f7849cb51fb2.png)

---

<div class="post-metadata">

**Author:** ![littleAmused](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/littleamused/32/13261_2.png) [@littleAmused](https://forum.shopware.com/u/littleAmused)\
**Post date:** [30. September 2021 um 09:37 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/11 "2021-09-30T09:37:14Z")

</div>

@f.mertens Bei mir ist es mit: `src/module/sw-cms`. Ich orientiere mich da an der Struktur auf [GitHub](https://github.com/shopware/platform/tree/trunk/src/Administration/Resources/app/administration/src/module/sw-cms), die Doku scheint an manchen Stellen immer mal wieder für kleine Verwirrungen zu sorgen.

@ninja Vielen Dank für den Schubs in die richtige Richtung! Ich bin dann noch auf [diese Antwort bei Stack Overflow](https://stackoverflow.com/questions/62699616/shopware-6-cloning-cmselement-and-get-null-as-data) gestoßen. Mit den Anhaltspunkten kann ich etwas tiefer schürfen.

LG;LA

---

<div class="post-metadata">

**Author:** ![ninja](https://avatars.discourse-cdn.com/v4/letter/n/53a042/32.png) [@ninja](https://forum.shopware.com/u/ninja)\
**Post date:** [30. September 2021 um 10:37 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/12 "2021-09-30T10:37:45Z")

</div>

Es ist natürlich …src/module/sw-cms… da hat sich ein kleiner Fehler bei mir eingeschlichen. Die Struktur sieht schon mal richtig aus.

---

<div class="post-metadata">

**Author:** ![f.mertens](https://avatars.discourse-cdn.com/v4/letter/f/7993a0/32.png) [@f.mertens](https://forum.shopware.com/u/f.mertens)\
**Post date:** [30. September 2021 um 11:17 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/13 "2021-09-30T11:17:21Z")

</div>

Eigentlich schade, hätte es leicht erklären können.

Aber die Javascript Daten unter Resource/public werden ja auch korrekt erstellt.

Kann man das irgendwie im Backend debuggen um den Fehler auf der Spur zu kommen?

---

<div class="post-metadata">

**Author:** ![ninja](https://avatars.discourse-cdn.com/v4/letter/n/53a042/32.png) [@ninja](https://forum.shopware.com/u/ninja)\
**Post date:** [30. September 2021 um 11:34 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/14 "2021-09-30T11:34:21Z")

</div>

Du könntest dein Code mal mit dem github Repo vergleichen und schauen ob das Plugin aus dem Repo bei dir läuft.

Für das CMS-Element:

> **[GitHub - shopware/swag-docs-custom-cms-element](https://github.com/shopware/swag-docs-custom-cms-element)**
>
> Contribute to shopware/swag-docs-custom-cms-element development by creating an account on GitHub.

Für den CMS-Block:

> **[GitHub - shopware/swag-docs-custom-cms-block](https://github.com/shopware/swag-docs-custom-cms-block)**
>
> Contribute to shopware/swag-docs-custom-cms-block development by creating an account on GitHub.

Laufen die bei dir hast du vermutlich irgendwo einen kleinen Fehler. Steht denn bei dir was in der Konsole?

---

<div class="post-metadata">

**Author:** ![f.mertens](https://avatars.discourse-cdn.com/v4/letter/f/7993a0/32.png) [@f.mertens](https://forum.shopware.com/u/f.mertens)\
**Post date:** [30. September 2021 um 12:24 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/15 "2021-09-30T12:24:24Z")

</div>

@ninja, vielen dank für deine Geduld und auch danke für die Links, mir war irgendwie gar nicht bewusst das die Doku sachen auch schon fertig bei github vorhanden sind.

Dadurch konnte ich jetzt noch mal anders einsteigen und habe denke den Fehler gefunden, und der lag bei mir, ich bin bei diesen ganzen Begriffen durcheinander gekommen. Ich dachte das cms-block würde eine neue Auswahl in dem Selectfeld „Bock-Kategorie“ anlegen, dabei ist Block das was unter diesen Kategorien zu finden ist und ich als Element im Kopf hatte.

Ich denke mein Problem ist jetzt gelöst.

---

<div class="post-metadata">

**Author:** ![ninja](https://avatars.discourse-cdn.com/v4/letter/n/53a042/32.png) [@ninja](https://forum.shopware.com/u/ninja)\
**Post date:** [30. September 2021 um 12:27 UTC](https://forum.shopware.com/t/adding-a-custom-cms-element/64569/16 "2021-09-30T12:27:30Z")

</div>

Kein Problem, ist am Anfang auch alles sehr verwirrend. Habe auch ein wenig gebraucht um alles einigermaßen zu verstehen 😃
