BASE (Mobile First) Hilfe

Das Weblic® Kategorienfilter kann mehrstufig verwendet werden. Dieses Beispiel wendet die Standard-Kategoriendatei an, die mit dem Projekt installiert wird. Eine Liste soll zunächst nach Einträgen nach Kategorien der 1. Ebene und weiter nach Kategorien der 2. Ebene gefiltert werden.

Bei eingebetteten Bildern wird der abgeschnittene Bereich mit einer weißen Farbe aufgefüllt. Diese Hintergrundfarbe können Sie individuell festlegen.

Um beim Einsatz des Kategorienfilter Weblics® nach Auswahl einer Kategorie und Neuladen nicht immer am Seitenanfang zu landen, nutzen Sie am besten einen Anker.

Seitenverhältnisse für Bilder auf Desktop-Ansicht können auf mobilen Endgeräten unvorteilhaft sein. Dies können Sie über die entsprechende Untervariante für das Seitenverhältnis beeinflussen.

Mit der aktuellen BASE stehen ab CMS-Version 17 mehrere Varianten für den Öffner der Menü-Navigation zur Auswahl.

Über den Lightbox-Type "inline" können Sie die Lightbox mit individuellen Informationen füllen.

Seitenverhältnisse für Bilder auf Desktop-Ansicht können auf mobilen Endgeräten unvorteilhaft sein. Dies können Sie über die entsprechende Untervariante für das Seitenverhältnis beeinflussen.

Mit der Untervariante 510 des Inhaltsbereich Weblic® können Sie den kompletten Inhaltsbereich ausblenden, wenn die Bildschirmauflösung der definierten Breite entspricht.

So können Sie einstellen, dass onClick zu dem ImageMap-Marker oder den jeweiligen Label gescrollt wird.

Um Vorschaubilder innerhalb des Banners zu verwenden, genügt es, die Listenerweiterung listEntryExtensionThumbnailAsPicture einzubinden

Über den Layout-Wizard können Sie ein Hintergrundbild der Seite definieren. Soll nicht immer das gleiche Bild erscheinen und auch nicht manuell ausgetauscht werden, stehen Ihnen unterschiedliche Möglchkeiten zur Verfügung.

Die Größe der Schrift legen Sie im BASE Projekt an zentraler Stelle fest.

Abhängig davon, ob eine Liste Inhalte hat, lassen sich Inhalte ein- bzw. ausblenden. So können Sie z.B. die Listenüberschrift ausblenden, wenn die Liste selbst keine Inhalte hat oder statt dessen einen globalen, alternativen Inhalt einblenden.

Die Menü-Navigation (Toggler-Navigation) lässt sich komfortabel über eine Pflegemaske individuell anpassen.

Tabellenzeilen, Tabellenspalten und Tabellenzellen können mit einer individuellen Klasse versehen werden, um diese über CSS zu formatieren.

Die Bearbeitungsmöglichkeiten für Links können Sie komfortabel über CSS-Only-Eigenschaften erweitern.

In Weblication® kann über eigene Weblication® Techniken in Verbindung mit der BASE (Mobile First) JavaScript direkt in CSS eingebettet werden.

Innerhalb der Seitenbearbeitung können Sie zeitgesteuerte Strukturelemente mit einer eigenen Formatierung (z.B. Hintergrundfarbe) deutlicher hervorheben.

Über den Objekt-Wizard werden Texte aus den Objektdaten meist über das Element "Objektdaten ausgeben" ausgegeben

Am Beispiel des Glossar Weblics® wird vereinfacht aufgezeigt, wie Sie die Templates und Masken der Anwendung für einen andren Bereich kopieren und nutzen können.

Weblication® unterstützt Google Analytics 4 (GA4) ab der BASE unter CMS-Version 15.

Der Mini-Shop ist in aktueller Version mit dem Objekt-Wizard umgesetzt. Dies ermöglicht eine individuelle Anpassung auf die jeweiligen Bedürfnisse des Shop-Betreibers.

