"HTML-Code"-Modul als Include-Element: Abstand und CSS

[Jan S.]

Hallo zusammen,

wenn man ein "HTML-Code"-Modul als Include-Element in einen Artikel einsetzt, dann werden die Angaben wie CSS-ID und -Klasse, sowie die Abstände nicht übernommen.

Man kann die mod_html.tpl folgendermaßen verändern:

Vorher:

<?php echo $this->html; ?>

Neu:

<?php if ($this->class || $this->cssID || $this->style): ?>
<div class="<?php echo $this->class; ?> block"<?php echo $this->cssID; ?><?php if ($this->style): ?> style="<?php echo $this->style; ?>"<?php endif; ?>>
<?php endif; ?>

<?php echo $this->html; ?>

<?php if ($this->class || $this->cssID || $this->style): ?>
</div>
<?php endif; ?>

So funktioniert es bei mir jetzt!

Vielleicht sollte das auch als Ticket übernommen werden? Oder sehe ich die ganze Sache falsch oder habe etwas übersehen?

Viele Grüße
Jan

[Sebastian]

HI

in einem HTML-Modul kann man doch sowieso keine Angaben zu Klassen, ID, etc. machen, da man das über den Code selbst eingibt. Wofür sollen dann also nichtexistente Informationen übernommen werden?

Sebastian

[Jan S.]

HI

in einem HTML-Modul kann man doch sowieso keine Angaben zu Klassen, ID, etc. machen, da man das über den Code selbst eingibt. Wofür sollen dann also nichtexistente Informationen übernommen werden?

Sebastian

Wenn ich ein Modul einbinde kann ich in der Artikel-Ansicht Angaben dazu machen, auch bei HTML-Code ist dies so und auch sinnvoll:

Ich habe ein Layout mit vielen Zeilen. Jede Zeile mit jeweils zwei floats nebeneinander. Ich erstelle immer zwei Elemente nacheinander mit einer float Klasse. Dadurch werden die beiden Elemente nebeneinander dargestellt. Danach kommt ein Trennermodul und dann wieder zwei Textelement als float usw.
Damit simuliere ich praktisch ein zweispaltiges Layout, welches jedoch durch den Trenner den Text immer wieder an gleicher Position beginnen lässt.
Damit kann man gut ein Layout realisieren, welches immer Bild und Text nebeneinander darstellt.

Habe ich jedoch den Fall, dass ich ein Textelement und eine Werbeanzeige als Modul daneben setze, muss ich auch hier die entsprechende floatende Klasse angeben. Diese wurde bei dem HTML-Code Modul nicht übernommen, da dies im Template fehlte. Damit wurde der Anzeigencode ohne umschließende DIV eingesetzt und konnte damit nicht links platziert werden, da dort schon das andere Textelement mit dem left-float lag.

Bin ich verständlich? ;-)

Also mit der obigen Modifikation geht es. Wie gesgat, in der Artikelansicht kannst du auch für HTML-Code Module CSS-Definitionen angeben, welche sich natürlich nur auf das umschließenden DIV beziehen und nicht auf den Modul-Inhalt.

Viele Grüße
Jan

[Sebastian]

HI

ach du meinst die Felder im Inhaltselement… Das habe ich nicht kapiert.

Wenn das tatsächlich fehlt, kannst du ja mal über ein Ticket nachdenken. Eine gute Begründung hast du ja. Aber vorher suchen…

Sebastian

[Jan S.]

Hey Sebastian,

ja stimmt, da hab ich mich ungenau ausgedrückt.

Dann kümmer ich mich mal um das Ticket.

Viele Grüße
Jan

[Andreas]

Hallo Jan,

ich meine es sieht noch ein wenig anders aus.
1. Das Modul 'Eigener HTML-Code' und das Inhaltselement 'HTML' gerendert mit mod_html.tpl und ce_html.tpl haben beide nicht die Möglichkeit eine CSS-Klasse mitzugeben. Die Templates, welche beide identisch sind, sind also in Ordnung:

<?php echo $this->html; ?>

2. Das Inhaltselement Typ Modul (Kat. Include-Elemente) ist dafür verantwortlich die CSS-Klasse auszugeben, denn hier kann man sie auch eintragen. Es rendert aber leider nur den DIV um das Modul herum.

<div class="ce_text block">
  Modul 'Eigener HTML-Code'
</div>

Das Inhaltselement Typ Text z.B. hingegen liefert brav die Klasse mit.

<div class="ce_text eigene_klasse block">
  Inhalt von CE Typ Text
</div>

Irgendwie finde ich das Template nicht, welches für das Rendering vom Inhaltselement Typ Modul (Kat. Include-Elemente) verantwortlich ist. Darin müsste dann der Fehler liegen. Es ist auf jeden Fall noch ein Template dazwischen, außen ist das vom Artikel, innen das vom Modul und das dazwischen müsste die Klasse mitbringen.

Andreas

[Jan S.]

Hallo Andreas,

danke für den Hinweis. Ich habe eben nochmal folgendes probiert: Wenn ich ein "HTML-Code"-Modul direkt in das Seitenlayout einbinde, wird es von "<div class="mod_html block">" umschlossen. Dort wird also mein angepasstes "mod_html.tpl" auch verwendet und damit bin ich also, wie du ja auch geschrieben hast, wahrscheinlich im falschen Template (wenn es noch ein anderes geben würde).

Zu 2.: Bist du sicher, dass da noch ein Template zwischensitzt? Ich habe nämlich auch nichts passendes gefunden. Könnte es auch so sein, dass die entsprechenden Angaben (Class, ID, Abstände), welche in einem Modul definiert sind, von den Angaben zum Include-Element im Artikel überschrieben oder ergänzt werden (und damit auch nur das entsprechende mod_xxx.tpl) verwendet wird) ?
Ansonsten müsste ein inkludiertes Modul ja von zwei DIVs eingeschlossen sein. Das könnte man ja durch Ausprobieren einfach herausbekommen.
Wenn es so wäre, würde das auch erklären, wieso ausgerechnet bei mod_html diese Verarbeitung des umschlißenden DIVs "vergessen" worden sein sollte. Ich denke es könnte nämlich evtl. doch das Template mod_html.tpl dafür verwendet werden? Oder denke ich da irgendwo falsch?

Viele Grüße
Jan

[Andreas]

So, ich hab auch noch mal einiges analysiert. In meinen TL-Anfängen hatte ich hier mal gefragt, warum meine Klassen aus den Modulen beim Include in einen Artikel nicht gerendert werden. Man sagte mir dann, dass sie von den(/der?) Klasse des Artikels überschrieben werden. Ich habe jetzt erst mal einen Test mit dem Modul Sitemap gemacht. Ergebnis:
mod_article.tpl, mod_sitemap.tpl
class_aticle, class_element, class_modul

<div class="mod_article class_article">
  <div class="mod_sitemap class_element">
  </div>
</div>

Das CE scheint also keinen extra DIV zu generieren, es wird aber die Klasse des CEs in das DIV des Moduls geschrieben.

class_aticle, class_modul, (class_element entfernt)

<div class="mod_article class_article">
  <div class="mod_sitemap">
  </div>
</div>

Die Klasse aus dem Modul wird nicht gerendert und nicht von der Klasse des Artikels überschrieben.

class_modul, (class_aticle und class_element entfernt)

<div class="mod_article">
  <div class="mod_sitemap">
  </div>
</div>

Die Klasse aus dem Modul wird nicht gerendert, obwohl ja keine Klasse da ist, welche sie überschreiben könnte.

Leider sind solche Test sehr zeitaufwendig, ich möchte jetzt erstmal nicht alles durchtesten, sonder von dem Verhalten des Moduls Sitemap mod_sitemap.tpl auf alle anderen Module schließen. Und von dem Rendering der Klassen möchte ich auf das Rendering der ID und Abstände schließen. Dann wäre es so, dass diese Werte eines Moduls beim Includen in einen Artikel überhaupt nicht gerendert werden.

