sssupers ist ein Squarespace Spezialist Webdesign Studio mit Website Boutique, das vom Fotografen und Designer Rasmus Schübel geführt wird. "Ich helfe meinen Kunden, ihre Website als sicheren Hafen der Selbstdarstellung im Internet zu erleben und verkaufe in meiner Boutique schlüsselfertige, maßgeschneiderte Websites an qualitätsbewußte Kunden mit Stil."

 

Alles über Blocks

 

RESTÉZ EN LIGNE, S'IL VOUS PLAÎT.

WAS SIND BLOCKS?

Blocks bilden die Grundlage Ihrer Website. Sie können Blocks hinzufügen, bewegen und in unendlichen Variationen miteinander kombinieren, um auf Ihren Seiten einzigartige Layouts zu gestalten. Jede Sorte von Block ist geschaffen, um unterschiedliche Arten von Inhalt in fast allen Bereichen Ihrer Website einzufügen, nämlich in:

 Das Ganze ist wie immer mehr als die Summe seiner Teile.

Das Ganze ist wie immer mehr als die Summe seiner Teile.

• Einfachen Seiten
• Blogbeiträgen
• Seitenleisten (Sidebars)
• Fußzeilen (Footer)
• Events
• Produktseiten (im Bereich der Produktbeschreibung

.

.

 

1. Einen Block hinzufügen

Schritt 1 - Einen Bereich für die Bearbeitung öffnen

Gehen Sie zu der Seite, auf der Sie Inhalte ändern oder hinzufügen möchten. Klicken Sie auf den Pfeil in der oberen, linken Ecke Ihrer Seite, um die Seitenvorschau zu schließen und das Bearbeitungsmenu zu öffnen. 

Bewegen Sie Ihren Mauszeiger über den Bereich, den Sie bearbeiten möchten und klicken Sie 'Edit'.

Bewegen Sie Ihren Mauszeiger über einen leeren Bereich, um einen EInfügepunkt zu finden, der wie ein seitlich liegener Tropfen aussieht. Ein Klick auf einen solchen Bearbeitungspunkt öffnet das Block-Menu. Hier erfahren Sie mehr über Bearbeitungspunkte:

• Die Linie, die vom Bearbeitungspunkt ausgeht, zeigt Ihnen den Raum, den ein neuer Block ausfüllen wird.

• Abhängig von der Länge der angezeigten Linie können Sie die Größe und Position des Blocks auswählen, denn diese hängt vom bearbeitbaren Bereich ab.

Schritt 2 - Einen Block auswählen

Klicken Sie auf einen Bearbeitungspunkt und wählen Sie einen Block aus dem Block-Menu. Wenn Sie eine Suche bevorzugen, können Sie im Suchfeld am oberen Rand des Auswahlmenus Ihren Wunschblock eingeben, der Ihnen sodann angezeigt wird. Unten folgen einzelne Beschreibungen der verschiedenen Arten von Blocks.

Alle Squarespace Blocks auf einen Blick - zum Vergrößern bitte Klicken.

.

 

2. Grundlegende Blocks

 

Text Block 

Fügen Sie Text in ihre Seite ein, einschließlich Überschriften, Zitate, vorformatierten Text, Links und Listen. 


Markdown Block

Fügen Sie Text in der Markdown Programmiersprache ein. 


Quote Block

Fügen Sie gestaltete Zitate und Referenzaussagen ein. 


Image Block

Fügen Sie ein einzelnes Bild ein. 


Video Block

Fügen Sie ein außerhalb Ihres Computers gespeichertes Video ein


Audio Block

Fügen Sie ein einzelnes Audio Element in einem anklickbaren Block zum Abspielen hinzu. Laden Sie ein Dokument von ihrem Computer hoch oder fügen Sie einen Link zu einer außerhalb ihres Computer gespeicherten Datei ein. 


Embed Block

Fügen Sie externe Inhalte in ihrer Seite ein, indem sie Tweets, Videos und andere Quellen heranziehen.

.

 

3. Galerie Blocks

Karussell Galerie Block

Fügen Sie eine Bildergalerie oder Videos in einem Streifen mit waagerechter Anordnung hinzu.


Gitter Galerie Block

Fügen Sie eine Bildergalerie oder Videos in der Anordnung eines symmetrischen Gitters hinzu. 


Diaschau Galerie Block

Fügen Sie eine Bildgalerie oder Videos als Diaschau hinzu. 


Gestapelter Galerie Block

Fügen Sie eine senkrecht angeordnete Reihe von Bildern oder Videos hinzu. 

.

 

4. Summary Blocks (Zusammenfassungs-Blocks)

Diese Art von Blocks stellen eines der machtvollsten Werkzeuge von Squarespace dar. Der Summary Block fasst die Inhalte von Blogs, Galerien und Events zusammen, indem nur die wesentlichen Informationen gefiltert und dargestellt werden. So lassen sich Inhalte etwa Pinterest-artig oder als Liste anzeigen, was eine magazin-artige Darstellung ermöglicht.  In den Einstellungen der Summary Blocks lassen sich die anzuzeigenden Details jederzeit an- und abwählen und die Darstellung der Bildauszüge ganz nach Wunsch in Anzahl, Abstand und Anordnung anpassen. 


TIPP: Innerhalb eines Summary Blocks besteht eine Begrenzung auf 30 anzuzeigende Objekte. Möchten Sie mehr als 30 Beiträge oder Objekte anzeigen, können Sie die Inhalte der Quellen ( Blogbeiträge, Events etc.) mit Tags oder Kategorien versehen und in der Einstellung des Summary Blocks nach diesen Tags oder Kategorien filtern. Anschließend werden die unterschiedlich gefilterten Blocks untereinander angeordnet. 

Gestapelter Summary Block

Fassen Sie Inhalte in einer etagenartigen, übereinandergestapelten Ansicht zusammen. 


Karussell Summary Block

Hiermit zeigen Sie eine Reihe von Inhalten gleichzeitig an -wobei sie über Navigations-Pfeile in der oberen linken Ecke durch die Inhalte navigieren können. 


Listen Summary Block

Zeigen Sie Inhalte in einer einzelnen Spalte an - mit Vorschaubildern auf der einen und Text auf der anderen Seite. 


Gitter Summary Block

Zeigen Sie Inhalte in einem symmetrischen Gitter mit darunter stehenden Titeln und Beschreibungen an. 


.

 

5. Noch mehr Blocks

Bands-In-Town Block

Zeigen Sie Tourdaten aus Ihrem Bandsintown-Profil an. 


Kalender Block 


Displays items in your pages, like events, as a calendar sorted by day.


Code Block 

Fügen Sie individuellen Programmiercode ein (etwa für Widgets von Drittanbietern) oder zeigen Sie formatierten Code in Schriftform an.


Formular Block 

Fügen Sie ein Formular hinzu, um Informationen von Ihren Besuchern zu sammeln und den Kontakt zu Ihnen herzustellen. Ein hilfreiches und mächtiges Werkzeug für Kontaktanfragen, Umfragen, Bestellformulare und Programm-Anwendungen.


Fügen Sie eine horizontale Linie zwischen zwei Block ein. Linien sind eine großartige Hilfe, um Text aufzubrechen oder Inhalte visuell voneinander zu trennen.


Karten Block 

Fügen Sie eine Google Karte mit einer Markierung an Ihrem Ort hinzu.


Menu Block 


Gestalten Sie das Menu Ihres Restaurants.


Newsletter Block 


Mit diesem Block fügen Sie ein Newsletter-Abonnement-Formular hinzu. Für die Funktion der Mailing Liste benötigen Sie daher einen aktiven MailChimp Account.


OpenTable Block 

Fügen Sie eine Restaurant-Reservierung von OpenTable hinzu. Sie benötigen für diesen Block nachvollziehbarerweise eine OpenTable Restaurant ID.


Fügen Sie einen einstellbaren Raumteiler und Abstandhalter als Puffer zwischen beliebigen Blocks ein.

.

 

6. Filter- und Listen-Blocks

Archiv Block

Aus allen Inhalten, deren Aufruf über Links gesteuert werden (Überschriften von Blogartikeln, Events, Shopartikeln etc.) können mit dem Archivblock organisierte Listen erstellt werden. Ebenso können diese Inhalts-Links über die ihnen zugeordneten Tags und Kategorien gefiltert werden. 


MERKE: Ein Archivblock stellt - anders als ein Summary-Block - keine Bilder und Bildvorschauen dar. Der Archchivblock ersetzt seit Sommer 2015 die Tag-List-, Author-List- und Category List-Blocks.

Schaltflächen-Block 


Fügen Sie Schaltflächen (Buttons) und Aufforderungen zu bestimmten Aktionen hinzu (Call-To-Action).


Inhalts-Link Block 


Fügen Sie mit diesem Block einen hervorgehobenen Link hinzu.


Block für die Suche nach Inhalt (klingt etwas philosophisch, ist aber sehr praktisch)

Fügen Sie mit diesem Block eine Suchbox hinzu. Kleiner Wermutstropfen: derzeit kann das in der Box lesbare Wort 'SEARCH' weder übersetzt noch verändert oder verborgen werden. Immerhin können Sie zwischen einer hellen und dunklen Variante der Suchbox wählen. Sobald diese Modifikationen möglich werden, gebe ich eine Party!


Summary Block (Zusammenfassungs-Block)


Präsentieren Sie Ihre Inhalte in zusammenfassenden, magazinartigen Layouts.


Tag Cloud Block 

Stellen Sie Tags or Kategorien in einer grafischen Wolkenanordnung dar.

.

 

7. Blocks für den online-Handel

Amazon Block 

Zeigen Sie einen Artikel auf Amazon an und setzen Sie einen Link dorthin. Dieser Block ist insbesondere hilfreich, wenn Sie am Amazon Affiliate Programm teilnehmen.


Donation Block 

Ermöglichen Sie Besuchern, Ihre Organization oder einen guten Zweck mit einer Spende zu unterstützen. Dieser Block erfordert einen aktivierten und verbundenen STRIPE account.


Produkt Block 

Fügen Sie ein Produkt aus Ihrem Squarespace-online-Shop zu einer Seite oder einem Blogpost hinzu. Dieser Block stellt eine großartige Weise dar, Ihre Produkte zu promoten oder gezielt Produkte an anderer Stelle als Ihrem Shop darzustellen und anzubieten.

.

 

8. Diagramm- und Statistik-Blocks

Balkendiagramm Block 

Fügen Sie mit diesem Block eine Balkengrafik hinzu.


Line Chart Block 

Fügen Sie mit diesem Block eine Linien-Grafik hinzu.


Tortendiagramm Block 

Fügen Sie mit diesem Block eine Torten- oder Donut-Grafik hinzu.

.

 

9. Blocks für soziale Netzwerke

500px Block 

Add images from your 500px account.


Flickr Block 

Fügen Sie eine Galerie Ihrer Flickr Photos hinzu.


Foursquare Block 

Betten Sie den Stream Ihrer Foursquare Check-Ins automatisch aktualisiert in Ihre Website ein.


Instagram Block 

Fügen Sie eine automatisch aktualsierte Galerie Ihrer Instagram-Photos hinzu.


RSS Block 

Fügen Sie einen Link zum RSS-Feed eines Blogs hinzu.


Social Links Block 

Fügen Sie Icons zu sozialen Netzwerken hinzu. Dieses ist eine Alternative, falls Ihr Template in seiner Grundeinstellung keine Netzwerk Icons voreingestellt hat.


SoundCloud Block 

Erweitern Sie Ihre Seite um einen SoundCloud Player.


Twitter Block 

Fügen Sie einen sich automatisch aktualisierenden Twitter-Block und einen Follow-Button hinzu.

.

 

10. Blocks in Action 

Fügen Sie einen oder mehrere Blocks auf einer Seite oder einen Inhaltsbereich ein. Sie können:

BEWEGEN: Blocks können intuitiv in Spalten und Reihen frei angeordnet werden.
ANPASSEN: Einige Blocks (z.B. der Bildblock) verfügen über eigene Größenregler, alle Blocks wiederum reagieren auf den 'SPACER' Abstands-Block mit Größenveränderung.
LÖSCHEN Sie einen Block, indem Sie ihn anfassen und mit gedrücktem Mauszeiger auf den unteren Bildschirmrand zubewegen. Dort erscheint sodann ein Papierkorb-Symbol, auf das Sie den Block fallen lassen.


Ebenso können Sie während des Editierens eines Blocks auf die Schaltfläche 'REMOVE' klicken. Bei der nun folgenden Sicherheits-Abfrage haben Sie die Möglichkeit, zwischen 

CANCEL (Abbruch des Löschvorganges und weitermachen mit dem Editieren

REMOVE (Verwerfen eingegebener Informationen und Löschung Blocks) und 

SAVE (Speichern eingegebener Informationen und Löschung des Blocks) auszuwählen.

Sie werden nun nach einer letzten Bestätigung gefragt: Wollen Sie das wirklich ? Eine Bestätigung dieser letzten Sicherheitsstufe löcht den Block unwiderruflich und unwiederherstellbar mit all seinen Inhalten.


Ein anschauliches Beispiel

In der unten stehenden Demonstration sehen die Bearbeitung einer einfachen Seite. Wir haben SECHS Blocks:

• 2 Blocks für waagerechte Trenn-Linien

• 1 OpenTable Block

• 2 Text Blocks

• 1 Bild Block

Die Blocks sind so angeordnet, daß sich ein eigenständiges Layout ergibt:

Die Linien Blocks und der OpenTable Block stehen in einer jeweils eigenen Reihe in ihrem eigenen Block..

Die Text Blocks stehen nebeneinander angeordnet unter dem OpenTable Block.

Der Bildblock steht in voller Breite unter den beiden Text Blocks.


Da Sie nun alles über Blocks wissen, können Sie damit sofort loslegen und eine SEITE AUFBAUEN

Viele kleine Blocks bilden eine großartige Seite: so macht INHALTE ANORDNEN Freude!