Neben den vordefinierten Link-Icons können Sie auch eigene SVG-Icons zum Dekorieren von Links auswählen. Dazu muss die CSS-Only Einstellung -w-editmaskExtended-icon:yes; gesetzt sein.

Listen lassen sich über AJAX aktualisieren und dabei die Parameter anpassen. Mit diesem Prinzip sind auch benutzerabhängige Filter umsetzbar bei denen die Liste durch die Benutzerangabe aktualisiert wird. In folgendem Beispiel kann ein Besucher einen Filter bzw. einen Suchbegriff in ein Eingabefeld eingeben und so die Liste filtern.

Die Listen-Variante 20100 (Darstellung über Objekt-Wizard) lässt sich über die Listenoptionen unterschiedlich ausrichten bzw. darstellen.

Die IDE von Weblication® CMS erlaubt den Abgleich von Layout-Dateien zu früheren Versionen bzw. auch zur aktuellen Version des Weblics-Servers.

Den Inhalt von Containertabs können Sie bei Aufruf ausblenden, um diesen erst nach Klick auf ein Register anzeigen zu lassen.

Um einzelne Wörter im Link-Text hervorzuheben, können Sie mit aktuellstem Link-Weblic® auf eine CSS-Only-Eigenschaft zurückgreifen.

Über das Bild-Element können Sie für SVG-Grafiken bzw. Icons spezielle CSS-Only-Varianten verwenden.

Tabellen lassen sich auf kleinen Bildschirmen, wie z.B. auf Smartphones, über CSS anders darstellen.

Das Facebook-Pixel können Sie als Analysetool zur Messung der Wirksamkeit einer Werbung einsetzen.

Das Weblic® für die Listen Blätterfunktion zwischen verschiedenen Listeneinträgen kann in aktueller Version um eine Positionsanzeige ergänzt werden.

Über den Objekt-Wizard lassen sich bereits im Standard viele Elemente / Weblics® nutzen, um Objektdaten als Werte zu übergeben und auszugeben.

Eine Möglichkeit zum Anmelden und Abmelden in Benutzer Portalen sollte an zentraler Stelle vorgenommen werden.

Um Seitenbesuchern auch bei einer Kontaktanfrage die Möglichkeit zu geben, sich beim Newsletter anzumelden, ist lediglich das Formular entsprechend zu erweitern.

Mit iOS 14 ergibt sich im Browser ein geändertes Verhalten z.B. in Bezug auf Hintergrundbilder mit Parallax-Effekt.

Die Menünavigation (Toggler-Navigation) kann über den Layoutwizard hinsichtlich des Einfahr-Verhaltens eingestellt werden.

Um Verweise innerhalb des BASE Projektes hervorzuheben und passend zum Link-Ziel zu gestalten, liegt der Einsatz von Grafiken nahe.

Die Umsetzung von Projekten erfordert teilweise unterschiedliche Farben in den Projekten. Dies kann z.B. für Sprachprojekte und Multi-Projekte erforderlich sein oder auch zur Umsetzung anderer alternative Darstellungen (Kontrastanpassung, Farbgebung, etc.).

Aktuelle Meldungen werden in der Regel mit einem Datum (z.B. Veröffentlichungsdatum) ausgeben, wozu das Format des Datums für die Detailseiten-Ausgabe allgemein definiert werden kann.

Aktuelle Meldungen werden in der Regel mit einem Datum (z.B. Veröffentlichungsdatum) ausgeben, wozu das Format des Datums über die Darstellungsvariante allgemein definiert werden kann.

Das Überschriften Weblic® ermöglicht in aktuellen Versionen bereits die Nutzung eigener Pflegemasken zu Untervarianten.

Das Listen Weblic® unterstützt in aktueller Version seit CMS-Version 014.004.041.00 die Möglichkeit, eigene Pflegemasken für Untervarianten zu nutzen.

