help.de.php
Hilfe zur Konfiguration: Text, der erläutert, was in den einzelnen Konfigurationsbereichen eingestellt und ausgewählt werden kann.
Dateiname: templates/krl-3col-flex/config/help.de.php
<?php
/*
* @category Template for CMSimple_XH Version 1.7+
* @package krl-3col-flex
* @version 3.2.2
* @file help.de.php | Hilfetext zur Konfiguration
* @last_modified 10.03.2024
* @author Karl Richard Lembach | https://lembach-cmsimple.de/?Home
* @copyright 2021 - 2024 Karl Richard Lembach <https://lembach-cmsimple.de>
* @license https://www.gnu.org/licenses/gpl-3.0 GNU GPLv3
* @link https://template.lembach-cmsimple.de/?Template-krl-3col-flex
* @contact https://lembach-cmsimple.de/?Home/Kontakt-Formular | webmaster@lembach-cmsimple.de
Dieses Programm ist freie Software.
Sie können es unter den Bedingungen der GNU General Public License, wie von der Free Software Foundation veröffentlicht,
weitergeben und/oder modifizieren, entweder gemäß Version 3 der Lizenz oder (nach Ihrer Option) jeder späteren Version.
Die Veröffentlichung dieses Programms erfolgt in der Hoffnung, daß es Ihnen von Nutzen sein wird, aber OHNE IRGENDEINE GARANTIE,
sogar ohne die implizite Garantie der MARKTREIFE oder der VERWENDBARKEIT FÜR EINEN BESTIMMTEN ZWECK. Details finden Sie in der GNU General Public License.
Sie sollten ein Exemplar der GNU General Public License zusammen mit diesem Programm erhalten haben. Falls nicht, siehe <https://www.gnu.org/licenses/gpl-3.0>.
Deutsche Übersetzung (kein rechtskräftiger Ersatz des Originals): http://www.gnu.de/documents/gpl.de.html
*/
$helptext = '
<div class="news">
<fieldset class="conf">
<legend class="shadow">'.$text['hilfezurkonfiguration'].'</legend>
<div class="confighelp">
<h6><a id="oben"></a><a href="#absatz1">'.$text["versioncheck"].'</a></h6>
<h6><a href="#absatz2">'.$text["switches"].'</a></h6>
<h6><a href="#absatz3">'.$text["footer_links"].'</a></h6>
<h6><a href="#columnwidth">'.$text["columnwidth"].'</a></h6>
<h6><a href="#absatz4">'.$text["maincolor"]. '</a></h6>
<h6><a href="#absatz5">' . $text["menucolor"] . '</a></h6>
<h6><a href="#absatz51">'.$text["colordefinition"]. '</a></h6>
<h6><a href="#absatz6">'.$text["headershiftimage"].'</a></h6>
<h6><a href="#absatz7">'.$text["headercrossfade"].'</a></h6>
<h6><a href="#absatz8">'.$text["headerslideshow"].'</a></h6>
<h6><a href="#absatz9">'.$text["headerslideshowbelow"]. '</a></h6>
<h6><a href="#absatz10">' . $text["translation"] . '</a></h6>
<h6><a href="#absatz11">' . $text["favicon_definition"] . '</a></h6>
<h5><a id="absatz1"></a>'.$text["versioncheck"].'</h5>
<p>Der Versions-Check zeigt zum einen die auf dem Server installierte Version des Templates und zum anderen die neueste online verfügbare Version des Templates an. Dabei wird die Downloadadresse als Link angegeben.</p>
<div class="imgR"><span class="bigger"><a href="#oben">_<span class="fa fa-chevron-up"></span>_</a></span></div>
<h5><a id="absatz2"></a>'.$text["switches"].'</h5>
<p>Die Silbentrennung (damit ist das Feature der modernen/neuen Browser zur automatischen Silbentrennung gemeint) kann im Editor über die Formatzuweisung für Bereiche (span), Absätze (p) und Blöcke (div) festgelegt werden. Über den Reiter <span class="Tab">Mehr</span> kann die Silbentrennung für ganze Seiten eingeschaltet werden. Hier in den Schaltereinstellungen kann dieses Feature für sämtliche Seiten, die mit diesem Template angezeigt werden, aktiviert werden.<br>Bei der Header-Gestaltung (Header = alles oberhalb der Brotkrümel-Navigationszeile) stehen fünf Varianten zur Auswahl:</p>
<ol>
<li>Kein Header: es werden weder ein Hintergrundbild, noch ein Logo und auch kein Motto-Text ausgegeben.</li>
<li>Im Hintergrund läuft ein sehr breites Bild von rechts nach links endlos durch (Bildhöhe am besten 300 Pixel, Bildbreite mehr als 4000 Pixel), dazu eignen sich am besten Bilder, die mit der Handy-Panoramafunktion aufgenommen wurden. Kein JS, nur CSS!<br>
Das Bild muss im Ordner ./userfiles/images oder einem Unterordner davon liegen. Der Ordner wird über eine Drop-Down-Liste ausgewählt. Das Bild wird dann über eine zweite Drop-Down-Liste ausgewählt.
In dieser Liste erscheinen nur Dateien mit einer der folgenden Erweiterungen: bmp gif jp2 jpg png tif tiff webp svg<br>Ist das Bild höher als 300 Pixel wird ein ca. 300 Pixel hoher Streifen aus der Bildmitte angezeigt.
Ist das Bild nicht breit genug, wird es auf gezoomt, dabei gehen aber wieder Teile der Bildhöhe verloren. Das bedeutet: falsche Bildabmessungen zerstören zwar nicht das Layout, es führt jedoch zu unschönen Effekten.
Hat man kein passendes Panoramabild, besorgt man sich am besten ein sehr großes Bild, aus dem man dann einen schmalen Streifen herausschneidet und das Ergebnis dann auf eine Höhe von 300 Pixeln skaliert.
Die Geschwindigkeit, mit der das Hintergrundbild durchläuft, kann zwischen 10 und 200 Pixeln pro Sekunde eingestellt werden.
Bei Werten unter 20 Pixel/Sekunde kann das Bild zu ruckeln beginnen, bei Werten über 100 Pixel/Sekunde kann einem Betrachter schwindlig werden.<br>Vor dem Hintergrundbild wird links oben ein Logo und rechts oben der Motto-Text angezeigt.
Die Logo-Datei muss sich im Images-Ordner des Templates oder einem der Ordner unter ./userfiles/images befinden. Die Logo-Grafik wirkt am besten, wenn es eine Grafik mit transparentem Hintergrund ist.
Dann kann das Hintergrundbild durch die transparent Farbhinterlegung durchscheinen. Ausgewählt wird sie über eine Drop-Down-Liste der Ordner und eine zweite Liste der Dateien.
Das Logo wird automatisch herunterskaliert (max. Breite: 576 Pixel, max. Höhe: 242 Pixel). Damit jedoch nicht unnötig große Bilder übertragen werden müssen, ist es sinnvoll, die Logo-Grafik in der Größe annähernd anzupassen.
Der Motto-Text ist auf max. 1152 Pixel Breite begrenzt, das entspricht etwa 50-51 Zeichen. Ist er so lange, dass er nicht mehr in eine Zeile passt, wird er automatisch umgebrochen.
Einen willkürlichen Zeilenumbruch erreicht man durch Eingabe des senkrechten Striches (| = AltGr + <) oder <br>. Einfache (′) oder doppelte (″) Anführungszeichen werden automatisch in ihre HTML-Entitäten &#039; und &quot; umgewandelt.
Der Motto-Text kann bis zu 6 Zeilen hoch sein. Ab der siebten Zeile verdrängt er die Brotkrümelnavigation nach unten. Die Textfarbe des Motto-Textes kann frei eingestellt werden oder die Akzentfarbe kann durch Knopfdruck übernommen werden.
Sowohl Logo als auch der Motto-Text werden mit einer frei wählbaren Farbe hinterlegt, deren Transparenzgrad einstellbar ist. Der Eckradius dieser Farbhinterlegung kann eingestellt werden.</li>
<li>Im Hintergrund läuft eine Überblendung (Crossfadingshow) von Bildern aus einem Unterordner von ./userfiles/images/. Kein JS, nur CSS!<br>Die Ordnerauswahl erfolgt wie unter 2. beschrieben.
Da die Hintergrundbilder nicht automatisch auf 1920 * 300 Pixel angepasst werden und in der Ebene vor dem Content der Website angezeigt werden, würden falsch dimensionierte Bilder den Content überdecken.
Demzufolge müssen diese Hintergrundbilder exakt 1920 Pixel breit und 300 Pixel hoch sein! Es werden nur Bilder mit den unter 2. genannten Erweiterungen angezeigt. Die Anzahl der angezeigten Bilder ergibt sich aus der Dateianzahl im Ordner.
Wie lange ein Bild angezeigt wird, bevor zum nächsten überblendet wird, kann zwischen 0,5 und 300 Sekunden, bei einer Schrittweite von 0,2 s, eingestellt werden. Wie schnell die Überblendung erfolgt, kann ebenfalls eingestellt werden.
Dieser Wert ist ein relativer Wert (langsam = 1, schnell = 10), da er zum einen von der Bilderanzahl und zum anderen von der Anzeigedauer abhängt. Hier ist einfaches Ausprobieren der beste Weg.<br>
Bei Logo, Motto-Text, Textfarbe, Hintergrundfarbe und Eckradius erfolgt die Einstellung wie unter 2. beschrieben.</li>
<li>Dieser Header verwendet das Plugin Slideshow. Geschwindigkeit und Effekte werden also in den Einstellungen des Plugins festgelegt. Für die Slideshow muss JS im Browser aktiv sein. Bilderabmessung: 1920 * 300 Pixel.
Alle JPEG, PNG und GIF Bilder im ausgewählten Ordner werden für die Diashow verwendet. Es müssen sich mindestens zwei Bilder in diesem Ordner befinden. Existieren ebenfalls *.webp Bilder mit demselben Basisnamen wie ein erkanntes Bild, werden diese stattdessen verwendet, falls der Browser WebP unterstützt. <br>
Im Hintergrund läuft also die Slideshow. Davor ist das Logo und der Motto-Text zu sehen. Für den Bilderordner, Logo, Motto-Text, Textfarbe, Hintergrundfarbe und Eckradius erfolgt die Einstellung wie unter 2. beschrieben.</li>
<li>Dieser Header verwendet ebenfalls das Plugin Slideshow. Siehe dazu also unter 4.<br>Hier wird jedoch das Logo und der Motto-Text oberhalb der Slideshow angezeigt, wodurch der Header deutlich höher als bei den anderen Varianten ist.
Das Logo wird hier auf 576 Pixel Breite und 259 Pixel Höhe begrenzt.<br>Ansonsten ist alles wie bei der Variante 4.</li>
</ol>
<div class="imgR"><span class="bigger"><a href="#oben">_<span class="fa fa-chevron-up"></span>_</a></span></div>
<h5><a id="absatz3"></a>'.$text["footer_links"].'</h5>
<p>Es gibt hier drei Gruppen von Links:</p>
<ol style="list-style-type: upper-roman;">
<li>Die obligatorischen Links auf die internen Seiten für Kontakt, Datenschutz und Impressum.</li>
<li>Die optionalen Links auf (wenn vorhanden) eigene andere Websites.</li>
<li>Weitere Links zum Hoster, Sponsor und W3C CSS Validator.</li>
</ol>
<p>Damit diese Konfigurationsseite nicht zu voll dargestellt wird, sind die beiden ersten Gruppen erst einmal ausgeblendet. Eingeblendet werden sie durch Klicken auf die Gruppenüberschrift.</p>
<h6>Obligatorische Links auf interne Seiten</h6>
<p>Es dreht sich um die Links zu den Seiten Kontakt, Datenschutz und Impressum. Es gibt jeweils zwei Möglichkeiten den Link festzulegen:</p>
<ol>
<li>Auswahl aus einer Drop-Down-Liste aller existierender Seiten (d.h. die Seite muss zu diesem Zeitpunkt schon existieren) oder</li>
<li>Eingabe der Adresse gemäß der Seitenstruktur von Hand (die Seite muss nicht unbedingt schon existieren, es muss nur feststehen wo in der Seitenstruktur die Seite platziert werden wird).</li>
</ol>
<p>Wird die Adresse von Hand eingegeben, ist nur der Teil der Adresse einzugeben, der nach dem Fragezeichen in der Adresse steht! Also nicht https://meinedomain.de/?Home/Kontakt sondern nur Home/Kontakt!</p>
<p>Dieser Bereich kann entweder durch Klicken auf "Bereich schließen <span class="fa fa-minus-circle"></span>" zugeklappt werden oder durch Absenden eine Eingabe in einem anderen Bereich.</p>
<h6>Optionale Links zu weiteren eigenen Websites</h6>
<p>Hier können bis zu 5 Links zu anderen eigenen Websites definiert werden. Die Eingabemaske zum 2. Link erscheint erst, wenn im ersten Link die URL definiert wurde.
Die dritte Maske erscheint erst wenn im 2. Link die URL definiert wurde, und so weiter. Die Gültigkeit der URL wird nicht (ausdrücklich: <span style="color: #ff0000;">NICHT</span>) überprüft.
Daher sollte sie in jedem einzelnen Fall aus der Adresszeile des Browsers (mit der erfolgreich aufgerufenen Website im Fenster) kopiert werden!<br>
Der Text für das Titel-Attribut und den Text, der als Link fungiert, kann man frei eingeben.
HTML-kritische Zeichen werden automatisch in ihre HTML-Entitäten umgewandelt. Daher sollte es keine Probleme durch die eingegebenen Texte geben.</p>
<h6>Optionale Links zu Fremdseiten</h6>
<p>Schließlich gibt es noch die Möglichkeit je einen Link zum Webhoster und zu einem evtl. vorhandenen Sponsor zu definieren.<br>Dies ist als eine Art Dank / Lob / Anerkennung gedacht. Beide Links erscheinen in einer eigenen Zeile für sich alleine.</p>
<p>Und dann gibt es noch die Möglichkeit einen Link zur CSS-Validierung einzublenden. (Irgend wann wird das Template ja mal frei von CSS-Fehlern sein <img src="http://localhost:88/plugins/tinymce4/tinymce/plugins/emoticons/img/smiley-wink.gif" alt="wink">.)</p>
<div class="imgR"><span class="bigger"><a href="#oben">_<span class="fa fa-chevron-up"></span>_</a></span></div>
<h5><a id="columnwidth"></a>'.$text["columnwidth"].'</h5>
<p>Die Breite der Webseite ist in drei Spalten aufgeteilt. Unter bestimmten Umständen werden die Beiden rechten Spalten zu einer Spalte zusammengefasst.<br>
Die Breite dieser drei Spalten beträgt jeweils ein ganzzahliges Vielfaches von 1/24 der Seitenbreite.</p>
<p>Alle drei Spalten zusammen haben also eine Breite von 24/24.<br>
Damit der Webmaster die Spaltenbreite ohne Eingriff in die Template-Datei flexibel gestalten kann, gibt es hier fünf vorbereitete Breitenverteilungen unter denen ausgewählt werden kann:</p>
<ol>
<li>Menü 3/24 - Content 15/24 - News 6/24</li>
<li>Menü 4/24 - Content 15/24 - News 5/24</li>
<li>Menü 5/24 - Content 14/24 - News 5/24</li>
<li>Menü 5/24 - Content 16/24 - News 3/24</li>
<li>Menü 6/24 - Content 12/24 - News 6/24</li>
</ol>
<div class="imgR"><span class="bigger"><a href="#oben">_<span class="fa fa-chevron-up"></span>_</a></span></div>
<h5><a id="absatz4"></a>'.$text["maincolor"].'</h5>
<p>Dieses Template hat eine Reihe von Gestaltungselementen die die gleiche Farbe haben.
Dies sind unter anderen der Hintergrund hinter der Website (nur zu sehen, wenn die Viewport-Breite in Wirklichkeit oder durch Verkleinern der Website (Zoom < 100%) größer als 1920 Pixel ist),
die horizontalen Linien und Leisten im Header und Footer Bereich, die Brotkrümelnavigation mit Suche, Schriftgrößenänderung und "zuletzt geändert" Link, das <hr> Element, horizontale Linien bei der Fußnotendarstellung ...<br>
Das ist die Hauptfarbe oder neudeutsch Maincolor oder Akzentfarbe. Den Default-Wert dieser Farbe (er gilt dann als Grundeinstellung für alle Seiten, die mit diesem Template angezeigt werden) kann man hier ohne Eingriff in eine Datei einstellen.
Bei sehr breiten Viewports (mehr als 1920 Pixel) hat der Hintergrund des Templates einen Farbverlauf. In der Mitte über bis zu 1920 Pixel ist die Hintergrundfarbe (Maincolor) komplett undurchsichtig.
Von dort nach außen, zu den seitlichen Rändern hin gestaltet sich der Farbverlauf dadurch, dass die Hintergrundfarbe in einem einstellbaren Maße durchsichtig wird.
Damit dies auch bei kleineren Bildschirmen eingestellt werden kann, gibt es eine kleine Vorschau.</p>
<div class="imgR"><span class="bigger"><a href="#oben">_<span class="fa fa-chevron-up"></span>_</a></span></div>
<h5><a id="absatz5"></a>'.$text["menucolor"]. '</h5>
<p>Das Menü hat eine eigene Hintergrundfarbe. Nicht aktive Elemente (also die Mehrheit) haben die mittlere Helligkeit, der aktive Menüpunkt ist etwas dunkler und das Element unter der Maus ist etwas heller.
Der Helligkeitsunterschied beträgt zwischen den Stufen #222222. Eingestellt wird die Hover-Farbe, also die hellste der drei.</p>
<p>Um einen minimalen Helligkeitsunterschied zur weißen Schriftfarbe sicherzustellen ist die Helligkeit nach oben auf #DDDDDD beschränkt.
Damit die Hintergrundfarbe des aktiven Menüpunktes nicht dunkler als schwarz wird (#000000) ist die Hoverfarbe nach unten auf #444444 begrenzt.
Diese Begrenzung nach oben und unten ist für jede der drei Teilfarben festgelegt (also #DD und #44).</p>
<div class="imgR"><span class="bigger"><a href="#oben">_<span class="fa fa-chevron-up"></span>_</a></span></div>
<h5><a id="absatz51"></a>'. $text["colordefinition"]. '</h5>
<p>Für jede im Template als Variable definierte Farbe, die nicht unter den beiden zuvor beschriebenen Punkten eingestellt werden kann, kann in dieser Liste der Wert der Farbe und der Wert der Transparenz eingestellt werden.
Die in den Labels angezeigten Werte sind die momentan gespeicherten Werte! Sie werden erst nach Abschicken des Formulars aktualisiert.
D.h. unmittelbar nach Änderung eines der Werte (vor dem Abschicken des Formulars) weichen der im Label angezeigte Wert von dem im Farbfeld / Transparenzgleiter angezeigten Wert ab.<br>
Damit man hier die Möglichkeit hat an der Farbe "herumzuspielen", sind diese Eingabefelder nicht onchange-aktiv, sondern benötigen das Abschicken mit dem "Eingabe absenden" - Button auf der rechten Seite.<br>
Eine kurze Information wo und wofür die jeweilige Farbe verwendet wird, wird angezeigt, wenn man mit der Maus den Infopunkt der jeweiligen Farbe hovert.</p>
<div class="imgR"><span class="bigger"><a href="#oben">_<span class="fa fa-chevron-up"></span>_</a></span></div>
<h5><a id="absatz6"></a>'.$text["headershiftimage"].'</h5>
<p>Im Hintergrund läuft ein sehr breites Bild von rechts nach links endlos durch (Bildhöhe am besten 300 Pixel, Bildbreite mehr als 4000 Pixel), dazu eignen sich am besten Bilder,
die mit der Panoramafunktion aufgenommen wurden oder mit entsprechenden Tools zusammengesetzt wurden.
Für das durchlaufende Bild wird kein JS eingesetzt, nur CSS!<br>Das Bild muss im Ordner ./userfiles/images oder einem Unterordner davon liegen. Der Ordner wird über eine Drop-Down-Liste ausgewählt.
Das Bild wird dann über eine zweite Drop-Down-Liste ausgewählt.
In dieser Liste erscheinen nur Dateien mit einer der folgenden Erweiterungen: bmp gif jp2 jpg png tif tiff webp svg<br>Ist das Bild höher als 300 Pixel wird ein ca. 300 Pixel hoher Streifen aus der Bildmitte angezeigt.
Ist das Bild nicht breit genug, wird es auf gezoomt, dabei gehen aber wieder Teile der Bildhöhe verloren. Das bedeutet: falsche Bildabmessungen zerstören zwar nicht das Layout, es führt jedoch zu unschönen Effekten.
Hat man kein passendes Panoramabild, besorgt man sich am besten ein sehr großes Bild, aus dem man dann einen schmalen Streifen herausschneidet und das Ergebnis dann auf eine Höhe von 300 Pixeln skaliert.<br>
Die Geschwindigkeit, mit der das Hintergrundbild durchläuft, kann zwischen 10 und 200 Pixeln pro Sekunde eingestellt werden.
Bei Werten unter 20 Pixel/Sekunde kann das Bild zu ruckeln beginnen, bei Werten über 100 Pixel/Sekunde kann einem Betrachter schwindlig werden.
Auf Grund der gewählten Geschwindigkeit und der Bildbreite ergibt sich die Zeit für einen kompletten Durchlauf.
Diese Zeit wird angezeigt.<br>Vor dem Hintergrundbild wird links oben ein Logo und rechts oben der Motto-Text angezeigt, beide mit einer transparenten Farbhinterlegung.
Die Logo-Datei muss sich im Images-Ordner des Templates oder einem der Ordner unter ./userfiles/images befinden.
Die Logo-Grafik wirkt am besten, wenn es eine Grafik mit transparentem Hintergrund ist. Dann kann das Hintergrundbild durch die transparent Farbhinterlegung durchscheinen.<br>
Ausgewählt wird das Logo über eine Drop-Down-Liste der Ordner und eine zweite Liste der Dateien.
Es ist allerdings auch möglich "- show no logo -" auszuwählen um kein Logo anzuzeigen. <br>Das Logo wird automatisch herunterskaliert (max. Breite: 576 Pixel, max. Höhe: 242 Pixel).
Damit jedoch nicht unnötig große Bilder übertragen werden müssen, ist es sinnvoll, die Logo-Grafik in der Größe annähernd anzupassen. <br>
Der Motto-Text ist auf max. 1152 Pixel Breite begrenzt, das entspricht etwa 50-51 Zeichen. <br>Wird kein Text eingegeben, wird auch die Farbhinterlegung des Textes nicht angezeigt.<br>
Ist der Text so lang, dass er nicht mehr in eine Zeile passt, wird er automatisch umgebrochen.
Einen willkürlichen Zeilenumbruch erreicht man durch Eingabe des senkrechten Striches (| = AltGr + <) oder <br>. <br>
Einfache (′) oder doppelte (″) Anführungszeichen werden automatisch in ihre HTML-Entitäten &#039; und &quot; umgewandelt.<br>
Der Motto-Text kann bis zu 6 Zeilen hoch sein. Ab der siebten Zeile verdrängt er die Brotkrümelnavigation nach unten. <br>
Die Textfarbe des Motto-Textes kann frei eingestellt werden oder die Akzentfarbe kann durch Knopfdruck übernommen werden.<br>
Sowohl Logo als auch der Motto-Text werden mit einer frei wählbaren Farbe hinterlegt, deren Transparenzgrad einstellbar ist.<br>
Der Eckradius dieser Farbhinterlegung kann ebenfalls eingestellt werden.</p>
<div class="imgR"><span class="bigger"><a href="#oben">_<span class="fa fa-chevron-up"></span>_</a></span></div>
<h5><a id="absatz7"></a>'.$text["headercrossfade"].'</h5>
<p>Im Hintergrund läuft eine Überblendung (Crossfadingshow) von Bildern aus einem Unterordner von ./userfiles/images/.
Für diesen Effekt ist kein JS notwendig, er wird alleine mit mit CSS realisiert! Notwendige Bildgröße: 1920 * 300 Pixel.<br>
Die Ordnerauswahl erfolgt wie oben beschrieben aus einer Drop-Down-Liste.
Da die Hintergrundbilder nicht automatisch auf 1920 * 300 Pixel angepasst werden und in der Ebene vor dem Content der Website angezeigt werden, würden falsch dimensionierte Bilder den Content (insbesondere das Menü) überdecken.
Demzufolge müssen diese Hintergrundbilder exakt 1920 Pixel breit und 300 Pixel hoch sein! Es werden nur Bilder mit folgenden Erweiterungen angezeigt: bmp gif jp2 jpg png tif tiff webp svg.<br>
Die Anzahl der angezeigten Bilder ergibt sich aus der Dateianzahl im Ordner. <br>
Wie lange ein Bild angezeigt wird, bevor zum nächsten überblendet wird, kann zwischen 0,5 und 300 Sekunden eingestellt werden, mit einer Schrittweite von 0,2 s.<br>
Wie schnell die Überblendung erfolgt, kann ebenfalls eingestellt werden.
Dieser Wert ist ein relativer Wert (langsam = 1, schnell = 10), da er zum einen von der Bilderanzahl und zum anderen von der Anzeigedauer abhängt. Hier ist einfaches Ausprobieren der beste Weg.<br>
Die sich aus diesen Einstellungen ergebenden Zeiten für Einblenddauer, Durchlaufzeit und Überblendzeit werden angezeigt.<br>
Bei Logo, Motto-Text, Textfarbe, Hintergrundfarbe und Eckradius erfolgt die Einstellung wie zuvor unter "'.$text["headershiftimage"].'" beschrieben.</p>
<div class="imgR"><span class="bigger"><a href="#oben">_<span class="fa fa-chevron-up"></span>_</a></span></div>
<h5><a id="absatz8"></a>'.$text["headerslideshow"].'</h5>
<p>Dieser Header verwendet das Plugin Slideshow. Geschwindigkeit und Effekte werden also in den Einstellungen des Plugins festgelegt.
Für die Slideshow muss JS im Browser aktiv sein. Bilderabmessung: 1920 * 300 Pixel.
Alle JPEG, PNG und GIF Bilder im ausgewählten Ordner werden für die Diashow verwendet.
Es müssen sich mindestens zwei Bilder in diesem Ordner befinden. Existieren ebenfalls *.webp Bilder mit demselben Basisnamen wie ein erkanntes Bild, werden diese stattdessen verwendet, falls der Browser WebP unterstützt.<br>
Im Hintergrund läuft also die Slideshow. Davor ist das Logo und der Motto-Text zu sehen.
Die Einstellung für den Slideshow-Bilderordner, das Logo, den Motto-Text, die Textfarbe, die Hintergrundfarbe und den Eckradius erfolgt wie unter "'.$text["headershiftimage"].'" beschrieben.</p>
<div class="imgR"><span class="bigger"><a href="#oben">_<span class="fa fa-chevron-up"></span>_</a></span></div>
<h5><a id="absatz9"></a>'.$text["headerslideshowbelow"].'</h5>
<p>Dieser Header verwendet ebenfalls das Plugin Slideshow. Mehr dazu siehe also unter "'.$text["headerslideshow"].'".<br>
Hier wird jedoch das Logo und der Motto-Text oberhalb der Slideshow angezeigt, wodurch der Header deutlich höher als bei den anderen Varianten ist.
Das Logo wird hier auf 576 Pixel Breite und 259 Pixel Höhe begrenzt, kann also ein paar Pixel höher sein als bei den anderen Varianten.<br>Ansonsten ist alles wie bei der Variante "'.$text["headerslideshow"]. '".</p>
<div class="imgR"><span class="bigger"><a href="#oben">_<span class="fa fa-chevron-up"></span>_</a></span></div>
<h5><a id="absatz10"></a>' . $text["translation"] . '</h5>
<p>Mit diesem Konfigurationspunkt können Übersetzungen der im Template verwendeten (deutschen) Texte in die gewünschte neue Sprache übertragen werden oder bestehende Übersetzungen korrigiert werden.
Gibt es bisher keine Sprachdatei in der gewünschten Sprache, werden die Felder der neuen Sprache zuerst einmal mit den deutschen Texten gefüllt (damit in der neuen Sprache auf jeden Fall ein Text ausgegeben wird,
auch wenn er noch nicht übersetzt wurde).<br>
Unter der ersten Ausklappzeile verbirgt sich eine Radiobuttonliste mit der TLD-Endung und der Flagge des Landes, das für die gewünschte Zielsprache steht.
Ist die gewünschte Sprache in dieser Liste nicht enthalten (in CMSimple_XH gibt es dann dafür auch keine Sprachdatei), kann man unten die TLD eingeben.
Alle Eingaben sind onchange-aktiv.<br>Unter der zweiten Ausklappzeile verbirgt sich ein Hinweistext, warum die Verwendung des Apostrophs vermieden werden sollte.
HTML-Tags werden in nicht wirkenden Text umgewandelt. Ausnahme: < b r > und < b ><br>
Insbesondere dürfen bei den Text-Array-Elementen mit den Schlüsseln <b>colordefinition, columnwidth, footer_links, headercrossfade, headershiftimage, headerslideshow,
headerslideshowbelow, maincolor, menucolor, switches, translation und versioncheck</b> auf keinen Fall Apostrophs oder sonstige HTML-Entitäten verwendert werden!<br>
Darunter wird eine dreispaltige Tabelle ausgegeben. Diese enthält links den Schlüssel des Array-Elementes, in der Mitte den deutschen Text und rechts das Eingabefeld für die Übersetzung.<br>
Alle Textfelder in der neuen Sprache, in die noch keine Übersetzung eingegeben wurde, werden hellgelb hinterlegt.</p>
<div class="imgR"><span class="bigger"><a href="#oben">_<span class="fa fa-chevron-up"></span>_</a></span></div>
<h5><a id="absatz11"></a>' . $text["favicon_definition"] . '</h5>
<p>Die Konfiguration der favicon.php erleichtert es ein Auswahl an Icons zusammenzustellen, die vom Template an den Browser übergeben wird (<link rel....).
Hat man noch keine vollständigen Satz an Icons, kann man dem Link zu einem Online-Generator für Icons folgen.
Dazu ist natürlich eine fertige Grafik als Vorlage der Icons notwendig, die man zum Generator hochladen muß.
Es gibt auch einen Link zu von mir erstellten Bedinungshinweisen.<br>Das Tool geht davon aus, das die Icons im Ordner /templates/krl-3col-flex/images/favicon/ liegen.
Findet es dort keine Dateien, bietet es eine Eingabe für einen alternativen Ordner an.<br>
Die gefundenen Dateien werden in der rechten Spalte aufgelistet und mit Check-Boxen zur Auswahl angeboten.
Es gibt auch Check-Boxen zur Auswahl oder Abwahl aller Dateien. Bei Dateien, die (von PHP) als Grafiken erkannt werden, wird deren Größe angezeigt.
Für Dateien, deren Namen mit einem der folgenden Texten beginnt, gibt es vorgefertigte Schamata für den Text des Links.
<br><b>android-chrome... apple-touch-icon... favicon... mstile... favicon... safari-pinned-tab... browserconfig...</b>
<br>Für folgende Dateierweiterungen gilt das gleiche: <b>...webmanifest ...ico ...xml</b>
<br>Bei allen anderen Dateien wird verfahren wie bei favicon... Bei den Zeilen diesen Dateien in der favicon.php gibt es evtl. Nachbesserungsbedarf "von Hand".
<br>Da für manche Geräte/Betriebssysteme/Programme eine zusätliche Hintergrund- /Rahmen- /Kontrastfarbe angegeben werden kann, gibt es dafür die Möglichkeit eine Farbe festzulegen.
<br>Nachdem man eine Auswahl / Farbfestlegung getroffen hat, wird unter der Dateiliste eine Vorschau des zukünftigen Inhaltes der favicon.php angezeigt.
<br>Klickt man nun auf "Datei speichern" wird die favicon.php geschrieben. Die Seite wird neu geladen und oben die Bestätigungsmeldung angezeigt.
Jetzt werden automatisch alle Auswahlen und Festlegungen gelöscht und die Seite erneut geladen.</p>
<div class="imgR"><span class="bigger"><a href="#oben">_<span class="fa fa-chevron-up"></span>_</a></span></div>
</div>
</fieldset>
</div>';
echo $helptext;