Text + Bildergalerie

Hallo Leute,

ich bin auf der Suche nach einem Element, welches den Standard von ce_text mit dem ce_gallery kombiniert.

Im Grund einfach statt dem Einzelbild aus ce_text eine Galerieoption nebst Lightbox.

Hat da schon jemand was für Rocksolid Custom Elements?

Aktuell Contao 4.13 im Einsatz.

Da brauchst du ja nur per DCA Anpassung das Text Feld zur Galerie hinzufügen und dann per Template Anpassung den Text dann ausgeben.

Also irgendwie hab ich nen Fehler drin:

Ich hab es jetzt als eigenes CE-Element gemacht. Im backend geht es auch, aber im Frotend wird nix ausgegeben...

alles liegt unter system/modules/my_textwithgallery_ce

/dca/tl_content.php

Code:

---

<?php

$GLOBALS['TL_CTE']['texts']['text_with_gallery'] = 'MyTextWithGalleryCe\ContentTextWithGallery';

$GLOBALS['TL_DCA']['tl_content']['palettes']['text_with_gallery'] = '{type_legend},type;{text_legend},text;{image_legend},multiSRC,size,alt;';

$GLOBALS['TL_DCA']['tl_content']['fields']['multiSRC'] = [
    'label'    => ['Bilder', 'Wählen Sie die Bilder für die Galerie aus.'],
    'exclude'  => true,
    'inputType' => 'fileTree',
    'eval'      => ['multiple' => true, 'fieldType' => 'checkbox', 'orderField' => 'orderSRC', 'filesOnly' => true, 'extensions' => 'jpg,jpeg,png,gif,webp'],
    'sql'      => "blob NULL"
];

$GLOBALS['TL_DCA']['tl_content']['fields']['size'] = [
    'label'    => ['Bildgröße', 'Geben Sie die gewünschte Bildgröße an.'],
    'exclude'  => true,
    'inputType' => 'imageSize',
    'eval'      => ['rgxp'=>'digit', 'includeBlankOption'=>true, 'tl_class'=>'w50'],
    'sql'      => "varchar(64) NOT NULL default ''"
];

---

languages\de\default.php

Code:

---

<?php

// Übersetzung für das Content-Element "Text mit Galerie"
// (Dabei ist "texts" der Standard-Container für Text-CEs)
$GLOBALS['TL_LANG']['CTE']['texts']['text_with_gallery'] = ['Text mit Galerie', 'Fügt Text mit einer Bildergalerie hinzu.'];

// Übersetzungen für DCA-Felder
$GLOBALS['TL_LANG']['tl_content']['multiSRC'] = ['Bilder', 'Wählen Sie die Bilder für die Galerie aus.'];
$GLOBALS['TL_LANG']['tl_content']['size']    = ['Bildgröße', 'Geben Sie die gewünschte Bildgröße an.'];
$GLOBALS['TL_LANG']['tl_content']['alt']    = ['Alternativtext', 'Geben Sie den Alternativtext für das Bild an.'];

---

src\ContentTextWithGallery.php

Code:

---

<?php

namespace MyTextWithGalleryCe;

use Contao\ContentElement;
use Contao\FilesModel;
use Contao\StringUtil;
use Contao\FrontendTemplate;

class ContentTextWithGallery extends ContentElement
{
    protected $strTemplate = 'ce_text_with_gallery'; // Template definieren

    protected function compile()
    {
        // Text-Inhalt
        $this->Template->text = StringUtil::toHtml5($this->text); // HTML5-konformen Text ausgeben
                // Debug: Prüfen, ob Text korrekt übergeben wird
                \Contao\System::log('Text: ' . $this->Template->text, __METHOD__, TL_GENERAL);
               
        // Bilder aus der Galerie laden
        if ($this->multiSRC) {
            $imageUuids = StringUtil::deserialize($this->multiSRC, true); // Sicherstellen, dass es ein Array ist
            if (!is_array($imageUuids)) {
                $imageUuids = []; // Falls Deserialisierung fehlschlägt, als leeres Array setzen
            }

            $images = [];

            foreach ($imageUuids as $uuid) {
                $file = FilesModel::findByUuid($uuid); // Datei anhand UUID finden
                if ($file !== null) {
                    $images[] = [
                        'src' => $file->path, // Bildpfad
                        'alt' => $file->alt,  // ALT-Text aus den Dateimetadaten
                    ];
                }
            }

            $this->Template->images = $images; // Bilder ans Template übergeben
        }
    }
}

---

templates\ce_text_with_gallery.html5

Code:

---

<div class="ce_text_with_gallery">
    <div class="text-content">
        <?php echo $this->text; ?>
    </div>

    <?php if (!empty($this->images)): ?>
        <div class="gallery">
            <?php foreach ($this->images as $image): ?>
                <figure>
                    <!-- Um das Bild in der Lightbox zu öffnen, packen wir es in einen <a>-Tag mit data-lightbox-Attribut -->
                    <a href="<?php echo $image['src']; ?>" data-lightbox="gallery" data-title="<?php echo htmlspecialchars($image['alt']); ?>">
                        <img src="<?php echo $image['src']; ?>" alt="<?php echo htmlspecialchars($image['alt']); ?>">
                    </a>
                </figure>
            <?php endforeach; ?>
        </div>
    <?php endif; ?>
</div>

---

Fehler:

Code:

---

Content element class "" (content element "text_with_gallery") does not exist

---