Hallo ins weite Rund,
aus eigenem Bedarf habe ich mich mal an die Umsetzung eines Mobillayout-Umschalters gemacht - das Plugin MobileLayout (http://www.mozilo.de/forum/index.php?action=media;sa=item;in=196) ist das Ergebnis. Nutzer mit Smartphones und Tablets bekommen damit eine für Mobilgeräte optimierte Version der Website zu sehen. Das Standard-Layout können Sie aber auch explizit anfordern.
Für die Prüfung, ob der Benutzer die Website mit einem Mobilgerät aufruft, kommt die unter MIT-Lizenz stehende Bibliothek Mobile-Detect (https://github.com/serbanghita/Mobile-Detect) zum Einsatz.
Und damit ihr zum Ausprobieren auch gleich ein fittes Mobil-Layout habt, hab ich fix noch moziloMobile (http://www.mozilo.de/forum/index.php?action=media;sa=item;in=197) erstellt ;)
Detaillierte Doku wie immer auf software.azett.com (http://software.azett.com/index.php?cat=moziloCMS-Plugins&page=MobileLayout) - dort könnt ihr die Funktionalität auch gleich nach Herzenslust ausprobieren: Entweder direkt mit dem Mobilgerät ansurfen oder im Footer den Link "Mobilansicht" klicken :)
Ich wünsche viel Spaß damit und stehe Anregungen und Kritik natürlich wie immer aufgeschlossen gegenüber.
Gruß
Arvid
(http://abload.de/img/index8eqm9.jpg)
Hallo Arvid, Hallo Mozilo Gemeinde
Ich habe heute das mobile plugin ausprobiert. Dabei ist mir folgendes aufgefallen: In Verbindung mit dem "head-plugin" bekomme ich in der mobilen Version meiner Webseite eine Fehlermeldung des "head-plugin": head-Plugin Fehler. Das Head Plugin darf nur einmal pro Inhaltsseite verwendet werden !
Also z.B. für folgenden head Befehl, der in der Standard Ansicht funktioniert: {head|<meta name="robots" content="noindex" />}
Woran könnte das liegen?
Viele Grüße
Michael
Hast Du {MobileLayout} vor oder nach dem {CONTENT} im Layout stehen?
Hallo djr
Vielen Dank für Deine Antwort. Ich habe {MobileLayout} vor und nach {CONTENT} ausprobiert, es hat sich nichts geändert...
Viele Grüße
Michael
Gibt es dafür eine Lösung? Ich habe das gleiche Problem mit mozilo 1.12.
Habe heute zum ersten Mal das Plugin MobileLayout ausprobiert. Wenn ich jetzt im Backendbereich die Plugins aufrufen will, kommt folgende Fehlermeldung:
Fatal error: Call to undefined function getDirs() in /var/www/vhosts/xxx/httpdocs/plugins/MobileLayout/index.php on line 101
Mache ich was falsch, fehlt da was? Bin jetzt ein wenig ratlos.
Gruß TommyP
Hey Tommy,
Das Plugin ist für mozilo 1.12
Welche mozilo Version nutzt du? Wenn du 2.0 nutzt sollte das Fehler erklären...
lg
— Andreas
Hi HPDesigner
Das habe ich übersehen, ja ich nutze schon 2.0. Wird es denn eine Anpassung für 2.0 geben? Mobile Endgeräte werden ja immer "wichtiger"?!
Vielen Dank für deine schnelle Antwort.
TommyP
Hallo TommyP,
ein mobiles Design lässt sich auch gut mit dem Bootstrap Plugin erstellen:
http://www.mozilo.de/forum/index.php?action=media;sa=item;in=248 (http://www.mozilo.de/forum/index.php?action=media;sa=item;in=248)
Dazu gibt es z.B. auch ein Basislayout:
http://www.mozilo.de/forum/index.php?action=media;sa=item;in=249 (http://www.mozilo.de/forum/index.php?action=media;sa=item;in=249)
Man kann natürlich auch einfach ein Layout mit Hilfe von Media Queries erstellen. Hast du deine Seite schon irgendwo online? Dann könnte man dir evtl. direkt Tipps geben.
Gruß Flo
Hallo stromflo,
ZitatHast du deine Seite schon irgendwo online?
habe ich:
http://www.nwl-gvm.de (http://www.nwl-gvm.de)
http://www.vvl-landschaftspflege.de (http://www.vvl-landschaftspflege.de)
Danke
Guten Abend,
hab mir die Seite vom ersten Link mal kurz angeschaut. Es ist ja im Prinzip ein zweispaltiges Layout. Man könnte also z.B. float: none setzen um in kleineren Ansichten die Navigation über dem Content anzuordnen. Man müsste natürlich dann noch weit mehr Elemente anpassen...
Hier mal ein Beispiel: (Achtung! Die Containernamen passen nicht unbedingt zu deinen Layouts....)
@media screen and (max-width: 960px) {
#header{
/*Header Container wird nicht angezeigt*/
display: none;
}
#container{
width: 100%;
}
#Navigation{
/* Führt dazu, dass der Inhalt der Navigationsleiste über dem content dargestellt wird.*/
float: none;
width: 100%;
}
#content{
width: 100%;
}
}
Wenn du z.B. nicht sofort auch bei kleineren Darstellungen noch auf die seitliche Navigation bauen möchtest, kannst du z.B. folgendes machen:
Nehmen wir mal folgendes an:
Grunddesign:
Container: 960px
Navigation: 200px
Content: 760px
Dann nimmt man den Dreisatz zur Hilfe:
Navigation:
960px = 100%
200px = x%
Content:
960px = 100%
760px = x%
(100*200)/960 = 20,83333...
(100*760)/960 = 79,16667...
Setzt man bei width diese Werte in %, so verkleinern sich die Spalten im Verhältnis zur Darstellungsgröße. Irgendwann hat man allerdings eben das Thema, dass die seitliche Navigation + Content zu viel Platz wegnimmt und man aus meiner Sicht eher auf eine Anordnung von Navigation und drunter Content setzen sollte.
Natürlich muss man auch die Syntax für die Darstellung von Bildern überdenken.
Das sind nur mal ein paar Beispiele. Diese sind nicht genau auf deine Seiten abgestimmt. Hoffe mal, dass es dir trotzdem schon mal ein paar Anregungen gibt.
Gruß Flo