Beim direkten Einbinden des Modul in ein Layout, wird die Klasse des Moduls gerendert.

<div class="inside">
  <div class="mod_sitemap class_modul">
  </div>
</div>

Zumindest das Modul 'Eigener HTML-Code' scheint hier eine Ausnahme zu machen. Erstens, da man ihm ja keine Klasse mitgeben kann, und zweitens, da sein Template mod_html.tpl auch keinen umschließenden DIV enthält. Beim direkten Einbinden ins Layout müsste man ihm also alles was man so braucht, DIVs, Klassen usw. direkt in sich selbst schreiben. Ist ja schließlich ein "HTML Modul".

Aber jetzt bin ich sehr erstaunt, beim Include dieses MTML-Code Moduls in einen Artikel wird jetzt auf einmal nur der Artikel-DIV gerendert.

<div class="mod_article [Klasse, wenn mitgegeben]">
  irgendein Inhalt vom HTML-Modul
</div>

Ich bin mir sicher, ich hatte vorher um das HTML-Modul noch einen DIV, und zwar so:

<div class="mod_article [Klasse, wenn mitgegeben]">
  <div class="ce_text [Klasse, wenn mitgegeben]">
    irgendein Inhalt vom HTML-Modul
  </div>
</div>

Mein Fazit des Ganzen:

Das Inhaltselement Modul (Kat. Include-Elemente) erwartet von Modulen diesen typischen DIV

<div class="<?php echo $this->class; ?> block"<?php echo $this->cssID; ?><?php if ($this->style): ?> style="<?php echo $this->style; ?>"<?php endif; ?>>
</div>

um seine Werte dort hinein zu generieren. Eigentlich müsste es erkennen, dass ein Modul HTML-Code eingebunden wird und die Felder für Klasse usw. verstecken, da dieses Modul den DIV ja nicht besitzt.

Wenn die Modifikation deines Templates bewirkt, dass die Werte aus dem Include-Modul Inhaltselement dem HTML-Modul mit einem DIV umschließend mitgegeben werden, dann würde ich auch sagen, dass du das ruhig als Bug mit sofortiger Lösung in ein Ticket schreiben solltest. Denn immerhin passiert etwas nicht, was man doch eigentlich erwartet.

Andreas

[Jan S.]

http://https://contao.org/issues/show/1148

[SunBlack]

Hallo Jan,

da Leo das Ticket abgelehnt hat, da er ja durchaus Recht hat das das HTMl-Element nichts außer dem entsprechenden HTML-Code ausgeben soll, ich dich aber auch verstehen kann, dass es manchmal schön wäre das man die CSS-Klasse bzw. ID mit übergeben kann (falls mal der HTMl-Code 2x in der gleichen (Artikel-)spalte verwendet werden soll), schlag doch eine Art Insert-Tags vor, die allerdings im Gegensatz zu den normalen Inserttags nur über den HTMl-Quelltext gehen.

Folgende Änderung würde ich dazu machen (ContentHelp.php):

Statt

    protected function compile()
    {
        $this->Template->html = (TL_MODE == 'FE') ? $this->html : htmlspecialchars($this->html);
    } 

folgendes (ungtestet):

    protected function compile()
    {
        $search = array('{{style}}', '{{cssID}}', '{{class}}');
        $replace = array($this->Template->style, $this->Template->cssID, $this->Template->class);
        $this->html = str_replace($search, $replace, $this->html);
        $this->Template->html = (TL_MODE == 'FE') ? $this->html : htmlspecialchars($this->html);
    } 

Dies würde sicherlich ein Kompromiss sein. Allerdings zum Nachteil der Performance, denn so viele werden es vermutlich nicht benötigen. Allerdings hätte es imho seine Daseinsberechtigung, da sonst TL Felder anbietet, die es gar nicht verarbeitet (sprich fehlende Konsistenz an dieser Stelle). Kannst ja Mal schauen, was Leo davon hält.