Blöcke skalieren

Ändere Inhalts-Blöcke auf deiner Website, damit sie größer oder kleiner werden.

Zuletzt aktualisiert: 16. Juni 2024

Du kannst die Größe von Blöcken jederzeit anpassen, um Layouts zu ändern und Inhalte auf neue Weise anzuzeigen. Wie du die Größe von Blöcken änderst, hängt vom Editor ab, und verschiedene Blöcke haben möglicherweise ein unterschiedliches Größenänderungsverhalten. In dieser Anleitung werden einige Möglichkeiten zur Größenänderung von Blöcken erläutert.

Die Beispiele in dieser Anleitung verwenden eine Layout-Seite, aber du kannst Blöcke in vielen verschiedenen Bereichen deiner Website hinzufügen und deren Größe ändern. Hilfe zum Neuanordnen von Blöcken in einem Inhaltsbereich findest du unter Verschieben von Blöcken zum Anpassen von Layouts.

Video ansehen  

Größe von Blöcken im Kreativen Editor ändern

Der Kreative Editor ist die neueste Bearbeitungsfunktion von Squarespace. Er wird auf Websites der Version 7.1 unterstützt, auf denen du Block-Abschnitte hinzufügen kannst. Wenn während der Bearbeitung in der oberen linken Ecke der Button Block hinzufügen angezeigt wird, verwendet dieser Abschnitt den Kreativen Editor.

Ändere im Kreativen Editor die Größe von Blöcken direkt auf der Seite, indem du den Block klickst und ziehst:

  1. Klicke auf der Seite auf Bearbeiten.
  2. Klicke auf den Block, dessen Größe du ändern möchtest. Um die Größe mehrerer Blöcke gleichzeitig zu ändern, klicke und ziehe im Abschnittshintergrund, um alle Blöcke zu markieren, deren Größe du ändern möchtest.
  3. Bewege den Mauszeiger über eines der Quadrate im Umriss eines Blocks, bis der Mauszeiger zu einem Pfeil wird, und klicke und ziehe dann, um die Breite, Höhe oder beides des Blocks zu erhöhen oder zu verringern. Halte beim Ziehen oder Strg gedrückt, um die Größe des Blocks symmetrisch zu ändern. Im Hintergrund wird ein Raster angezeigt, das dir bei der Größenänderung hilft.
  4. Klicke auf das Symbol Mobile Ansicht, um die Größe der Blöcke im mobilen Layout zu ändern. Durch die Größenänderung von Blöcken in der Computeransicht wird die Größe von Blöcken im mobilen Layout nicht geändert.
  5. Klicke auf Speichern, um deine Änderungen zu speichern und die Bearbeitung fortzusetzen, oder klicke auf Beenden und dann auf Speichern, um den Editor zu schließen.

Beachte, dass die Größenänderung zwischen den verschiedenen Arten von Blöcken variieren kann. Du kannst beispielsweise die Breite eines Formular-Blocks ändern, aber die einzige Möglichkeit, seine Höhe zu ändern, ist das Hinzufügen oder Entfernen von Feldern.

Hinweis

Die Stil-Anpassung Seitenbreite (Max) kann sich auf deine Möglichkeit auswirken, die Größe von Blöcken im Kreativen Editor zu ändern. Wenn du die Größe eines Blocks nicht ändern kannst, versuche, diesen Wert auf eine höhere Breite zu ändern.

Indikatoren bei Größenänderung

Beim Ändern der Größe eines Blocks werden gelbe Indikatoren angezeigt, wenn der Block dieselbe Höhe, Breite oder Höhe und Breite wie andere Blöcke im Abschnitt hat. Wenn du beispielsweise die Breite eines Bildes über einem Button-Block änderst, werden am oberen oder unteren Rand beider Blöcke gelbe Indikatoren angezeigt, wenn die Breite des Bild-Blocks mit der Breite des Button-Blocks übereinstimmt. Wenn du die Höhe änderst, werden gelbe Indikatoren am linken oder rechten Rand angezeigt, wenn die Höhen übereinstimmen, und wenn die Blöcke die gleiche Breite und Höhe haben, umrahmen die Indikatoren den gesamten Block.

