• Hallo, ich habe ein Problem und weis nicht, wie ich es gelöst bekomme.

    Meine Webseite http://www.stromkostenimblick.de hat ein Slider. Die Bilder sind von der Größe viel zu groß. Meine Frage wie kann ich das optimieren, das die Bildgröße sich der Gesamtseite anpasst.

    Darunter habe ich einen Tarifrechner als Bild eingefügt dort habe ich das Problem das ich das Bild gerne mittig der Webseite hätte.

    Wann benötigt den eine Webvseite Cookies?

    Freue mich auf hilfreiche Antworten.


    MFG


    Jens Barth

    8o8o

  • Hallo,


    zunächst sollten Sie vermutlich für den Container in dem sich der Slider befindet die Option "Randlos" deaktivieren, damit der Slider nicht ganz links auf der Seite dargestellt wird. Danach veröffentlichen, dann scheuen wir uns das nochmal an und machen mit den Anpassungen weiter.

  • Wir waren ja auch noch nicht fertig mit Problem-Lösen. Ich hatte Ihnen nur den ersten Schritt beschrieben und warte darauf, bis der ausgeführt ist und die Website erneut veröffentlicht wurde, damit ich mir die nächsten Schritte überlegen und Ihnen mitteilen kann.

  • Viele andere der Container auf der Seite haben noch die "Randlos" Option aktiviert. Das sollte nur der Fall sein, wenn sich ein Container über die gesamte Fensterbreite ausdehnen soll. Das sollten Sie in allen Containern also zunächst mal deaktivieren.


    Ebenso scheinen Sie in den Container-Eigenschaften meist einen CSS-Klassennamen "c6" eingegeben zu haben. Das sollten Sie auch wieder löschen, das macht bei Containern keinen Sinn und kann Darstellungsfehler verursachen.


    Sie haben nun bei Slider auch noch die Option "Randlos" aktiviert. Das verursacht, dass die Bilder des Sliders über die gesamte Fensterbreite gehen und, wenn ich Sie richtig verstanden habe, möchten Sie das nicht (Bilder viel zu groß). Also Slider-Widget zum Bearbeiten doppelklicken, unten links im Fenster auf das Mischpult-Icon klicken und unter "Darstellung" die Option "Randlos" deaktivieren.


    Dies bitte durchführen, veröffentlichen und dann hier nochmal bescheid geben.


    Die Artikel unter dem Slider scheinen mir irgendwie eigenartig in Spalten angeordnet zu sein. Das macht dann natürlich die korrekte Ausrichtung des Bilds "Tarifrechner" schwer. Also ggf. diese Artikel neu anordnen.


    Wichtig für das Grundverständnis des Grid-Systems: https://docs.zeta-producer.com…rid-system-verstehen.html

  • Wenn Sie möchten, können Sie die Sache auch abkürzen und ein Premium-Support-Ticket buchen, dann zeige ich ihnen kurz per Fernwartung, wie man die Inhalte auf der Startseite anordnen sollte. Danach verstehen Sie das Grid-System sicher besser und können es auf anderen Seiten entsprechend selbst umsetzen.

  • Sie haben die Breite des Sliders nun auf 7 Grid-Spalten verringert. Um den Slider Richtung Zentrum zu schieben, fügen Sie links vom Slider ein sogenanntes "Spacer"-Widget ein und verbreitern das dann, bis der Slider weit genug nach rechts gerutscht ist. Da das Grid-System 12 Spalten hat, müsste der Slider aber auf eine gerade Anzahl von Spalten verbreitert werden, damit er auch tatsächlich zentriert werden kann.


    Wenn der Slider z.B. 8 Grid-Spalten breit ist, und der Spacer links davon auf 2 Grid-Spalten verbreitert wird, dann ist der Slider in der Mitte der Seite.


    Ähnlich können Sie auch bei Text/Bild-Artikeln verfahren.


    Um ein Bild einfach zu zentrieren, kann man es aber auch in einem Text-Artikel mittels Toolbar einfügen und dann mittels Textausrichtung zentrieren. Das ist oft einfacher.

  • Mit der Maus über das Slider Widget fahren, dann links auf das +-Icon klicken und im Menü "Widget" wählen. Dann im Fenster oben rechts ins Suchfeld "spacer" eingeben, dann Doppelklick auf das angezeite Widget "Spacer" machen und anschließend OK klicken, um es einzufügen. Siehe: https://docs.zeta-producer.com…uegen-und-bearbeiten.html

    Danach dann an den Anfassern rechts das Widget entsprechend breiter ziehen. Siehe: spalten-bearbeiten.html


    Grid-Spalten etc. sind hier erklärt: https://docs.zeta-producer.com…rid-system-verstehen.html