Texte durchstreichen, hervorheben & mehr bei Squarespace
Weil Squarespace so sehr darauf bedacht ist, alles schön lean, clean und simpel zu halten, sind ein paar Funktionen als Standard nicht vorhanden. Vielleicht ging es dir auch schon mal so, dass du dachtest: Waas? Wieso geht das nicht?!
Zum Beispiel wäre es ziemlich praktisch, wenn du deinen Text oder Überschriften unterstreichen oder durchstreichen könntest, oder?
Zum Glück sind solche Details einfacher umzusetzen, als man meinen könnte - und keine Angst, mit nur ein ganz klein wenig Code. (Diese Special-Effekte solltest du meiner Meinung nach ohnehin sehr sparsam verwenden. Weswegen ich es sehr verständlich finde, dass Squarespace sie nicht als Standard ansieht. Denn wie gesagt: Squarespace-Websites sind ja genau dafür bekannt, minimalistisch-edel auszusehen.) ✨
In diesem Post habe ich ein paar meiner liebsten Styling-Optionen für Squarespace-Texte zusammengefasst, die es dir leichter machen, deine Texte darzustellen, wie du es möchtest!
Inhaltsverzeichnis:
👉 Ständig frische Tipps für deine Squarespace-Website? Abonniere jetzt meinen Youtube-Kanal mit laufend neuen Tutorials! 🎥
Texte bei Squarespace durchstreichen
Wenn du einen Text durchstreichen willst, geht das ziemlich leicht.
Du erstellst dafür an der Stelle deiner Wahl einen Code-Block:
Dann fügst du das Folgende als HTML ein:
<del><h3>Deine Überschrift</h3></del>
So sieht das dann aus:
Als Nächstes ersetzt du “Deine Überschrift” mit deinem Text.
Und dann?
Musst du nur noch festlegen, welchen Text-Stil du haben möchtest. Ich habe zum Beispiel Überschrift 3 (h3) ausgewählt. Für normalen Text musst du die beiden Male “h3” durch “p” ersetzen, oder durch “h1” oder “h2” für Überschrift 1 oder 2.
Das Ganze sieht dann so aus:
Deine Überschrift
Fertig!
Text bei Squarespace unterstreichen
Um bei Squarespace bestimmte Textarten (wie z.B. Überschriften) zu unterstreichen, gehst du zu “Design” > “Benutzerdefiniertes CSS” und gibst das Folgende ein:
h1 {
text-decoration: underline;
}
In diesem Fall wird Überschrift 1 (“h1”) unterstrichen - alternativ kannst du aber auch h2 oder h3 unterstreichen lassen.
Wenn du das nicht überall, sondern nur an einer bestimmten Stelle oder auf einer ganz bestimmten Seite anzeigen lassen willst, änderst du das Ganze ab zu:
.#blockID h1 {
text-decoration: underline;
}
Dann musst du “#blockID” noch durch genau den Block ersetzen, den du ändern willst. Wie du bei Squarespace einzelne Block-IDs herausfindest, kannst du hier lesen.
Sondertipp: Link-Unterstreichungen weglassen
Vielleicht ist dir aufgefallen, dass auf meiner Website Links keine Unterstreichungen haben. Also, dass alle Links nicht unterstrichen werden. Das ist extra von mir so eingerichtet - ich finde das nämlich schöner und arbeite lieber nur mit Farben 😉
Wie du auch für deine Seite die Link-Unterstreichungen ausblendest, findest du in diesem Artikel.
Kasten um bestimmte Überschriften setzen
Du kannst Überschriften auch in einen Kasten setzen, so wie hier:
Dazu gehst du zu “Design” > “Benutzerdefiniertes CSS” und gibst das Folgende ein:
h1 {border: solid !important;}
Dadurch werden alle Überschriften 1 (h1) durch einen Kasten “eingekästelt”.
Wenn du das nicht überall, sondern nur an einer bestimmten Stelle willst, änderst du das Ganze ab zu:
.#blockID h1 {border: solid !important;}
Wobei du “#blockID” noch durch den speziellen Block ersetzen musst. Wie du bei Squarespace einzelne Block-IDs herausfindest, kannst du hier lesen.
Texte bei Squarespace mit farbigem Hintergrund versehen
Vielleicht möchtest du den Hintergrund deines Textes markieren, also quasi “wie mit einem Textmarker anmalen”.
Das geht natürlich bei Squarespace auch! Weil das ein paar mehr Schritte sind, habe ich das in einem eigenen Blogpost zusammengefasst. Aber keine Angst - das geht trotzdem immer noch recht zügig.
Und du bekommst damit ein paar sehr tolle Effekte hin!
👉 Du startest gerade erst? Teste Squarespace hier 14 Tage lang gratis & hol dir mit dem Code VICTORIA10 10% Rabatt auf dein erstes Jahr (Das ist natürlich Werbung für meinen Liebling Squarespace)
Tipp: Ganz neu richten wir für dich als Blogleser alternativ sogar einen special 20%-Rabatt ein. → Bekommst du hier.
Falls du Fragen zu diesen Funktionen oder weiteren Text-Styling-Möglichkeiten bei Squarespace hast, schreib sie einfach in die Kommentare!
Diese Artikel könnten dich auch interessieren:
