Zur Mobilversion
20 | 04 | 2024

Mobiles Layout

Mobiles Layout für Smartphones

Das Mobile Layout ermöglicht eine an die kleineren Displays von Smartphones angepasste Darstellung Ihrer Webseite. Zudem können Sie selbst entscheiden, welche Elemente in dieser Darstellung angezeigt werden sollen.

Somit können Sie entscheiden, ob ein Besucher, der die Webseite über ein Smartphone aufruft, die komplette Webseite sehen soll oder nur bestimmte Bereiche der Webseite. Hier wird auch Rücksicht genommen auf die Möglichkeiten der Smartphones, besonders vom iPhone, das keine Flash-Animationen abspielen kann.

Die mobile Darstellung            

Bei Smartphones werden die Elemente in den schmalen Displays  vertikal untereinander angeordnet angezeigt, die Quernavigation wird über einen Button abgerufen (siehe Abb. oben). Weiterführende Links ‚mehr‘ werden als Buttons dargestellt.

Foto / Bearbeitung: Aylerein-Fotolia.com / Monika Herkens


Wechseln zur mobilen Vorschau in der Seitenansicht

In der Seitenansicht kann man sich die mobile Ansicht der Webseite als Vorschau anzeigen lassen und dann entscheiden, ob jedes Element in dieser Version auch angezeigt werden soll.

Über dasŒ  1 Kontextmenü  wird über den neuen Menüpunkt   2 Zeige in Template der Unterpunkt Ž 3 Mobil aufgerufen. Nun kann man sich in der Vorschau anschauen, welche Elemente im mobilen Layout angezeigt werden.

 


Nicht für die mobile Ausgabe geeignete Inhaltstypen

Bestimmte Inhaltstypen sind nicht (oder zurzeit noch nicht) für die mobile Ausgabe geeignet. Dazu gehören – Stand März 2013:

  • Kommentare
  • Tagcloud
  • Webformular Auswertung
  • nur für Bildungswerke bestimmte Inhaltstypen: Merkzettel für Pegasus, Pegasus Detail, Einzelveranstaltung Pegasus, Veranstaltungsliste Pegasus, spezielles Kopfelement der Bildungswerke
  • für den Shop entwickelte Inhaltstypen: Onlineshop (Folder), Produkt, Erweitertes Produkt, Bestellung, Texte, Warenkorb

Die komplette Liste der Verwendbarkeit / Sichtbarkeit der einzelnen Elemente in den verschiedenen Templates.


Elemente aus der mobilen Ansicht entfernen

Ein solches Element wie die Tagcloud, das in der mobilen Ausgabe zu Problemen führen könnte, kann speziell nur für die mobile Version entfernt werden:

Über die Element-Einstellungen wird im Konfigurationsfenster das Häkchen bei Mobil entfernt, somit wird das Element zwar weiterhin auf normalen PCs etc. angezeigt, nicht aber auf mobilen Endgeräten.

Auf diese Art und Weise können Sie die Zusammenstellung aller Elemente in der mobilen Ausgabe selbst bestimmen. So könnte man auch die Inhalte der mobilen Ausgabe auf die wichtigsten Elemente reduzieren, damit hier nicht zu viele Elemente geladen werden müssen.

Mobiles Template aktivieren/deaktivieren für Subsites

Damit man je Subsite entscheiden kann, ob automatisch ja nach Browser und Gerät man ein mobiles Template oder Desktop-Template ausliefert wird, kann man diese automatische Funktion deaktivieren und das gewünschte Template fix einstellen. Es handelt sich hier um eine flache Lösung.

Die Eigenschaft ist jeweils am Subsiteordner zu setzen. Bei einer Subsite mit Portaltemplate, welche die Portalstartseite als „index.html – Seite“ verwendet muss zusätzlich noch diese Eigenschaft an der Portalstartseite gesetzt werden. Untenstehend finden Sie eine Auflistung der möglichen Werte der Eigenschaft "template" für die verschiedenen Template-Varianten für ein Mobile-Device-Management im OpenCms:

 

Portaltemplate / Portal Startseite:

  • keine dynamische Erkennung des Device:

/system/modules/de.erzbistumkoeln.portaltemplate/templates/start.jsp

  • dynamische Erkennung des Device:
    dynamic:de.erzbistumkoeln.v8.template.CmsTemplateProviderPortalStart

 

Portaltemplate / Portal Folgeseite Eigenschaft am Subsite-Ordner:

  • keine dynamische Erkennung des Device:
    /system/modules/de.erzbistumkoeln.portaltemplate/templates/page.jsp
  • dynamische Erkennung des Device:
    dynamic:de.erzbistumkoeln.v8.template.CmsTemplateProviderPortal

 

V8 Template:

  • keine dynamische Erkennung des Device:
    /system/modules/de.erzbistumkoeln.v8.template/templates/main.jsp
  • dynamische Erkennung des Device:
    dynamic:de.erzbistumkoeln.v8.template.CmsTemplateProviderV8

 

Siehe auch Eignung der Ressourchen für mobiles Template

 

Ressourcen-Eignung und Benennung hier als Download

 

siehe auch Template-Umschalter (PDF-Datei)