Neuigkeiten:

moziloCMS verwendet Cookies. Wenn Sie auf unserer Seite weitersurfen, stimmen Sie der Cookie-Nutzung zu Datenschutzerklärung
moziloCMS Layouts
moziloCMS Plugins

Hauptmenü

Eigenes Layout für Mobilgeräte: Plugin MobileLayout

Begonnen von azett, 23. Juni 2013, 15:32:34

« vorheriges - nächstes »

azett

Hallo ins weite Rund,

aus eigenem Bedarf habe ich mich mal an die Umsetzung eines Mobillayout-Umschalters gemacht - das Plugin MobileLayout 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 zum Einsatz.

Und damit ihr zum Ausprobieren auch gleich ein fittes Mobil-Layout habt, hab ich fix noch moziloMobile erstellt  ;)

Detaillierte Doku wie immer auf software.azett.com - 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



TBreaker

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

djr

Hast Du {MobileLayout} vor oder nach dem {CONTENT} im Layout stehen?

TBreaker

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

Dirk1

Gibt es dafür eine Lösung? Ich habe das gleiche Problem mit mozilo 1.12.


TommyP

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

HPdesigner

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
Check my website devmount.de
and find me on Twitter, Medium, GitHub, StackOverflow, Codepen and Slack

TommyP

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

stromflo

#8
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

Dazu gibt es z.B. auch ein Basislayout:

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

TommyP


stromflo

#10
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