{"id":1532,"date":"2022-04-30T15:35:40","date_gmt":"2022-04-30T06:35:40","guid":{"rendered":"https:\/\/www.weschkalnies.de\/blog\/?p=1532"},"modified":"2026-03-24T04:13:57","modified_gmt":"2026-03-23T19:13:57","slug":"contao-tl_article-erweitern","status":"publish","type":"post","link":"https:\/\/www.weschkalnies.de\/blog\/contao-tl_article-erweitern\/","title":{"rendered":"Contao: Artikel um Hintergrundbild erweitern"},"content":{"rendered":"

Eine neue Datei erstellen in \/contao\/dca\/tl_article.php<\/code> bzw. diese erg\u00e4nzen.<\/p>\n

Eine neue Palette einf\u00fcgen<\/h3>\n

Als erstes soll f\u00fcr das Backend eine neue Palette eingef\u00fcgt werden. Alternativ kann man auch eine vorhandene Palette erweitern. Dies wird hier aber zun\u00e4chst nicht gemacht.
\n<\/p>\n

Dazu folgenden Code einf\u00fcgen.<\/p>\n

\r\nuse Contao\\CoreBundle\\DataContainer\\PaletteManipulator;\r\n\r\nPaletteManipulator::create()\r\n    \r\n    \/\/ add a new \"custom_legend\" after the \"title_legend\"\r\n    ->addLegend('custom_legend', 'title_legend', PaletteManipulator::POSITION_AFTER)\r\n\r\n     \/\/ directly add new fields to the new legend\r\n     ->addField('bgImage', 'custom_legend', PaletteManipulator::POSITION_APPEND)\r\n\r\n    \/\/ now the field is registered in the PaletteManipulator\r\n    \/\/ but it still has to be registered in the globals array:\r\n    ->applyToPalette('default', 'tl_article')\r\n    ; \r\n<\/pre>\n
\u00dcber den PaletteManipulator, den man im ersten Schritt importiert wird die Palette ‚custom_legend‘ hinter (POSITION_AFTER) der Palette ‚title_legend‘ eingef\u00fcgt.
\nWenn man wissen m\u00f6chte, welche Paletten es z.B. im tl_article gibt, kann man sich den Code von tl_article bei Github hier<\/a> ansehen.<\/p>\n
Anschlie\u00dfend wird der neuen Palette direkt ein neues Feld ‚bgImage‘ hinzugef\u00fcgt. Im letzten Schritt ‚applyToPalette‘ wird die neue Palette zum Bereich ‚default‘ hinzugef\u00fcgt.<\/p>\n
DCA definieren<\/h3>\n
Okay die Palette haben wir, fehlt noch das Feld selbst, das wir \u00fcber einen DCA definieren m\u00fcssen.<\/p>\n
Der Code wird dazu, wie folgt erg\u00e4nzt:<\/p>\n
\r\n$GLOBALS['TL_DCA']['tl_article']['fields']['bgImage'] =\r\n[\r\n'inputType' => 'fileTree',\r\n'reference' => &$GLOBALS['TL_LANG']['tl_article'],\r\n'eval' => array(\r\n'mandatory' => false,\r\n'files_only' => true,\r\n'files' => true,\r\n'extensions' => 'svg,png,jpg',\r\n'tl_class' => 'clr',\r\n),\r\n'sql' => \"binary(16) NULL\"\r\n];\r\n<\/pre>\n
Hier handelt es sich um einen DCA f\u00fcr ein Bild.<\/p>\n
Bezeichnungen f\u00fcr das neue Feld einf\u00fcgen<\/h3>\n
In der Datei ‚\/contao\/languages\/de\/tl_article.php‘ folgenden Code erg\u00e4nzen bzw. erstellen.
\nHinweis: Das ist jetzt hier nur f\u00fcr die deutsche Sprache. Wenn man mehrere Sprachen unterst\u00fctzen m\u00f6chte, entsprechend in der jeweiligen Sprachdatei z.B. ‚\/contao\/languages\/en\/tl_article.php‘ entsprechend erg\u00e4nzen.<\/p>\n
\r\n$GLOBALS[\"TL_LANG\"][\"tl_article\"][\"bgImage\"] = [\r\n\"Hintergrundbild\",\r\n\"Bestimmen Sie ein Hintergrundbild des Artikels.\",\r\n];\r\n$GLOBALS[\"TL_LANG\"][\"tl_article\"][\"custom_legend\"] = \"Hintergrundbild f\u00fcr FullSize Artikel\";\r\n<\/pre>\n
Contao: Installtool aufrufen<\/h3>\n
Das Contao Installtool aufrufen um das Feld zur Datenbank hinzuzuf\u00fcgen.<\/p>\n
Contao Anwendungscache l\u00f6schen<\/h3>\n
Jetzt muss der Anwendungscache von Contao gel\u00f6scht werden, damit die Palette und das Feld auch im Backend erscheint. Man hat drei M\u00f6glichkeiten:
\na) \u00dcber den Contao Manager
\nb) \u00dcber die Console\/PHP direkt z.B. \u00fcber<\/p>\n
\r\nvendor\/bin\/contao-console cache:clear --env=dev\r\nvendor\/bin\/contao-console cache:clear --env=prod\r\n<\/pre>\n
c) Die Dateien und Verzeichnisse im Verzeichnis ‚var\/cache\/‘ z.B. mit rm -R -f * l\u00f6schen und dann noch mal das Installtool aufrufen (falls man keinen Contao Manager hat und keinen Zugriff via SSH auf PHP)<\/p>\n
Frontend Ausgabe – mod_article Template bearbeiten<\/h3>\n
Im Template f\u00fcr den Artikel ‚mod_article.html5‘ kann man jetzt den Wert des Feldes ausgeben.<\/p>\n
\r\n$image = FilesModel::findByUuid($this->bgImage);\r\n$imagePath = $image->path;\r\n<\/pre>\n
Wenn alles funktioniert hat, sollte es im Backend z.B. so aussehen.
\n\"\"<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"
Eine neue Datei erstellen in \/contao\/dca\/tl_article.php bzw. diese erg\u00e4nzen. Eine neue Palette einf\u00fcgen Als erstes soll f\u00fcr das Backend eine neue Palette eingef\u00fcgt werden. Alternativ kann man auch…<\/p>\n","protected":false},"author":4,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[34],"tags":[111,35,109,110],"class_list":["post-1532","post","type-post","status-publish","format-standard","hentry","category-contao","tag-artikel-erweitern","tag-contao-2","tag-tl_article","tag-tl_article-erweitern"],"_links":{"self":[{"href":"https:\/\/www.weschkalnies.de\/blog\/wp-json\/wp\/v2\/posts\/1532","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.weschkalnies.de\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.weschkalnies.de\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.weschkalnies.de\/blog\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.weschkalnies.de\/blog\/wp-json\/wp\/v2\/comments?post=1532"}],"version-history":[{"count":23,"href":"https:\/\/www.weschkalnies.de\/blog\/wp-json\/wp\/v2\/posts\/1532\/revisions"}],"predecessor-version":[{"id":1731,"href":"https:\/\/www.weschkalnies.de\/blog\/wp-json\/wp\/v2\/posts\/1532\/revisions\/1731"}],"wp:attachment":[{"href":"https:\/\/www.weschkalnies.de\/blog\/wp-json\/wp\/v2\/media?parent=1532"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.weschkalnies.de\/blog\/wp-json\/wp\/v2\/categories?post=1532"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.weschkalnies.de\/blog\/wp-json\/wp\/v2\/tags?post=1532"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}