Komplette Homepage auf Bildschirm verkleinern?

**Wrathberry** · 23.07.2015, 08:55

Hi,

ich würde gerne folgendes testen.

Ich hätte gerne, dass meine Homepage aufm Handy so verkleinert wird, dass sie genau 100% des Handybildes einnimmt und man dann halt Zoomen muss, um gewisse Dinge zu lesen.

Als Beispiel hätte ich diese Seite hier: https://www.hamburger-software.de/ Wenn man die mit dem Handy betritt, ist sie auf 100% des Handybildschirms verkleinert.

Gibt es ne einfache möglichkeit, das im Contao umzusetzen? Oder müsste ich dafür die komplette Seite umgestalten?

Ich stelle mir vor, einfach z.B. dem Body nen Meda-Querry zu geben, der genau diesen Effekt bewirkt.

Also ist das so einfach möglich, oder ist das deutlich komplizierter als ich mir vorstelle?

mfg

ps: Wie sinnvoll das Ganze ist, sei mal dahingestellt, ich würd das nur gerne mal testen

**Spooky** · 23.07.2015, 09:08

Ja, einfach per Viewport die minimale Breite deiner Website definierne, also zB:

PHP-Code:


<meta name="viewport" content="width=1140"/>

**Wrathberry** · 23.07.2015, 09:12

Zitat von Spooky

Ja, einfach per Viewport die minimale Breite deiner Website definierne, also zB:

PHP-Code:


<meta name="viewport" content="width=1140"/>

Wie genau mach ich das? Also wo müsste ich das angeben? Einfach in meiner Design.css oder wo ganz anders?

**Spooky** · 23.07.2015, 09:24

Unter Contao 3.5 im Seitenlayout unter Experten Einstellungen und dort trägst du bei "Viewport"

Code:

width=1140

ein. Der genaue Wert hängt von deinem Layout ab (einfach die minimale Breite deines Layouts).

**Wrathberry** · 23.07.2015, 09:47

Teste damit mal nen bisschen rum, und komme evt. darauf zurück

(was sehr wahrscheinlich ist xD)

**Wrathberry** · 23.07.2015, 10:03

Zitat von Spooky

Unter Contao 3.5 im Seitenlayout unter Experten Einstellungen und dort trägst du bei "Viewport"

Code:

width=1140

ein. Der genaue Wert hängt von deinem Layout ab (einfach die minimale Breite deines Layouts).

Mal ne extrem dumme Frage:

Woher weiß ich die minimale Breite meines Layouts?^^

**mlweb** · 23.07.2015, 10:19

Zitat von Wrathberry

Ich hätte gerne, dass meine Homepage aufm Handy so verkleinert wird, dass sie genau 100% des Handybildes einnimmt und man dann halt Zoomen muss, um gewisse Dinge zu lesen.

Die Nutzer Eurer Website werden begeistert sein. Tante Google wird es auch gefallen

.
Mal ernsthaft, vielleicht solltest Du Dich mal mit responsive bzw. adaptive Design und mobile Web beschäftigen. Gibt ja jede Menge Infos.

Es geht doch bei Dir nicht um irgendeine private Spielerei sondern um eine Firmen-Website, wenn ich das richtig verfolgt habe.
Da sollte man schon mit etwas Fachwissen an den Relaunch der Website gehen.

**Wrathberry** · 23.07.2015, 10:50

Zitat von mlweb

Die Nutzer Eurer Website werden begeistert sein. Tante Google wird es auch gefallen

.
Mal ernsthaft, vielleicht solltest Du Dich mal mit responsive bzw. adaptive Design und mobile Web beschäftigen. Gibt ja jede Menge Infos.

Es geht doch bei Dir nicht um irgendeine private Spielerei sondern um eine Firmen-Website, wenn ich das richtig verfolgt habe.
Da sollte man schon mit etwas Fachwissen an den Relaunch der Website gehen.

Nur weil ich was testen will, heißt das noch lange nicht, dass ich das auch so lassen will. Hatte das nur auf der oben verlinkten PAge gesehen und fand das grundsätzlich garnicht schlecht, dass einfach so lange rausgezoomed wird, bis die komplette Seite auf das Handydisplay passt und man dann halt wieder reinzoomed.

Wie gesagt, nur weil ich Testweise irgendetwas einbinde, heißt das nicht, dass ich das dann gut finde und auch lasse

.

**tab** · 23.07.2015, 11:17

Wie gesagt, Google wird es dir um die Ohren hauen, jedenfalls wenn jemand von einem mobilen Gerät aus sucht. Die Seite wird dann eben als nicht "mobile friendly" eingestuft und daher Benutzern von mobilen Geräten nur noch angeboten, wenn es keine mobilfreundlichen Alternativen gibt.

Aber im Prinzip ist es ziemlich einfach zu bewerkstelligen. Das hier muss raus aus dem <head>

HTML-Code:

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

Klick auf Templates, dort dann neues Template, fe_page.html5 ins Template-Verzeichnis des benutzten Themes. Das so erstellte (Seiten-)Template bearbeiten, diese Zeile rausnehmen:

HTML-Code:

    <?= $this->viewport ?>

Speichern, fertig.

**Wrathberry** · 23.07.2015, 11:52

Zitat von tab

Wie gesagt, Google wird es dir um die Ohren hauen, jedenfalls wenn jemand von einem mobilen Gerät aus sucht. Die Seite wird dann eben als nicht "mobile friendly" eingestuft und daher Benutzern von mobilen Geräten nur noch angeboten, wenn es keine mobilfreundlichen Alternativen gibt.

Cool, das wusste ich nichtmal

. Aber wie gesagt, mir ging es in diesem Fall eher darum, dass mal zu testen und umzusetzen. Kam als Lösung für "meine" Page eh nicht in Frage

**Spooky** · 23.07.2015, 15:41

@tab: die Bearbeitung der fe_page ist gar nicht notwendig, in Contao 3.5 kann man über das Seitenlayout die Viewport Eigenschaften setzen.

**tab** · 23.07.2015, 15:51

Stimmt, ein Update hätte es auch getan

. Wenn es immer noch um dieselbe Seite geht, dann ist das ein Contao 3.4.x.
Edit: Kann natürlich auch eine andere Website betreffen, sonst hätte er wohl nicht damit rumspielen können.