Prozess- / Check-Out-Navigation mit CSS

prozessnavigation-css

Bei der Gestaltung von Prozess- bzw. Check-Out-Navigationen wird häufig auf Grafiken zurückgegriffen, um das gewünschte Aussehen zu erreichen.
In diesem Beitrag zeigen wir euch eine Lösung, wie ihr eine solche Navigation mit reinem CSS und ganz ohne Grafiken realisieren könnt. Wir gehen dabei auf eine Lösung mit floatenden Elementen und auf eine Lösung mit dem CSS Flexbox-Modell ein.

Beitrag zu Ende lesen

Quantity Queries – Layout-Veränderungen über die Anzahl an Elementen steuern

quantity-queries

Im responsive Design wird i.d.R. mit Hilfe von Breakpoints das Layout umstrukturiert, sobald eine bestimmte Displaygröße erreicht ist. Schwierig wird es allerdings, wenn man zum Zeitpunkt der Entwicklung nicht weiß, wie breit ein bestimmtes Element ist. Beispielsweise weil die Ausgabe dynamisch erfolgt oder weil ein Kunde über das CMS selbstständig Inhalte ergänzen kann. Hier kommen die sog. Quantity Queries (Mengenabfragen) ins Spiel: Mit ihrer Hilfe kann die Darstellung verändert werden, sobald eine festgelegte Anzahl an Elementen unter- und/oder überschritten wird.

Beitrag zu Ende lesen

CSS-Hack für den Internet Explorer 10 (IE10)

ie10-logo

Der Internet Explorer von Microsoft ist bekannt für die fehlerhafte Interpretation von CSS-Eigenschaften. Um das Problem zu lösen, greift man häufig auf Conditional Comments zurück, um gezielt einzelne Versionen des Internet Explorers anzusprechen und die Fehler zu korrigieren. Für den IE10+ existieren leider keine Conditional Comments mehr und ihr bekommt Schwierigkeiten, falls ihr speziell für diesen Browser Elemente gesondert ansprechen wollt. Doch mit einem CSS-Hack lässt sich das Problem lösen.
Beitrag zu Ende lesen

Die CSS-Eigenschaft »object-fit« – Flexible Grafiken im HTML-Markup

css-object-fit

Mit der CSS-Eigenschaft object-fit lassen sich Bilder und Videos, die im HTML-Markup liegen zentrieren und zuschneiden. Die CSS-Eigenschaft background-size, für die Positionierung von CSS-Hintergrundbildern dürfte jedem soweit ein Begriff sein. Mit der Eigenschaft object-fit ist diese Positionierung auch mit Grafiken und Videos, die im HTML-Code liegen möglich.

Beitrag zu Ende lesen

WordPress: RSS-Feeds von Custom Post Types zum Haupt-Feed hinzufügen

custom-post-types-wordpress-feeds

Custom Post Types werden im normalen WordPress-Feed nicht ausgegeben. Das ist ärgerlich, da Custom Post Types in WordPress sehr häufig verwendet werden und viele Blog-Betreiber einen zentralen Feed mit allen Inhalten der Website bereitstellen möchten. Mit einem kleinen Snippet kann das Problem jedoch behoben werden und die Custom Post Types werden dem Haupt-Feed von WordPress hinzugefügt.

Beitrag zu Ende lesen

WordPress: Mitarbeitern (Contributors) den Bild-Upload erlauben

dateiupload-wordpress

In WordPress haben Benutzer mit dem Status »Mitarbeiter« normalerweise keine Möglichkeit Bilder in die Mediathek hochzuladen. Insbesondere wenn ihr in eurem Blog Gastautoren beschäftigt bietet sich jedoch die Benutzerrolle Mitarbeiter ideal an, da Autoren mit dieser Rolle keine Beiträge veröffentlichen können. Der einzige Nachteil an dieser Benutzerrolle, ist der bereits erwähnte, fehlende Datei-Upload. Mit einer kleinen Anpassung kann diese Funktion nachgerüstet werden.

Beitrag zu Ende lesen