Benutzerdefinierte Felder (Custom Fields) in die Suche von WordPress integrieren

wordpress-custom-field-search

Mit Hilfe der sog. Benutzerdefinierten Felder (Custom Fields) kann der WordPress-Editor um zusätzliche Eingabefelder erweitert werden. Leider werden die Inhalte der Custom Fields bei der WordPress-Suche ignoriert und eventuell relevante Ergebnisse folglich nicht in den Suchergebnissen angezeigt. In diesem Beitrag archivieren wir ein Snippet das Custom Fields zur WordPress-Suche hinzufügt. Beitrag zu Ende lesen

Parallelogramme mit CSS erstellen

css-parallelogram

Im modernen Webdesign wird häufig auf rechteckige Gestaltungselemente zurückgegriffen. Ein Parallelogramm kann diese klaren Strukturen brechen und mehr Abwechslung ins Layout bringen. Wie ihr mit Hilfe von CSS ganz einfach Parallelogramme erstellen könnt bei denen der enthaltene Text nicht verzerrt wird, erklären wir euch in diesem Artikel anhand des Beispiels einer Navigation. Beitrag zu Ende lesen

Hintergrund-Grafiken mit CSS positionieren

css-positionierung-hinterguende

Mit CSS lassen sich Hintergrund-Grafiken einbinden und positionieren. Welche Möglichkeiten man bei der Positionierung dieser Grafiken hat, wollen wir euch in diesem Artikel zeigen. Dabei gehen wir neben der CSS-Eigenschaft background-position auch auf die Eigenschaften background-clip und background-origin ein und zeigen euch anhand von Beispielen ihre Auswirkungen auf die Hintergrundgrafik. Beitrag zu Ende lesen

Material Design – Die Designsprache von Google

material-design

»Material Design« ist eine von Google stetig weiterentwickelte Designsprache. Sie verbindet die Gestaltungsregeln des klassischen Grafik-Designs mit den Möglichkeiten digitaler Benutzeroberflächen. Ziel von Material Design ist u.a. die Verbesserung der Benutzerfreundlichkeit. Darüber hinaus hat Material Design einen charakteristischen Look, so dass im Material Design gestaltete Interfaces sich ideal kombinieren lassen.

In diesem Artikel erklären wir euch, worin der Unterschied zum Flat Design besteht und welche Gestaltungsregeln beim Material Design berücksichtigt werden sollten.

Beitrag zu Ende lesen

Automatisches Canonical-Tag von WordPress entfernen

wordpress-canonical

Mit Hilfe des sog. Canonical-Tags wird die kanonische URL einer Unterseite angegeben. In diesem Zusammenhang gibt es einiges zu beachten, doch wenn alles richtig gemacht wurde, kann der Canonical Tag dabei helfen Double-Content zu vermeiden und das Suchmaschinen-Ranking zu verbessern. WordPress erzeugt den notwendigen Code automatisch und fügt ihn in den <head> der Website ein. In den meisten Fällen ist das gewünscht – jedoch nicht immer. In diesem Beitrag archivieren wir ein Code-Snippet, mit dem ihr den automatisch erzeugten Canonical-Tag von WordPress entfernen könnt.

Beitrag zu Ende lesen

Defekte Bilder in WordPress 4.4 korrigieren

wordpress-rwd-images

Mit WordPress 4.4 haben responsive Images Einzug in das CMS gehalten. Leider führt die Funktion bei zahlreichen Anwendern zu Problemen mit der Bilddarstellung. Auch ich konnte das Problem bei zwei laufenden Projekten rekonstruieren. Mit einem kleinen Code-Snippet kann die Funktion deaktiviert werden. Die Zeit bis zur Korrektur lässt sich so überbrücken.

Beitrag zu Ende lesen

Gezeichnete SVG-Pfade mit CSS animieren

svg-css-line-draw-animation

Mit SVG/CSS-Animationen lassen sich ansehnliche Effekte erzeugen. Sehr beliebt ist beispielsweise der sog. »Line-Draw-Effect«, bei dem ein Pfad animiert gezeichnet wird. Um den Effekt herzustellen, behilft man sich einem Trick im Zusammenhang mit gestrichelten Linien. In diesem Beitrag erklären wir das Grundprinzip anhand eines leicht nachvollziehbaren Beispiels.

Beitrag zu Ende lesen