Das Inhaltsbox Weblic® beinhaltet schon im Standard zu diversen Hauptvarianten Umsetzungen mit eigenen Pflegemasken von Untervarianten.

Weblication® CMS liefert Ihnen seit der BASE Classiv vielfältige Möglichkeiten, rein über CSS nicht nur Formatierungen vorzunehmen, sondern darüber hinaus auch unterschiedliche Bearbeitungsmasken und vieles mehr umzusetzen. Wir nennen es CSS-Only.

Die Darstellung über CSS lässt sich abhängig davon definieren, ob man sich im Editor, also Bearbeitungsmodus, befindet, oder im Frontend.

Über die CSS-Only Definitionen lässt sich festlegen, dass beim Eintragen eines Links abhängig von der URL das Icon für externe Links und auch das Ziel automatisch ausgewählt wird.

Abhängig von der Hintergrundfarbe bietet es sich oft an, die Farbe der Menünavigation (Navigationstoggler) anzupassen.

Navigationsbeispiele erleichtern Ihnen die Umsetzung Ihrer aktuellen und künftigen Projekte.

Das Weblic® Kategorienfilter ermöglicht eine komfortable Filterung von Dateien nach unterschiedlichen Kategorien. Am Beispiel des Veranstaltungskalenders wird der Einsatzzweck nachfolgend aufgezeigt.

Über einen Header-Eintrag kann verhindert werden, daß Ihre Webseite in einem Frame oder iFrame auf externen / fremden Webseiten dargestellt werden kann.

Ein Datei-Upload Formularfeld mit aktiviertem Mehrfachuploader kann hinsichtlich der Hinweistexte zum Inhalts- bzw. Sprachprojekt individuell definiert werden.

Listen unterstützen bereits im Standard Lazy Loading, um Bilder erst zu laden, wenn diese sich im Anzeigebereich befinden. Besonders bei kleinen Bildschirmen in Verbindung mit langen Listen, die Vorschaubilder enthalten, lässt sich die übertragene Datenmenge so teilweise deutlich reduzieren.

Das Weblic® Interaktive ImageMap unterstützt im Standard (Oktober 2022) Lazy Loading. Bilder, die in dem Erklärbild für die Marker als Vorschaubild definiert wurden, werden erst geladen wenn der Benutzer den zugehörigen Button aktiviert.

Beim Einsatz von Google Maps können Sie auch individuelle Styles, z.B. von snazzymaps.com nutzen.

Objektdaten, wie z.B. bei aktuellen Meldungen im Einsatz, können bei Bedarf über den Struktureditor positioniert werden.

Für das Einbinden von Inhalte externer Webseiten stehen Ihnen in der BASE entsprechende Weblics® / Strukturelemente zur Verfügung.

Semantische Bereiche einer Webseite dienen der genaueren Definition von Inhalten.

Weblication® Version 14 ist mit einer weiteren Option ausgestattet, die dem Besucher die Sicherheit gibt, nicht automatisch Daten an Drittanbieter zu senden, ohne dass Sie als Entwickler auf den Einsatz externer Schriften, dynamischer Karten oder eingebundener Videos verzichten müssen.

Eine Vielzahl an Webseiten nutzt im Standard einen hellen Hintergrund mit schwarzer oder dunkler Schrift. Soll das Projekt einen dunklen Hintergrund und helle Schriftfarbe haben, sind die entsprechenden Farbvariablen anzupassen.

Das Hochstellen von Sonderzeichen können Sie über die allgemeinen Einstellungen der Darstellungsvariante für die Überschrift festlegen.

Die Darstellungsvariante für die Überschrift ermöglicht diverse allgemeine Einstellungen.

Banner-Elemente müssen je nach Umsetzung und Inhalten die unterschiedlichen Bildschirmgrößen der Clients berücksichtigen, damit alle Inhalte des Banners (z.B. InfoLayer Texte, etc.) optimal dargestellt werden.

