08.01.2025

Elemente

Die Elemente vereinfachen die Erstellung von komplexen und meist wiederholenden Bereiche für Kunden.

Einführung

Elemente werden mithilfe einer while-Schleife wiederholt aus der Datenbank ausgegeben.
Die Abfrage erfolgt über einen MySQL Befehl.

Datenbank Attribute

Die Elemente werden in einer Datenbank gespeichert unter diesem Relationsnamen: texte_elemente
Diese Relation besitzt folgende Attribute:

Attribute	Erklärung
`id`	ID
`id_text`	Seiten-ID
`lan`	Sprachkürzel → de
`typ`	Elementvorgabe ID
`value1` bis `value12`	Vorgabe Value
`reihenfolge`	Reihenfolge

Ein einfaches Element erstellen

1. Lege eine neue Elementvorgabe an. Der Name soll für den Kunden verständlich sein. (Einstellungen → Konfiguration → Element Vorlagen)
2. Erstelle eine neue Datei in dem template/plugins/ Ordner mit dem Namen element_SEITENNAME_BEZEICHNUNG.php
3. Füge folgenden Code in die neu erstellte Datei ein:

→ < v4.0.0

<?php
$i = 0;
$result = cube_query('
		Select * 
		from texte_elemente 
		where id_text="' . gibmomentaneid() . '" and typ="VORLAGEN ID" and showing="1" and lan="' . $_GET['lan'] ODER $_SESSION['lan'] . '" 
		order by reihenfolge');
			while ($row = $result->fetch_assoc()) { $i++;
				
				// Einzelnes Bild
				$image = unserialize($row['value1']);
				$imageSrc = "template/elemente/" . $row['id'] . "/(original|1200|800|400|200)/" . $image[0];
				
				// Mehrere Bilder
				$imageArray = unserialize($row['image']);
				$imageArraySum = count($imageArray);
				for ($c = 0; $c < $imageArraySum; $c++) {
					echo "template/elemente/" . $row['id'] . "/(original|1200|800|400|200)/" . $imageArray[$c];
				}

                		// Zum Beispiel
				echo "<h2>[$row['value2']]</h2>";

			}
?>

← < v4.0.0

→ v5.0.0-v5.2.0

<?php
$i = 0;
$result = cube_query('SELECT * FROM texte_elemente WHERE id_text="' . $pageoptions_infos['pageId'] . '" and typ="ELEMENTTYP" and showing="1" and lan="' . $pageoptions_infos['language']['lan'] . '" ORDER BY reihenfolge');
	if ($result->num_rows > 0) { // Wenn ein Element vorhanden ist, führe aus
		while ($row = $result->fetch_assoc()) { $i++;
			
			// Einzelnes Bild
			$image = unserialize($row['image']);
			$imageSrc = "template/elemente/" . $row['id'] . "/(original|1200|800|400|200)/" . $image[0];
			
			// Mehrere Bilder
			$imageArray = unserialize($row['image']);
			$imageArraySum = count($imageArray);
			for ($c = 0; $c < $imageArraySum; $c++) {
				echo "template/elemente/" . $row['id'] . "/(original|1200|800|400|200)/" . $imageArray[$c];
			}

                	// Zum Beispiel
			echo "<h2>[$row['value2']]</h2>";

		}
	}
?>

← v5.0.0-v5.2.0

→ v5.2.1-v5.2.2

<?php
$i = 0;
$result = cube_query('SELECT * FROM texte_elemente WHERE id_text="' . $this->pageOptions['pageId'] . '" and typ="ELEMENTTYP" and showing="1" and lan="' . $this->pageOptions['language']['lan'] . '" ORDER BY reihenfolge');
	if ($result->num_rows > 0) { // Wenn ein Element vorhanden ist, führe aus
		while ($row = $result->fetch_assoc()) { $i++;
			
			// Einzelnes Bild
			$image = unserialize($row['image']);
			$imageSrc = "template/elemente/" . $row['id'] . "/(original|1200|800|400|200)/" . $image[0];
			
			// Mehrere Bilder
			$imageArray = unserialize($row['image']);
			$imageArraySum = count($imageArray);
			for ($c = 0; $c < $imageArraySum; $c++) {
				echo "template/elemente/" . $row['id'] . "/(original|1200|800|400|200)/" . $imageArray[$c];
			}

                	// Zum Beispiel
			echo "<h2>[$row['value2']]</h2>";

		}
	}
?>

← v5.2.1-v5.2.2

→ > v5.2.3

<?php
$i = 0;
$result = cube_query('SELECT * FROM texte_elemente WHERE id_text="' . $this->pageOptions['pageId'] . '" and typ="ELEMENTTYP" and showing="1" and lan="' . $this->pageOptions['language']['lan'] . '" ORDER BY reihenfolge');
	if ($result->num_rows > 0) { // Wenn ein Element vorhanden ist, führe aus
		while ($row = $result->fetch_assoc()) { $i++;
			
			// Einzelnes Bild
			$image = unserialize($row['image']);
			$imageSrc = "template/elemente/" . $row['id'] . "/(1920|1200|800|400|200)/" . $image[0];
			
			// Mehrere Bilder
			$imageArray = unserialize($row['image']);
			$imageArraySum = count($imageArray);
			for ($c = 0; $c < $imageArraySum; $c++) {
				echo "template/elemente/" . $row['id'] . "/(1920|1200|800|400|200)/" . $imageArray[$c];
			}

                	// Zum Beispiel
			echo "<h2>[$row['value2']]</h2>";

		}
	}
?>

← > v5.2.3

Weitere Vorlagen findest du unter → Elemente Vorlagen

4. Setze den nicht wiederholenden Code außerhalb der PHP Tags.

→ > v5.0.0

5. Auf der jeweiligen Seite im VISION unter dem Code Icon → Verfügbare Elemente die erstellte Vorlage aktivieren und Elemente hinzufügen.

← > v5.0.0

Elementtypen richtig ausgeben

Elementtyp	Richtige PHP Ausgabe
CKEditor Text Textarea	`echo $row['value#'];` Textarea Tipp! Wenn man Zeilenumbrüche darstellen möchte, kann man die HTML-Entität durch `</br>` ersetzen. Zum Beispiel: `echo str_replace("& #10;", "<br>", $row->value["value#"]); // Leerzeichen zwischen '&' und '#' entfernen` Mit dieser Technik kann man den Text auch aufteilen und daraus ein Array erstellen. Die Möglichkeiten sind hier vielfältig.
Datum	`$date = strftime('%d. %B', strtotime($row['value#'])); echo $date;` Weitere Informationen zu den Parametern
Uhrzeit	`$time = strftime('%H:%M', strtotime($row['value#'])); echo $time . " Uhr";` Weitere Informationen zu den Parametern
Bild	→ < v5.2.2 `// Einzelnes Bild $image = unserialize($row['image']); $imageSrc = "template/elemente/" . $row['id'] . "/(original\|1200\|800\|400\|200)/" . $image[0]; echo "<img src='" . $imageSrc . "' alt='#####'>"; // Mehrere Bilder $imageArray = unserialize($row['image']); $imageArraySum = count($imageArray); for ($c = 0; $c < $imageArraySum; $c++) { $imageArraySrc = "template/elemente/" . $row['id'] . "/(original\|1200\|800\|400\|200)/" . $imageArray[$c]; echo "<img src='" . $imageArraySrc . "' alt='#####'>"; }` ← < v5.2.2 → > v5.2.3 // Einzelnes Bild $image = unserialize($row['image']); $imageSrc = "template/elemente/" . $row['id'] . "/(original\|1920\|1200\|800\|400\|200)/" . $image[0]; echo "<img src='" . $imageSrc . "' alt='#####'>"; // Mehrere Bilder $imageArray = unserialize($row['image']); $imageArraySum = count($imageArray); for ($c = 0; $c < $imageArraySum; $c++) { $imageArraySrc = "template/elemente/" . $row['id'] . "/(original\|1920\|1200\|800\|400\|200)/" . $imageArray[$c]; echo "<img src='" . $imageArraySrc . "' alt='#####'>"; } ← > v5.2.3
Datei Upload	`$fileSrc = "template/elemente/" . $row['id'] . "/" . $row['value#']; echo $fileSrc;`
Radio Button	`if($row['value#'] == 0) { // Wenn "Nein", dann ... } else { // Wenn "Ja", dann ... } //oder if($row['value#'] == 1) { // Wenn "Ja", dann ... } else { // Wenn "Nein", dann ... }`
Icon Auswahl	`echo "<i class='" . $row['value#'] . "'></i>";`
Interner Link	→ < v5.2.8 `$link = breadcrumb($row['value#']); echo $link;` ← < v5.2.8 → > v5.3.0 `$link = breadcrumb(intval($row->value#)); echo $link;` ← > v5.3.0
Interner & externer Link	`$link = getElementLink($row['value#']); echo $link;`
Button mit internem Link Button mit internem & externem Link	→ < v5.2.8 `$buttonText = elementGetButtonText($row['value#']); $buttonLink = breadcrumb(elementGetButtonLink($row['value#'])); echo "<a href='" . $buttonLink . "'>" . $buttonText . "</a>";` ← < v5.2.8 → v5.3.0-v5.3.2 `$buttonText = elementGetButtonText($row->value#); $buttonLink = breadcrumb(intval(elementGetButtonLink($row->value#))); echo "<a href='" . $buttonLink . "'>" . $buttonText . "</a>";` ← v5.3.0-v5.3.2 → > v5.3.3 `$buttonText = elementGetButtonText($row->value#); $buttonLink = elementGetButtonLink($row->value#); $buttonText = elementGetButtonText($row['value#']); $buttonLink = elementGetButtonLink($row['value#']); echo "<a href='" . $buttonLink . "'>" . $buttonText . "</a>";` ← > v5.3.3

Elementvorlage (Niclas)

<?php
$i = 0;
$query = <<<SQL
SELECT
    id,
    image,
    value1 AS headline
FROM
    texte_elemente
WHERE
    id_text='{$this->pageOptions["pageId"]}' AND
    typ='ElementTyp' AND
    showing='1' AND
    lan='{$this->pageOptions["language"]["lan"]}'
ORDER BY
    reihenfolge
SQL;
$result = cube_query($query); ?>
<?php while ($row = $result->fetch_object()) : ?>
    <?php $i++;
    // Einzelnes Bild
    $image = unserialize($row->image);
    $imageSrc = "template/elemente/{$row->id}/original/{$image[0]}";

    // Mehrere Bilder
    $imageArray = unserialize($row->image);
    $imageArraySum = count($imageArray);
    ?>
    <?php for ($c = 0; $c < $imageArraySum; $c++) : ?>
        <?php echo $imageArray[$c]; ?>
    <?php endfor ?>

    <h2><?php echo $row->headline ?></h2>
<?php endwhile ?>

Elementvorlage zusätzliche Values hinzufügen

1. Value in texteelemente hinzufügen

Z:\vision_alex_test\admin\module\textelemente.php

$result = cube_query("insert into texte_elemente(id,id_text,lan,typ,showing,topelement,image,slug,value1,value2,value3,value4,value5,value6,value7,value8,value9,value10,value11,value12,value13,reihenfolge,timestamp)

values('" . $next_id . "','" . $copy['id_text'] . "','" . $copy['lan'] . "','" . $copy['typ'] . "','" . $copy['showing'] . "','" . $copy['topelement'] . "','" . $copy['image'] . "','" . $copy['slug'] . "','" . $copy['value1'] . "','" . $copy['value2'] . "','" . $copy['value3'] . "','" . $copy['value4'] . "','" . $copy['value5'] . "','" . $copy['value6'] . "','" . $copy['value7'] . "','" . $copy['value8'] . "','" . $copy['value9'] . "','" . $copy['value10'] . "','" . $copy['value11'] . "','" . $copy['value12'] . "',,'" . $copy['value13'] . "','" . $copy['reihenfolge'] . "','" . $copy['timestamp'] . "')");

(Default in Zeile 150):

In der cube_query einen zusätzlichen value hinzufügen. z. B. value13.
Darunter unter den values z. B. " . $copy[value13] . " hinzufügen

2. Value in elemente_vorgaben erhöhen

Z:\vision_alex_test\admin\module\elemente_vorgaben.php

(Default in Zeile 33):

<?php
$value_anzahl = 13;

3. Definierten element_value Wert anpassen

Z:\vision_alex_test\admin\module\elemente\main.php

(Default in Zeile 2):

define("ELEMENT_VALUES", 13);

4. Zeilen in Datenbank hinzufügen

1. In der Datenbank im Projekt unter texte_elemente eine neue Spalte anlegen: (Name: value13, Typ: meistens text, Kollation:utf8mb3_bin)

2. In der Datenbank im Projekt unter texte_elemente_vorgaben eine zwei neue Spalten anlegen: (name13, varchar(255), utf8mb3_bin) und (feld13, varchar(255), utf8mb3_bin)

Deutsche Elemente duplizieren und Sprachbezeichnung ändern

Du hast alle Elemente erstellt und vergessen, dass das Projekt Mehrsprachigkeit haben muss? Hier ist die Lösung:

Installiere die gewünschte Sprache z.B. Englisch.
Erstelle ein Backup der Datenbank.
Exportiere die komplette Tabelle "texte_elemente".
Öffne die exportierte Datei und ersetze die Bezeichnung de in unserem Fall mit en.
Importiere die bearbeitete Datei.

Elemente innerhalb einer Sprache ausblenden

Elemente werden für alle Sprachen gleichzeitig ausgeblendet, mit diesem Snippet wird nur das ausgewählte Element ausgeblendet.

mysql_query("update texte_elemente set showing='" . $value . "' where lan='" . $_GET['kuerzel'] . "' and id='" . $_GET['showid'] . "'");
header('Location:textelemente.php?id=' . $_GET['id'] . '&kuerzel=' . $_GET['kuerzel'] . '&lastedit_typ=' . $_GET['lastedit_typ']);

→ > v5.0.0

Bekannte BUGS

Verrutschen einer Spalte in der Elementübersicht

Behoben ab Version 5.4

Z:\vision_alex_test\admin\module\textelemente.php

(Default in Zeile: ca. 428)

   if ($row_c['slug'] == 1) {
    echo '<th>URL</th>';
    }
    
   ersetzen durch
    
   if (explode(",", $row_c['slug'])[0] == 1) {
   echo '<th>URL</th>';
   }

Z:\vision_alex_test\admin\module\elemente\main_vorschau.php

(Default in Zeile: ca. 23)

Diesen Code durch fehlerhaften in Zeile 23 ersetzen:

echo ($row_c['slug'] ? '<td>' . getElementVorschauSEO($test['slug'], $value) . '</td>' : "");

ersetzen durch

echo (explode(",", $row_c['slug'])[0]  ? '<td>' . getElementVorschauSEO($test['slug'], $value) . '</td>' : "");

Elemente Loops

How 2 Loop

Elementvorlage erstellen
Loop über Testplugin benennen und neu speichern
HTML Tags davor und danach trennen und den Loop separieren
Values einsetzen (Value Definitionen sind im Testplugin Text unter Loop) d
* Achtung: Value 1 ist immer der Image-Tag!
Loop im Template einbetten mit loop:NameDesLoops_IdDesElementes
Element auf der entsprechenden Seite erstellen und Values ausfüllen

Value Definitionen

<div id="number_[[ID]]">
<div class="col-md-4">
  <value1><h1>[[value1]]</h1></value1>
    <value1_else><h1>Kein Inhalt</h1></value1_else>
<img src="[[value2_img400]]" class="img-responsive"/>
<a href="[[value3]]">[[value3]]</a><br/>

  
  <a href="[[value4_link]]">Hier kommt der Link</a><br/>
  [[value5]]
</div>
</div>

← > v5.0.0

Inhaltsverzeichnis