Alle Artikel mit dem Schlagwort “CSS

WordPress Custom CSS
Kommentare 15

Eigenes CSS in ein WordPress-Theme integrieren – so funktioniert’s

Manchmal möchte man nur eine Kleinigkeit an einem WordPress-Theme ändern, zum Beispiel eine Schriftfarbe oder einen Schriftstil anpassen. Wenn diese Änderungen im Theme standardmäßig nicht möglich sind, gibt es alternativ die Option eigenes CSS zu integrieren und so CSS-Eigenschaften des Themes zu ersetzen oder sogar ganz neue CSS-Eigenschaften zu ergänzen. Und wie funktioniert das?

Die Voraussetzung ist, dass man bereits ein wenig mit CSS vertraut ist. Dann ist die Anpassung eines Themes mit eigenem CSS eigentlich gar nicht so schwierig und es gibt drei verschiedene Möglichkeiten das eigene CSS einzubinden. Wenn man wirklich nur ein paar CSS-Eigenschaften ändern oder hinzufügen möchte und sonst das Theme im Standard-Zustand bleiben soll, kann man ein WordPress-Plugin nutzen, wie z.B. Simple Custom CSS oder My Custom CSS. Wer bereits das Jetpack-Plugin nutzt, benötigt überhaupt kein weiteres Plugin, sondern kann einfach die bereits im Jetpack-Plugin integrierte Funktion „Eigenes CSS“ aktivieren und unter Design → CSS bearbeiten mit dem eigenen CSS loslegen. In vielen WordPress Premium-Themes ist außerdem bereits eine Option für das Schreiben von eigenem CSS vorhanden. So spart man sich ebenfalls die Installation einen extra Plugins, der Nachteil ist allerdings, dass so das CSS nicht Theme-unabhängig ist und bei einem Theme-Wechsel verloren geht. Diese Option sollte also nur genutzt werden, wenn speziell CSS des Themes angepasst werden soll. Weiterlesen

Kommentare 4

Buch-Tipp: Sass for Web Designers von Dan Cederholm bei A Book Apart

Auch CSS kann recht kompliziert werden und mit immer anspruchsvolleren Webdesigns werden auch die Stylesheets immer länger und aufwendiger. Sass (kurz für: Syntactically Awesome Stylesheets) bietet dafür eine Lösung, denn z.B. mit Hilfe von Variablen und verschachtelten Regeln (Nested Rules) in Sass kann das Schreiben von CSS sehr viel einfacher werden.

Damit einem der Einstieg und die Arbeit mit Sass leichter gemacht wird, schreibt Dan Cederholm (Gründer von Dribbble, bloggt auf SimpleBits) in seinem neuen A Book Apart-Buch “Sass for Web Designers” eine leicht zu verstehende Anleitung mit Tipps und Tricks zur Arbeit mit Sass.

"Sass for Web Designers" von Dan Cederholm.

“Sass for Web Designers” von Dan Cederholm.

Für alle, die sich bisher noch nicht an Sass herangetraut haben oder noch nicht viel mit Sass gearbeitet haben, bietet das Buch mit seinem ansprechenden Layout und der leicht verständlichen, lockeren Sprache (nur auf Englisch) einen prima Einstieg in die Materie. Wer gleich loslegen möchte kann sich für 9 US Dollar (ca. 6,70€) das eBook downloaden, es gibt aber auch eine sehr schöne gebundene Ausgabe (für 18 US Dollar + Versand) des Buches.

Kommentare 8

Link-Tipps: Hilfreiche, kostenlose Online-Tutorials zum Lernen von HTML & CSS

Learn CSS Layout Jeder der mehr über HTML und CSS erfahren möchte, sollte diese zwei wunderschönen Online-Tutorials (nur in englischer Sprache) auf keinen Fall verpassen. Auf der Webseite “Learn CSS Layout” kannst du dich Klick für Klick durch einen praktischen Guide mit vielen modernen CSS-Tipps (auch zur Entwicklung von mobile-ready Websites) durcharbeiten. Die Webseite richtet sich an Anfänger, doch auch geübtere CSS-Fans können auf der übersichtlich gestalteten Seite bestimmt noch so einiges mitnehmen.

Weiterlesen

Kommentare 18

CSS für Anfänger (Teil 1): Deine CSS-Fragen beantwortet

CSS Tipps für Anfaenger Da einem schnell mal der Kopf schwirrt und viele Fragen auftauchen können, wenn man mit CSS noch nicht so vertraut ist, werde ich in den folgenden zwei Artikeln ein paar Antworten zusammen gestellt, die dir den Start in die Arbeit mit CSS hoffentlich erleichtern. Wenn du weitere CSS-Fragen oder hilfreiche CSS-Tipps für Newbies hast, schreibe mir diese doch einfach in einem Kommentar hier im Artikel.

Weiterlesen

Kommentare 26

CSS-Tipp: rem als Einheit für Schriftgröße nutzen

rem hat dieses mal nichts mit Musik zu tun, sondern es ist der Begriff der CSS3-Schriftgrößeneinheit rem (= root em) gemeint. rem verhält sich genauso wie em mit dem einzigen Unterschied, dass das sich der rem-Wert am Root-Element orientiert (also an der Schriftgröße, für body bzw. html), statt sich wie em an der Schriftgröße des jeweiligen Eltern-Elements zu orientieren. Weiterlesen

Kommentare 6

Video-Tipp: HTML- und CSS-Elemente schnell im Browser kontrollieren


Im folgenden kleinen Video-Tutorial möchte ich dir kurz zeigen, wie du mit Hilfe des Google Chrome Developer Tools oder der Firefox- und Safari-Erweiterung Firebug HTML und CSS-Elemente einer Webseite direkt im Browser kontrollieren kannst. So kannst du z.B. schnell die CSS-Klasse und die verwendeten CSS-Eigenschaften eines HTML-Elements heraus finden und diese dann gegebenenfalls anpassen oder, wenn du an einem WordPress Child-Theme arbeitest, in deinem eigenen Stylesheet neu definieren. Weiterlesen

Kommentare 18

Ein Glossar in HTML und CSS erstellen – so funktioniert’s

Um ein Glossar, z.B. auf deinem WordPress-Blog zu erstellen, benötigst du eigentlich kein extra Plugin. Mit ein paar Zeilen HTML und einigen extra CSS-Styles kannst du in wenigen Schritten dein eigenes Glossar einrichten. Ich habe den benötigten HTML und CSS Code bereits vorbereitet, so dass du diesen nur noch in deine eigene Webseite einfügen und deine Glossar-Beschreibungen eintragen musst. Weiterlesen