Zu News-Objekten kann optional ein Zurück-Link auf der Detail-Seite genutzt werden.

Neben den vielfältigen Möglichkeiten, Inhalte von Dateien über Weblication Listen auszugeben (XSL, CSS, etc.), kann im Zeilentemplate der Liste auch rein auf PHP zurückgegriffen werden.

Für Aufzählungszeichen in einem Textfeld können Sie unterschiedlichste Symbole nutzen.

Mit der Version 14 können Sie die zusätzliche Generierung von WebP-Bildern beim Einsatz von JPEG-Bildern einfach über CSS-Only aktivieren. Unterstützt werden neben Bildelementen auch Bildergalerien und Bannerbilder.

Das Weblic® / Element "Überschrift" setzt in der Bearbeitung das Level der Überschrift automatisch nach den im Inhalt bereits enthaltenen Überschriften.

Als Navigationshilfe für Seitenbesucher kann bei Bedarf eine Navigation im Fußbereich der Webseite verwendet werden.

Listeneinträge einer Weblication® Liste zum Anteasern verwenden.

Der Dateiexplorer von Weblication® CMS lässt sich in vielerlei Hinsicht auf individuelle Wünsche ausrichten.

Für Navigationspunkte können Sie Seitenanker pro Navigationspunkt setzen oder auch dynamisch Anker-Links für die Navigation generieren.

Über die Maske der Linkbearbeitung können Sie Felder innerhalb der Pflegemaske auch dynamisch über PHP befüllen.

Um Telefonnummern, Faxnummern und Mobilfunknummern ohne Verlinkung , aber mit Symbol anzuzeigen, lassen Sie das Link-Feld (href) einfach leer.

Beim Einsatz des Kategorienfilters ist es in der Regel so, daß sich die aufzulistenden Verzeichnisse bzw. Dateien auf die der eigentlichen Liste beziehen.

Die Darstellung der Lightbox beim Öffnen von Detailbildern lässt sich individuell beeinflussen.

Mit dem Copyrightzeichen werden Bilder bezogen auf das Urheberrecht gekennzeichnet und symbolisieren dadurch, auf wen das Bild als geschützt gekennzeichnet wird.

Im Fussbereich einer Webseite werden die Inhalte in der Regel farbig abgesetzt, wozu sich ein Inhaltsbereich-Element anbietet.

Enthält die Beschreibung einer Meldung bzw. eines Artikels einen Zeilenumbruch, so können Sie diesen auch in der Listenausgabe ersichtlich machen.

Das BASE-Projekt (Mobile First) wird hinsichtlich diverser Weblics® mit eine Standardvariante ausgeliefert, welche in der Regel mit der Variantennummer 0 bezeichnet ist.

Eine Anwendung wie eine Liste kann sich CSS-Definitionen aus der CSS-Only Hauptvariante und auch den Untervarianten ziehen.

Die Variante 400 des BannerSliders ermöglicht eine mehrspaltige horizontale Anordnung der Bannerbilder.

Im Standard werden die Detail-Seiten von Shop-Produkten mit einem Großbild und Lupenfunktion dargestellt.

Der Breadcrumb Navigation wird standardmässig das Wort "Startseite" vorangestellt und mit der Startseite des Inhaltsprojektes verlinkt.

Die Schaltflächen das Kategoriefilters können Sie sehr einfach visuell über Symbole oder Icons hervorheben.

Listeneinträge lassen sich auf unterschiedliche Weise mehrspaltig darstellen.

Das Weblic® Inhaltsbereich bzw. Inhaltsbox ermöglicht über die allgemeinen Einstellungen das Setzen einer maximalen Bildbreite und auch eine Mindestbreite bei Hintergrundbildern.

Bei einer Blätterliste können Sie über ein PHP Element, welches während der XSLT-Transformation ausgeführt wird, den Seitentitel um die aktuell geblätterte Seite ergänzen. Dazu ermittelt man die aktuelle pageID und setzt den globalen Wert pageTitel neu zusammen.

Listenerweiterungen sind einzelne XSLT-Templates, welche über CSS-Only in Listen und Bannern eingebunden werden, um diese so mit beliebigen Inhalten zu erweitern.

In der Mobile First BASE stehen Ihnen zur Ausgabe von Objekt-Daten vielfältige Möglichkeiten zur Verfügung.

Werden Google Fonts über die Google Font API eingebunden, muss der Besucher damit rechnen, dass er Daten an Google sendet, sofern er die Schriftart nicht bereits im Cache hat. Aus Datenschutzssicht ist es also empfehlenswert Schriften nicht über den Google Server zu beziehen, sondern diese lokal abzulegen.

Für das Bild-Element ist in den CSS-Only-Varianten (z.B. Variante 0) die Lazy Loading Funktion in der Regel standardmässig aktiviert

Anklickbare Telefonnummern können Sie über das Präfix tel: im Link-Feld ermöglichen.

Text kann in Listen über spezielle Crop-Funktionen direkt über CSS begrenzt / abgeschnitten werden.

Über ein globales Template können Sie das hreflang-Attribut für Sprach- oder Regions-URL Ihrer Seiten verwenden.

Mit dem Weblic® "Inhaltsbereich aus einer anderen Seite einbinden" binden Sie einen Inhaltsbereichscontaier aus einer anderen Seite ein. Im Gegensatz zum Weblic® "Inhalte aus einer anderen Seite einbinden" können Sie auf oberster Seitenebene den Inhalt der anderen Seite mitsamt Inhaltscontainer einlesen, was z.B. beim Einsatz einer Bereichsnavigation sehr nützlich ist.

Beim Lazy Loading werden Bilder erst dann geladen, wenn diese im sichtbaren Bereich sind. Während dies bei schnellen Verbindungen meist nicht nötig und teils sogar störend ist, kann es bei der Nutzung mit mobilen Geräten die Bedienung durch effektiveres Laden enorm verbessern.

Wenn der Titel einer Liste nur aus einer Überschrift und nicht zusätzlich aus einem Link bestehen soll, können Sie das über die CSS-Only Option -w-option-displayTitle:onlyInner; festlegen.

Wenn z.B. ein Element mit einer speziellen Variante als einziges einfügbar sein soll, kann das nich über den Typ definiert werden. Da dieser ja gleich ist, wie bei anderen Varianten des gleichen Typs. In dem Fall hilft ein kleiner Trick. Man benennt den Typ um, und erlaubt dann nur diesen temporären Typ einzufügen. Damit dann das eingefügte Element wieder den eigentlichen Typ besitzt, kann man das über das Attribut typeAfterInsert im Mastertemplate festlegen.

Ist nichts spezielles definiert, wird der Titel einer Seite aus dem vom Redakteur gepflegten Titel, ergänzt um den in der Projektkonfiguration festgelegten Prä- und Postfix, ausgegeben. Sollen bestimmte Seiten individuellere Titel bekommen, kann dies z.B. im Objekt-Template definiert werden. Das gleiche Prinzip kann auch für Beschreibung, Schlüsselwörter und das Robots-Meta-Tag genutzt werden.

Beim Einfügen von Elementen werden die verfügbaren Untervarianten gleich zur Auswahl angeboten. Soll das vermieden werden, da einem Element bewusst nur eine Variante zugeordnet ist, kann dies über das Attribut allowSelectVariantsOnInsert="0" innerhalb des wd:item-Elementes im Mastertemplate festgelegt werden.

Beim Einbinden von Bildern werden je nach Einstellung Metadaten, wie Titel oder Beschreibung, angezeigt. im Standard ist für deren Pflege eine einsprachige Maske verknüpft. Um die mehrsprachige Pflegemaske zu nutzen, gehen Sie wie folgt vor:

