mobile version für existierende Website erstellen

gbock · 11. Mai 2015 14:51

hallo zusammen,

vielleicht hilft die Frage ja auch dem ein oder anderen (in Zukunft).
Ich stehe vor dem Problem eine existierende Website an mobile Endgeräte anpassen zu müssen.
Insbesondere Smartphones sind das Problem, da aktuell im CSS auch feste px Angaben gemacht werden.

Ich stehe da ganz am Anfang und weiss ehrlich gesagt nicht was dabei alles zu beachten ist:
Die anderen Threads hier habe ich natürlich auch schon überflogen bzw. versucht zu verstehen.

Ich denke, dass ich zwei unterschiedliche Templates benötige und zuvor eine If Abfrage nach der Auflösung machen muss.
Template 1: bleibt, 2-spaltig
Template 2: neue Navigation, 1spaltig

Das ist ja anscheinend mit dem Modul "ToolBox" möglich.

Aber wie bekomme ich dann eine neue Navigation hin. Ich habe schon oft ein kleines Viereck gesehen, auf das man dann klickt und die komplette Navigation blättert sich auf.
An die einzelnen Angaben im CSS muss ich vermutlich dennoch ran...

Alternative:
Gibt es fertige Templates, die das Umschalten schon integriert haben, so dass ich vielleicht nur ein paar Farben etc. anpassen muss?

Auf den Seiten für Template-Downloads steht das leider nicht dabei...

Und zu guter Letzt, wie teste ich ein neues Template am besten:
Seite auf nicht sichtbar im Menu und die Vorschau Funktion nutzen?

Danke!
CMSMS:1.11.10

Janl · 11. Mai 2015 19:52

Zitat "ich stehe da ganz am Anfang"
Registriert seit 22.03.2011

Nach 4 Jahren soll man so einiges selbständig machen können und nicht Anderen für Deine Karre spannen.

Schau mal bei www.taxigerhard.at das ist mit Toolbox gemacht und alle Info dazu habe ich auch von diese und das amerikanische Forum geholt.

Viel Erfolg.

Andynium · 11. Mai 2015 20:57

gbock schrieb:

Ich denke, dass ich zwei unterschiedliche Templates benötige und zuvor eine If Abfrage nach der Auflösung machen muss.

Die einfachere Variante ist da grundsätzlich, ein responsives Template einzusetzen, welches sich an die Bildschirm-Auflösung des Endgerätes anpasst - also 1 Template für alles.

Da gibts im Internet unzählige Seite, wo es die für lau gibt, z.Bsp.

http://html5up.net

gbock schrieb:

Und zu guter Letzt, wie teste ich ein neues Template am besten:

Auf einem lokalen Webserver wink

https://bitnami.com/stack/cms-made-simple

gbock · 13. Mai 2015 16:12

ok, danke euch beiden!
da werde ich dann mal tiefer einsteigen...

@Janl
"Nach 4 Jahren soll man so einiges selbständig machen können und nicht Anderen für Deine Karre spannen."
Das sehe ich nicht so!
Ich nutze CMSMS so gut ich kann, fange aber jedes Jahr praktisch von vorne an, da ich keine Zeit/Lust habe mich damit tagtäglich zu beschäftigen.
Ich versuche dennoch vorab zu recherchieren und nicht jede Frage "einfach" zu posten.

Die Zeit die ich durch Eure Hilfe spare investiere ich z.B. in das Training einer 2004er Jugend-Fußballmannschaft.
Da würde ich auch nicht auf die Idee kommen den Eltern zu sagen: "Beschäftigt Euch mal selbst mit Euren Rabauken, anstatt andere vor den Karren zu spannen" ... ist ja freiwillig, genauso wie das antworten hier auf eine Frage.

Beitrag geändert von gbock (13. Mai 2015 16:22)

Janl · 13. Mai 2015 18:36

@gbock
Du stellst in deinem Post eine Reihe Fragen nicht einfach so zu beantworten sind, dass heisst jemandem muss eine menge Zeit frei machen und das Schritt für Schritt zu erklären.

Wir wollen gerne helfen aber man muss auch selber etwas können, sicher bei CMSMS, das ist kein Point-and-Click-Fertig System.
Du kannst Kopien bekommen von einige Sachen, z.B. im Template Desktopversion

Hier klicken, um den Code zum Kopieren zu markieren

<head>
{if $smarty.get.useDesktop == "1" or $smarty.session.useDesktop == "1"} {*do nothing*}
{elseif ($tbmobile->isMobile())} {redirect_page page="mobil"} 
{/if}

und im Mobiltemplate

Hier klicken, um den Code zum Kopieren zu markieren

<head>
{tbSessionSet name="useDesktop" value="1"}

damit man wieder zurück kann zum Desktopversion.

MfG
Jan

Andynium · 14. Mai 2015 12:57

gbock schrieb:

Ich nutze CMSMS so gut ich kann, fange aber jedes Jahr praktisch von vorne an, da ich keine Zeit/Lust habe mich damit tagtäglich zu beschäftigen.
Ich versuche dennoch vorab zu recherchieren und nicht jede Frage "einfach" zu posten.

