css-Klasse für Artikel-DIV von content element

[Janni]

Hallo zusammen!

Ich habe mal ein eigenes Inhaltselement / content element erstellt und habe eine Frage dazu: Wenn ich für das Inhaltselement ein Template anlege, landet dessen Inhalt ja in einem Artikel-div mit der Klasse "mod_article". Ich würde aber gerne eben diesem div eine zusätzliche css-klasse hinzufügen - nicht manuell im Backend, sondern jedes .mod_article-div mit diesem Inhaltselement soll dieselbe zusätzliche css-Klasse bekommen. Ist das möglich?

Vielen Dank und viele Grüße,
Jan

[jk1]

Hi,

ich würde an deiner Stelle einfach im Inhaltselement einen weiteren Wrapper (div) hinzufügen. Das ist wesentlich einfacher & auch logischer. In einem Artikel können ja mehrere Inhaltselemente angezeigt werden.
Contao stellt auch zuerst den Artikel bereit & danach die sich darin befindenden Inhaltselemente. Du kannst also (soweit ich weiß) im Inhaltselement nicht mehr den Artikel ändern, weil es einfach zu spät ist.

Aber ich zeige dir trotzdem mal eine Möglichkeit mit dem bisher nicht dokumentierten Hook "getArticle". Ich weiß allerdings nicht wie sich das auf die Performance auswirkt, da in dem Fall bei jedem Artikel nochmal geschaut wird, ob es ein Inhaltselement von deinem Typ beinhaltet.

In deinem Modulordner/config/config.php:

$GLOBALS['TL_HOOKS']['getArticle'][] = array('MyClass','myGetArticle'); 

Autloader nicht vergessen.

In deiner MyClass.php:

<?php

class MyClass extends \Frontend
{
    public function myGetArticle($objArticle)
    {
        $ceType = 'image'; // hier müsste dann der Name bzw. Typ deines Inhaltelementes rein.
        $newCssClass = 'deineNeueKlasse'; // und das ist der Name deiner zusätzlichen Klasse für das mod_article Template.
                
        // jetzt suchen wir bei jedem Artikel bevor die Inhaltselemente im Artikel geladen werden bereits die zugehörigen Inhaltselemente, die zu deinem CE-Type passen & der parent Table "tl_article" angehören.
        $objContentElements = \ContentModel::findAll(
            array
            (
                'column'  => array('pid=?','type=?','ptable=?'),
                'value'   => array($objArticle->id, $ceType, 'tl_article')
            )
        );

        if (!$objContentElements)
        {
            return '';
        }
                
        // hier setzen wir die neue CSS Klasse mit hinein.
        if(is_array($objArticle->classes))
        {
            $objArticle->classes = array_merge($objArticle->classes, array($newCssClass));
        }else{
            $objArticle->classes = array($newCssClass);
        }

    }
}

Ich hab echt keine Ahnung, ob das so schlau ist. Vielleicht kann jemand anderes was dazu sagen?
Funktioniert aber auf jeden Fall ;-)

[tab]

Schreib doch einfach mal, was du mit der Klasse machen willst. Soll der ganze Artikel anders gestyled werden, wenn dein Inhaltselement darin enthalten ist, oder was soll sonst mit Hilfe der Klasse passieren? Vielleicht lässt es sich ja auch anders bzw einfacher lösen.

Klar ist, dass zumindest mit CSS3 kein "Parentselektor" existiert, für CSS4 war zumindest mal so eine Möglichkeit angedacht, ist aber wohl momentan nicht mehr aktuell.

Ich kann die Folgen der Lösung von jk1 für die Performance auch nicht einschätzen. Falls das zu schlimm werden sollte, geht das mit der zusätzlichen Klasse natürlich auch mit jQuery oder Javascript.

[Janni]

Hallo, ich danke herzlich für eure Antworten!

ich würde an deiner Stelle einfach im Inhaltselement einen weiteren Wrapper (div) hinzufügen. Das ist wesentlich einfacher & auch logischer. In einem Artikel können ja mehrere Inhaltselemente angezeigt werden.

Ja, das war mein Denkfehler, hatte das für 'nen Moment vergessen, dass die Inhaltselemente ja nur "Bausteine" im Artikel sind.

Schreib doch einfach mal, was du mit der Klasse machen willst. Soll der ganze Artikel anders gestyled werden, wenn dein Inhaltselement darin enthalten ist, oder was soll sonst mit Hilfe der Klasse passieren? Vielleicht lässt es sich ja auch anders bzw einfacher lösen.

Die Idee ist folgende: Es gibt noch einen Modul-Artikel, der manchmal nach einem solchen Inhaltselement folgt und manchmal nicht; wenn dieser zu einem Modul gehörende Artikel nach einem Artikel mit diesem oben beschriebenen Inhaltselement folgt, soll er sich clear-mäßig anders verhalten. Das hätte ich dann css-mäßig lösen über der "+"-Selektor können als

.mod_article.inhaltselement_artikel_klasse + .mod_article > .modul_artikel_klasse { clear: anders als sonst... }

Allerdings wird es wohl auch über eine manuell zugewiesene Klasse im Backend gehen so häufig kommt das auch nicht vor, dass das unzumutbar wäre.

Vielen Dank auch für die Idee mit dem Hook und die Erklärung! Denke aber, das wäre an dieser Stelle tatsächlich ein "Overkill", die Methode einzusetzen...