Wenn ein Bild einen Titel eingepflegt hat, wird dieser automatisch in einer Lightbox angezeigt. Dies lässt sich über die CSS-Only Eigenschaft -w-showTitle:no; im Bildelement bzw. auch zu einer Bildergalerie-Variante verhindern. Sie können den Wert entweder fest eintragen oder die entsprechende Option als Untervariante zur Auswahl anbieten.

Nach dem Aufruf einer Lightbox kann eine eigene JavaScript Funktion als Callback genutzt werden, um individuelle Anpassungen durchzuführen.

Nach dem Aufruf eines Banners, also beim Start und nach jedem Wechsel, kann eine eigene JavaScript Funktion als Callback genutzt werden, um individuelle Anpassungen durchzuführen.

Bei vielen Objekten kann man inzwischen wählen, ob Redakteure dort nur Inhaltselemente einfügen können, die dann in einem fest definierten Inhaltsbereich ausgegeben werden, oder ob im Objekt selbst weitere Inhaltsbereiche ergänzt werden dürfen. Meist reicht es, wenn nur Inhaltselemente einpflegbar sind, über zusätzliche Inhaltselemente können hingegen umfangreicher gestaltete Seiten angeboten werden.

Wenn Sie die Reihenfolge der Flaggen anpassen wollen, können Sie das über die Projektkonfiguration im Abschnitt Sprachwahl machen. Dort können Sie die anzuzeigenden Sprachen durch | getrennt manuell auflisten. Entsprechend dieser Auflistung werden die Flaggen dann im Quelltext ausgegeben.

Listeneinträge lassen sich als komplette Seite, in einer Lightbox oder auch direkt in der Liste selbst per AJAX laden. Über CSS-Only können Sie direkt in der Listenvariante definieren, wo und auf welche Art die Details beim Klicke auf einen Listeneintrag geladen werden sollen.

Möchten Sie den Header-Bereich um eigene HTML-Skripte ergänzen, können Sie das in folgendem Template vornehmen: /[IHR-GLOBALES-PROJEKT]/wGlobal/layout/templates/globals/htmlHead.wGlobal.php

Listeneinträge werden standardmäßig im gleichen Fenster geöffnet. Sie können aber auch in einem neuen Fenster oder in eine Lightbox geöffnet werden. Beim Öffnen in einer Lightbox kann es zudem notwendig sein den Ansichtsmodus zu ergänzen, damit nur der Inhalt und nicht die ganze Seite in der Lightbox geöffnet wird.

Navigationseffekte können Sie entweder manuell in der jeweiligen Navigations-CSS definieren oder per Klick über einen Dekorator ergänzen.

Über Listenerweiterungen lassen sich verschiedene Social Share Buttons in Listen einbinden. Diese können über einen Dekorator umschlossen und formatiert werden. Zusätzlich lässt sich definieren, ob die Buttons nur für Redakteure oder für alle Besucher nutzbar sind.

Sobald der erste bzw. der letzte Eintrag eines Banners sichtbar ist, kann der entsprechende Navigationspfeil über CSS ausgeblendet werden. Das geschieht über die zwei dynamischen Klassen firstEntryVisible und lastEntryVisible.

Beim internen Links lässt sich smooth scrolling einsetzen und das verhalten konfigurieren. Das Verhalten ist entweder für spezielle Link- bzw. Navigationselemente oder auch global über CSS-Only definierbar.

Die Darstellungsvarianten einer Seite wird innerhalb der Objektdaten pageLayout definiert. Wenn Sie diese erben oder zentral ändern wollen können Sie das im CSS der Variante innerhalb der page.scss machen. Dort können Sie dann nicht nur die Variante selbst anpassen, sondern die Definitionen auch einfach über @extend von einer anderen Variante erben.