Auf die Hilfe solcher Nutzer wie dich, ja genau dich, sind WIR dringend angewiesen - denn es ist in unserem Sinn, den Einsatz von CMSMS zu fördern. Auch wenn partiell ein tieferer Einstieg in die Materie erforderlich ist, bemühen wir uns hier, JEDEM User den Einstieg bestmöglich zu erleichtern.

Insoweit wäre es hilfreich, wenn du mal eine Aufstellung posten könntest, was genau dir an Informationen fehlt, damit du nicht jedes Jahr neu recherchieren musst (gern auch per Email).

Janl · 14. Mai 2015 13:55

@Cyberman,
richtig, so soll gbock weiter kommen!
PS, bin fast so weit mit (m)einem responsive Design als Basis, nur noch Submenü mit CSS togglen, das habe ich schon vorbereitet, nur noch in CMSMS bringen.

MfG
Jan

gbock · 18. Mai 2015 16:47

ok, nochmals besten Dank!

Ich werde mich auf jeden Fall ausführlicher hierzu melden, im Moment sind aber wieder 2, 3 andere Projekte wichtiger geworden!

Janl · 18. Mai 2015 16:52

Obwohl noch nicht ganz gesäubert ist von leeren Stellen und überflüssigem, könnte das vielleicht ein Ausgangspunkt sein.

http://stajl.xyz

Wenn das Browserfenster von etwa 320px bis 1920px geschoben wird, dann bemerkst Du, es ist responsive.

Ich kann es vorab als Theme exportieren, dann kannst Du es nutzen.

MfG
Jan

sam_venchester · 02. Juni 2015 09:02

Hallo gbock)
Hallo an Alle)
Ich habe meine Websete hier erstellt!
http://www.templatemonster.com/de/
Es gibt zu viel Beispile für PC und Handys!
Viel Erfolg

spike · 08. August 2015 16:31

Thread is a bissl' alt aber ich hab a paar Sites responsive gemacht mit
1. TBS-Bootstrap und
2. mit Template980
Template980 ist wahrscheins gut für den anfang weil es net so kompliziert ist und von daher einfacher zu "restyle".
Schau mal hier: http://template980.pmkmedia.nl/
Gruss - spike

Andynium · 09. August 2015 09:27

Für nützliche Hinweise ist es nie zu spät wink ... insbesondere, wenn das Thema aktuell und allgegenwärtig ist.

Danke fürs Feedback!

Pepe · 19. Januar 2018 16:06

Ich würde mich hier gerne mal einklinken. Leider scheine ich irgendwo einen Fehler drin zu haben, da auf dem Handy noch immer die Desktop Variante angezeigt wird....

Das habe ich bisher gemacht:

- Ich habe über Filezille den Unterordner mobile in htdocs erstellt (htdocs/mobile). In htdocs liegt die Desktop Variante.
Die FTP Einstellungen sind auf dem Screenshot im Anhang. Die Webseite wurde erfolgreich in den Unterordner hochgeladen

- Bei der Umleitung auf die mobile Webseite habe ich mich für die einfach Umleitung auf die mobile Webseite entschieden. Den Code habe ich über den Projektordner in Attribute/mobile_script eingefügt (s. Screenshot)

Leider wird auf dem Handy noch immer die Desktop Variante angezeigt...

Bitte um Hilfe! Vielen Dank

Andynium · 19. Januar 2018 17:22

Screenshots fehlen ...

Abgesehen davon - bist du dir sicher, dass du CMS/made simple im Einsatz hast?

Die Ordner-Namen sagen mir so ziemlich gar nichts. roll

Janl · 19. Januar 2018 17:23

Versuche es mal mit diesen 2 Metatags im header

Hier klicken, um den Code zum Kopieren zu markieren

[== html ==]
<meta name='viewport' content='initial-scale=1.0 maximum-scale=1.0 user-scalable=no' />
<meta name='HandheldFriendly' content='true' />

mfg
Jan

Pepe · 21. Januar 2018 17:40

Besten Dank, es hat funktioniert!

Forum für CMS/made simple

#1 11. Mai 2015 14:51

mobile version für existierende Website erstellen

#2 11. Mai 2015 19:52

Re: mobile version für existierende Website erstellen

#3 11. Mai 2015 20:57

Re: mobile version für existierende Website erstellen

#4 13. Mai 2015 16:12

Re: mobile version für existierende Website erstellen

#5 13. Mai 2015 18:36

Re: mobile version für existierende Website erstellen

#6 14. Mai 2015 12:57

Re: mobile version für existierende Website erstellen

#7 14. Mai 2015 13:55

Re: mobile version für existierende Website erstellen

#8 18. Mai 2015 16:47

Re: mobile version für existierende Website erstellen

#9 18. Mai 2015 16:52

Re: mobile version für existierende Website erstellen

#10 02. Juni 2015 09:02

Re: mobile version für existierende Website erstellen

#11 08. August 2015 16:31

Re: mobile version für existierende Website erstellen

#12 09. August 2015 09:27

Re: mobile version für existierende Website erstellen

#13 19. Januar 2018 16:06

Re: mobile version für existierende Website erstellen

#14 19. Januar 2018 17:22

Re: mobile version für existierende Website erstellen

#15 19. Januar 2018 17:23

Re: mobile version für existierende Website erstellen

#16 21. Januar 2018 17:40

Re: mobile version für existierende Website erstellen

Fußzeile des Forums