When_resizing_blocks__indicators_display_when_boxes_match_height__width__or_both.png

When_resizing_blocks__indicators_display_when_boxes_match_height__width__or_both.png

Größe von Blöcken im Klassischen Editor ändern

Alle Websites auf Version 7.0 und bestimmte Stellen auf Websites der Version 7.1 verwenden unseren Klassischen Editor in Block-Inhaltsbereichen. Wenn im klassischen Editor zwei oder mehr Blöcke nebeneinander platziert werden, ändern sie ihre Größe relativ zueinander. Du kannst auf diese Art und Weise die Größe von Blöcken ändern.

Insbesondere erzeugen Abstands-Blöcke Leerräume und können in der Größe angepasst werden, um umgebende Blöcke größer oder kleiner zu machen. Um einen Block im Inhaltsbereich zu zentrieren, kannst du z. B. auf beiden Seiten einen Abstands-Block hinzufügen und dann beide Abstands-Blöcke auf die gleiche Größe anpassen.

Tipp

Beim Anklicken und Ziehen von Blöcken werden schwarze Hilfslinien angezeigt. Wenn die Hilfslinie sich nur über die Höhe des Blocks erstreckt, dessen Größe du änderst, ändert der Abstands-Block nur die Größe dieses Blocks. Wenn die Hilfslinie sich über die gesamte Höhe des Inhaltsbereichs erstreckt, wird eine neue Spalte erstellt.

So änderst du die Größe mithilfe von Blöcken:

  1. Klicke auf eine Einfügemarke.
  2. Wähle im Block-Menü Abstand oder einen anderen Block aus.
  3. Klicke und ziehe den neuen Block neben den Block, dessen Größe du ändern möchtest.
add_spacer.gif
  1. Fahre mit dem Mauszeiger über den Bereich zwischen den beiden Blöcken, bis dein Mauszeiger zu einem Spalten-Skalierer wird. Klicke und ziehe dann, um die Größe der Blöcke anzupassen. Dadurch wird die Größe der umgebenden Blöcke geändert und mehr freier Platz im Inhaltsbereich geschaffen.
centering_with_spacers.gif

Tipp

Um fortgeschrittenere Layouts zu erstellen, lesen Sie unsere Anleitungen zum Bewegen von Blöcken und zum Erstellen von Spalten und Zeilen.

Zuschneidewerkzeug im Klassischen Editor

Im klassischen Editor kannst du die Höhe bestimmter Blöcke mit einem Zuschneidewerkzeug anpassen, sodass die Größe des Inhalts ohne Verzerrungen geändert werden kann. In diesen Blöcken ist das Zuschneidewerkzeug verfügbar:

Um das Zuschneidewerkzeug zu verwenden, klicken Sie auf den Block, klicken Sie dann auf den Kreis, der am unteren Rand des Blocks erscheint, und ziehen Sie ihn.

Tipps zur Verwendung der Zuschneidewerkzeug-Blöcke:

  • Halte die Umschalttaste gedrückt, während du das Zuschneidewerkzeug ziehst, um das Bild in 20-Pixel-Schritten zu skalieren. Auf diese Weise kannst du die Unterseite des Bildes an einem anderen Block ausrichten.
  • In Bild-Blöcken wird das Zuschneidewerkzeug erst angezeigt, nachdem du ein Bild hinzugefügt hast.
  • Doppelklicke auf das Zuschneidewerkzeug, um den Zuschnitt rückgängig zu machen.
  • Ziehe das Werkzeug nach unten, um den Block mittels Zoom zu vergrößern.
  • Klicke und ziehe das Zuschneidewerkzeug nach unten, um das Bild horizontal zuzuschneiden. Bei Bild-Blöcken vergrößerst du so das Bild und trennst die Seiten ab.
cropping_handle.gif
Footer Image
  • Hol dir Hilfe von der Community

  • Hol dir Hilfe von unserer Community zu erweiterten individuellen Anpassungen.

  • Beauftrage einen Squarespace-Experten

  • Hebe dich online von der Masse ab, indem du dir von einem erfahrenen Webdesigner oder Entwickler helfen lässt.