In der Regel fügt der Redakteur oder der Administrator aus einer Auswahl ein Element in die Seite ein. Dieses wird dann über das dafür passende XSLT-Template ausgegeben.

In der Standardliste wird der Titel normal mit einem A-Tag umschlossen. Über die Option -w-option-displayTitle:onlyInner; können Sie dies deaktivieren.

Wird bei einer Überschrift keine spezielle Ebene definiert, prüft das Element, ob davor bereits eine Überschrift existiert. Wenn ja, wird die Überschrift mit der Ebene 2 ausgegeben, ansonsten als Ebene 1. Da bei Objekte oft eine feste Gestaltung des oberen Seitenbereich samt erster Überschrift besteht, kann es sinnvoll sein, automatisch mit einer Überschrift der zweiten Ebene zu beginnen. Sie erreichen das, indem Sie vor der ersten einfügbaren Überschrift über PHP definieren, dass bereits eine Überschrift ausgegeben wurde.

Seitenbereiche lassen sich global oder auf Seitenebene ein- und ausblenden. Ob und welche Seitenbereiche angezeigt werden sollen, wird global in der page.scss über die Seitenvarianten oder in der Seite selbst über die Metadaten festgelegt.

Hintergrundbilder können entweder global für alle Seiten, navigationsabhängig pro Navigationspunkt oder auch individuell für jede Seite definiert werden. Auch Kombinationen sind möglich. Dabei überspielt dann der navigationsabhängige Hintergrund den globalen Hintergrund und der seitenspezifische Hintergrund wiederum den navigationsabhängigen.

SVG-Bilder werden in Listen standardmäßig über ein IMG-Element eingebunden. Sollen diese allerdings über CSS-gestaltet werden, müssen sie direkt als XML in die HTML-Seite eingebunden werden. Dies können Sie entsprechen dem folgenden Quelltextbeispiel in der CSS-Only Variante der entsprechenden Liste einstellen.

Pflegetags können vollständig dynamisch über PHP erzeugt werden, wenn das PHP vor der XSLT-Transformation ausgeführt wird. Dazu muss es innerhalb eines WSL-Tags wslEditorPre:php geschrieben werden.

Die Vorlesefunktion kann über CSS-Only an beliebiger Stelle eingebunden werden, um Inhalte aus der ganzen Seite oder nur von Teilbereichen vorzulesen. Zudem können Sie festlegen, ob alle oder nur bestimmte Seiten mit einer Vorlesefunktion ausgestattet werden sollen.

Über die Option -w-option-picture-sizeMode:original; werden Bilder ohne Größenanpassung direkt in einer Galerie angezeigt. Das kann z.B. bei der Auflistung von Logos, Icons oder Symbolen sinnvoll sein. Falls die Bilder in HD vorliegen, also doppelt so groß sind, kann -w-option-picture-sizeMode:original; verwendet werden. In dem Fall werden Sie in halber Größe auf der Seite angezeigt.

Objektdaten können nicht nur ausgegeben, sondern auch als Data-Attribute ergänzt werden. So dienen sie z.B. als Basis für spezielle JavaScript-Funktionen oder auch zur objektabhängigen Formatierung einzelner Einträge.

Der Scroll-Fortschritt kann an beliebiger Stelle eingebunden werden. Neben dem Body z.B. auch im Kopfbereich, wodurch je nach Layout beim hochgeschobenen Kopfbereich nur noch genau der Scrollbalken sichtbar bleibt.

Der Scroll-Fortschritt kann generell oder auch nur für bestimmte Objekttypen angezeigt werden. Dazu genügt es, den im HTML-Element eingetragene Objekttyp zu ergänzen.

Listeneinträge lassen sich nach dem ersten Buchstaben gruppiert auflisten. Dabei wird das Data-Attribut headlinefirstletter vor dem ersten Eintrag, des jeweiligen Buchstabens angezeigt. Hierzu sind keine Anpassungen am XSLT notwendig, da die ersten Buchstaben per CSS-Content ausgegeben werden können.

