Mobile Website mit Contao

**webentwickler** · 29.11.2011, 11:35

Hallo,

die letzten Tage habe ich damit verbracht, mich in Contao einzuarbeiten.
Ich möchte jedoch gleich zu Anfang auch in Richtung mobile Websites mit Contao forschen.

Zu diesem Thema habe ich mittlerweile recht umfangreich recherchiert, sowohl im deutschen
als auch im englischen Forum. Dabei sind mir neben verschiedenen Gedankenansätzen auch
einige Erweiterungen über den Weg gelaufen: templateSelection, mobileSwitch, mobileCore.

Leider bin ich (als Neuling) noch auf keine zufriedenstellende Lösung gestoßen. Vielleicht
habt ihr weitere Tipps oder könnt mir weiterhelfen.

1. Mit Media-Queries kann ich die Seite optisch sehr gut anpassen. Ich möchte aber auch starke
inhaltliche Anpassungen vornehmen. Manche Inhalte eignen sich auf mobilen Geräten nicht,
sind überflüssig oder funktionieren schlicht nicht.

2. Die mobile Website soll inhaltlich und optisch der bestehenden Website auf jeden Fall ähneln,
d.h. zweiverschiedene Einstiegspunkte mit eigener Struktur kommen aber nicht in Frage.
Zu aufwändig wären Änderungen, die dann an mehreren Stellen gemacht werden müssen.

3. Am ehesten entsprach mobileCore bisher meinen Anforderungen. Dort lassen sich alternativ
für eine mobile Version der Seite templates/css usw definieren UND Artikel können für die mobile
Version/standard Version einer Seite ausgeschaltet werden.
Problem: Ich kann dort einzelne mobile Geräte nicht unterscheiden, das würde ich aber gerne, nämlich
zumindest Tablets und Handhelds.

4. Wenn es bei meinen Seiten um kleine Webseiten ginge, würde ich den Aufwand bei der Bearbeitung
von doppelten Inhalten auf jeden Fall in Kauf nehmen. Das ist aber nicht der Fall. Die Seiten sind sehr
umfangreich mit vielen Modulen, Artikeln und mehrsprachigen Inhalten.

So sieht es zurzeit aus. Möglicherweise mache ich mir das Leben schwerer, als es sein müsste.
Die Lösungen, die andere bisher nutzen, sind für mich aber nicht ganz ausreichend, glaube ich.
Daher habe ich dieses neue Thema auch angelegt.
Ich würde daher gerne etwas erarbeiten, was das alles berücksichtigt.

Danke schon mal für eure Hilfe.
Gruß

**wiese** · 29.11.2011, 12:32

Hmm, du hast die Lösung doch schon geschrieben? Via Mediaquery passt du mittels CSS das Format der Mobilen Seite an.
Sprich Breite festlegen, Elemente unter einander fließen, Navigation anpassen ...

Wenn du Anfang an auf ein Gridsystem setzt, machst du es aus meiner Sicht viel einfacher.

Hier hast du ganz viele Beispielseiten -> http://mediaqueri.es/

**webentwickler** · 29.11.2011, 14:38

Das wäre mein Mittel der Wahl, wenn ich nicht so viele inhaltliche Änderungen vornehmen müsste.
Die Internetverbindung auf mobilen Geräten möchte ich gerne schonen, indem ich überflüssige Dinge
nicht lade. Daher auch die weitergehenden Überlegungen...

**ku-ma-122** · 30.11.2011, 06:54

In Deinem Fall wäre es vielleicht sinnvoll eine kleine Erweiterung zu schreiben, die die verschiedenen Geräte anhand von Viewport bzw. Kennung identifiziert und auf dieser Basis könnte man im Backend Inhaltselemente/Artikel/Seiten gezielt für die Ausgabe deaktivieren.

Mit dem Gedanken habe ich auch schon mal gespielt, bisher fehlte mir aber die Zeit eine solche Erweiterung umzusetzen.

**xkoy** · 29.12.2011, 01:51

Naja "mal eben was schreiben" was in den Core eingreift, ich glaube nicht das er sonnst solche Fragen stellen würde

Ich stelle mir aber genau dieselben fragen, man findet relativ wenig hier wie die leute das Thema MOBILE angehen.
Mit Media Queries fährst du ja nur auf der optischen Schiene.

ich werde mal die Extension: mobileCore testen, die hatte ich auch schon ins Auge gefasst. installier Sie gleich mal auf 2.10.3

**andreasisaak** · 29.12.2011, 13:31

Zitat von ku-ma-122

In Deinem Fall wäre es vielleicht sinnvoll eine kleine Erweiterung zu schreiben, die die verschiedenen Geräte anhand von Viewport bzw. Kennung identifiziert und auf dieser Basis könnte man im Backend Inhaltselemente/Artikel/Seiten gezielt für die Ausgabe deaktivieren.

Mit dem Gedanken habe ich auch schon mal gespielt, bisher fehlte mir aber die Zeit eine solche Erweiterung umzusetzen.

Diese Extension gibt es schon:

https://github.com/menatwork/agentSelection

**rockmo10** · 29.01.2012, 11:15

Hallo zusammen,

das ist jetzt vielleicht eine ganz doofe Frage, aber ich hab irgendwie nirgendwo dazu eine Antwort gefunden.

Und zwar würde ich gerne wissen, wie ich in den Media Queries den Befehl geben kann, dass die Webseite beim switchen zu mobilen Ansicht auf eine bestimmte Domain umleiten soll.

zb. http://m.domain.de

danke schonmal für eure Hilfe

***lucina*** · 29.01.2012, 12:12

MediaQueries ist eine CSS-Formatierung, das wirkt sich nicht auf die Domain aus.

Eine Umleitung kannst Du - abhängig vom Ansatz - mit verschiedenen Mitteln realisieren:

Mittels .htaccess unter Apache über ausfiltern des Useragents, wie beispielsweise unter http://www.widexl.com/tutorials/mod_...rect_useragent gezeigt
Mittels einiger Contao-Extensions, wie beispielsweise http://contao-mobile.de/was-ist-mobile-switch.html oder http://www.contao.org/en/extension-l...lecore.en.html

Abhängig vom Vorgehen (und von Deinen Zielsetzungen) ist es sinnvoll, sich zwischen einem Seitenbaum für alle Inhalte oder zwei Seitenbäumen mit inkludierten Inhalten zu entscheiden. Die von Andreas_I erwähnte Extension agentSelection kann dabei auch ganz hilfreich sein.

Carolina.