kulturbanause Blog

Responsive Design, WordPress, Konzeption, HTML, CSS, JS & UX/UI …


Prüfen, ob ein WordPress-Navigationsbereich (wp_nav_menu) ein Menü enthält

In WordPress können über die Funktion wp_nav_menu Navigationsbereiche registriert und im Template platziert werden. Im Administrationsbereich hat der Administrator anschließend die Möglichkeit die Navigationsbereiche mit Menüs zu bestücken.
Je nach Theme sollte geprüft werden, ob ein Bereich auch eine Navigation enthält. Beispielsweise weil die Navigation auf dem Smartphone hinter einem Button versteckt wird und dieser Button natürlich keinen Sinn macht, wenn gar keine Links vorhanden sind.

Beitrag zu Ende lesen

Webfonts mithilfe eines Webfont-Anbieters einbinden

Webfont-Anbieter Google Fonts, Adobe Edge, Typekit

Webfont-Anbieter ermöglichen es, Webfonts auf einfache und bequeme Weise in eine Website zu integrieren. Der große Vorteil ist, dass ihr die Schriften nicht kaufen, oder euch um das Lizenzmodell Gedanken machen müsst. Mittlerweile gibt es einige kostenfreie Anbieter für Open-Source-Schriften wie Google Fonts oder Adobe Edge Web Fonts. Wer auf der Suche nach hochwertigen Font-Klassikern ist, findet bei einem kommerziellen Anbieter wie Typekit den passenden Webfont. In diesem Beitrag zeigen wir euch, wie ihr die Web-Dienste nutzen und die Schriften auf eurer Website einbinden könnt. Beitrag zu Ende lesen

CSS counter() – zählen mit CSS

In CSS existieren verschiedene Selektoren um ein Element über zählen zu identifizieren. Mit h2:nth-of-type(4) lässt sich beispielsweise die vierte »Überschrift 2« in einem bestimmten Abschnitt auswählen und entsprechend gestalten.
CSS Counter verhalten sich anders, denn es handelt sich hierbei nicht um einen Selektor, sondern um eine Eigenschaft die zählt und einen Zahlwert ausgeben kann. Mit einem Counter würde also nicht die vierte Überschrift ausgewählt, sondern auf der Website angezeigt, dass es sich um die vierte Überschrift handelt.

Beitrag zu Ende lesen

Die CSS calc()-Funktion – Berechnungen mit CSS

Moderne Web-Layouts werden zunehmend komplex, gleichzeitig versuchen Entwickler den Code immer weiter zu verschlanken und zu optimieren. Insbesondere im Responsive Design verwendet eine Website beispielsweise mehrere Gestaltungsraster mit unterschiedlichen Spaltenzahlen. Das führt oft zu Problemen bei der Vergabe von CSS-Klassen. Eine schöne Möglichkeit den Code von solch überflüssigen CSS-Klassen zu befreien bieten die Kalkulationsmöglichkeiten mit Hilfe der CSS-Eigenschaft calc(). Ähnlich sieht es aus, wenn Pixelwerte von Prozentwerten abgezogen werden sollen. Beispielsweise um Werbebanner in einem ansonsten flüssigen Layout zu platzieren.

Beitrag zu Ende lesen