Akkordeon-Header sind standardmäßig mit H3-Elementen ausgezeichnet. Dies können Sie pro über CSS-Only Varianten allerdings beliebig anpassen. Denkbar sind z.B. DIV- oder auch H1- bzw. H2- Elemente.

Listenerweiterungen können ohne oder je nach Unterstützung auch mit einem oder mehreren Parametern aufgerufen werden. Welche Parameter unterstützt werden, sind in der Erweiterung selbst dokumentiert. Die Parameter sind durch Leerzeichen getrennt in Anführungszeichen zu setzen. Zwischen den Parametern darf kein Komma stehen.

Während Bilder standardmäßig skaliert werden, ist es zudem möglich, stattdessen auch die Originalbilder aufzulisten.

SVG-Bilder sind dann per CSS anpassbar, wenn sie direkt im HTML eingebettet sind, also nicht über IMG-Tag geladen werden. Für Bilder selbst gibt es dafür die Variante "SVG-Grafik eingebettet, per CSS formatierbar".

Dekoratoren können auch verschachtelt werden, wenn diese sowohl im öffnenden als auch im schließenden Dekorator jeweils eindeutige Klassen definiert haben.

Über CSS-Only Dekoratoren können Sie Listenelemente in zusätzliche HTML-Elemente, also z.B. DIVs packen. Auch eine mehrfache Verschachtelung ist möglich. In diesem Fall muss dann nur der schließende Dekorator ebenfalls den Klassennamen enthalten.

Die Navigation kann auch unter einem Seitenelement, meist einem Bild oder einem Banner angezeigt werden. Dazu müssen Sie im Seiten-Layout 'Hauptnavigation im Inhaltsbereich anzeigen aktivieren'. Im Panel können Sie anschließend über 'Kopfbereiche, Portalinhalte pflegen' Elemente dem oberen Bereich hinzufügen, welche dann über der Navigation erscheinen.

Auch in bestehenden Mobile First Projekten können nun Quelldateien und Zeilennummern beim Einsatz von wCss2 im Browser angezeigt werden. Dies geschieht über eine CSS-Variable in der design.css.

Sass-Bedingungen werden bei der Quelltextbearbeitung der page.scss bereits geprüft. Falls diese nicht aktiv sind, werden sie ausgegraut dargestellt, um so die Übersichtlichkeit zu erhöhen.

Das Mobile First Projekt bietet Ihnen eine Vielzahl neuer und einfacher Möglichkeiten, Objektdaten auf einfachste Weise in einer Liste abzugeben und zu formatieren.

Die Bildbreitenauswahl und die Bildbreitenberechnung wurden in der Mobile First BASE grundlegend überarbeitet. Dem Umstand geschuldet, dass es inzwischen sehr viele unterschiedlichen Bildschirmgrößen gibt, setzt die Mobile First BASE konsequent auf Responsive Images, um eine optimale Bildqualität bei gleichzeitig minimaler Bildgröße auszuliefern.

Im Titel von Akkordeon Elementen lassen sich nun auch einzelne Wörter hervorheben, indem sie vom Redakteur fett oder farbig formatiert werden können.

In der Mobile First BASE lassen sich einzelne Wörter oder auch Teile eines Wortes der Überschrift fett markieren. Diese Markierung können Sie im CSS beliebig formatieren. Das Strong-Tag kann also auch z.B. die gleiche Schriftstärke und eine andere Farbe zugewiesen bekommen.

Die pflegbaren Elemente einer Objektpflegemaske können nun direkt über den Seiten-Editor angepasst werden. Mit dieser neuen, zusätzlichen Technik lassen sich Masken noch schneller auf die projektspezifischen Anforderungen anpassen, ohne dabei den Quelltext-Editor nutzen zu müssen.