Browser wechselt nicht auf "Mobiles Seitenlayout", wenn man ihn zusammenschiebt

[Michael Stifter]

Hallo zusammen,
bei der Demo-Seite von Contao wechselt der Seiteninhalt nicht zum "Mobilen Seitenlayout", wenn man den Browser zusammenschiebt. Was muss man hierzu noch einstellen?
Bei diesem Contao-Theme funktioniert das einwandfrei: http://preview.premium-contao-themes...e-style-1.html

Kann mir jemand helfen?
Gruß, Michael!

[plastiko]

In dem Theme wurde das mit media queries (only screen and (max-width: 767px)) gemacht.
Das "Layout für mobile Seiten" kannst du mit zusammenschieben nicht simulieren.

[xchs]

bei der Demo-Seite von Contao wechselt der Seiteninhalt nicht zum "Mobilen Seitenlayout", wenn man den Browser zusammenschiebt. Was muss man hierzu noch einstellen?

Das liegt daran, dass im User-Agent-String des HTML-Anfrage-Headers keine Kennung eines mobilen Browsers gesendet wird.

[willshedo]

Hi Michael,

du kannst dir eine Browser-Erweiterung installieren, die die User-Agent-Kennung ändert (User Agent Switcher für den Firefox zB), damit kannst du der Webseite 'vormachen', du würdest mit Android oder sowas surfen - entsprechend zeigt dir die Webseite auch die Mobile-Version.

[Thoni]

Hallo,

du kannst auch die Erweiterung mobile_extended nutzen, musst dann aber die Seite neu laden.
Nur die Browsergröße ändern reicht nicht.
Bei der Erweiterung kannst du eine maximale Breite für das mobile Layout angeben.

Gruß
Thoni

[plastiko]

Auch im Safari 6 gibt es eine gute Auswahl von möglichen User Agents
Z.B:
Entwickler > User Agent > Safari iOS 5.1 - iPod touch.

Mann kann sogar jeden beliebigen User Agent angeben (Dann aber manuel, sofern mann ihn kennt).
Entwickler > User Agent > Anderer ...
Z.B:

Mozilla/5.0 (iPod; CPU iPhone OS 5_1 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Version/5.1 Mobile/9B176 Safari/7534.48.3

OT:
Auf der Conto-Demo Seite ist die Navigation dann ganz unten - Mein Ding währ das nicht.

[varix]

Hi,

vielleicht hilft das ein wenig weiter:
http://blog.kulturbanause.de/2011/04...co-optimieren/

Insebondere der Hinweis im Artikel könnte dein Missverständnis aufklären:

Bitte beachtet, dass ich in diesem Beispiel die Eigenschaft width anstelle von device-width verwende. Das hat für mich den Vorteil, dass ich das Verhalten meiner Website testen kann indem ich die Größe des Browserfensters verändere. device-width wirkt sich auf die Größe des Bildschirms aus - das Beispiel wäre dann also nur auf einem iPad sichtbar.

Contao.de beinhaltet folgenden meta-tag:

<meta name="viewport" content="width=device-width,initial-scale=1.0">

Grüße,
varix

Wie immer der Hinweis: Bin selbst Laie, geb aber mein Bestes