Standard-Theme Twenty Sixteen

Im Dezember kommt WordPress 4.4 und auch diesmal mit einem neuen Standard-Theme. Die Bezeichnung des Themes dürfte wenig überraschen, gemäß der WordPress Tradition unter dem Namen „Twenty Sixteen“. Vorgestellt wurde das Theme bereits Ende August und wieder von Takashi Irie gestaltet, welcher schon für das Design des Vorgängers verantwortlich war. Das Erscheinungsbild ist sehr einfach und modern gehalten, um wie schon bei Twenty Fifteen den Fokus auf den Inhalt zu legen, was ich persönlich sehr begrüße.

Hier die Startseite:

twenty_sixteen_k, Standard-Theme Twenty Sixteen Screenshot Twenty Sixteen, Quelle: WordPress.org

Anders als beim Vorgänger, ist der Headbereich diesmal horizontal angeordnet und beherbergt auch die Navigationsleiste. Auch ein Banner oder „Header-Bild“ für den Kopfbereich lässt sich definieren.

header_bild, Standard-Theme Twenty SixteenDies erscheint dann unter dem Logo und der Navigation (Siehe Abbildung links). So sind mehr Gestaltungsmöglichkeiten gegeben, um Inhalte auch optisch abzugrenzen.

Der Inhaltsbereich (Content) ist zweigeteilt in den eigentlichen Inhalt und eine Sidebar zum Einsatz diverser Widgets. Alternativ steht ein Template zu Verfügung, welches ohne Sidebar arbeitet und sich so über den kompletten Content erstreckt. Auch hiermit lassen sich Inhalte flexibel gestalten.

„Header-Bild“, Quelle: WordPress.org

Auch verschiedene Farbschemata stehen zur Auswahl, mit welchen sich das komplette Erscheinungsbild ändern lässt. Zur Auswahl stehen folgende Farbschema: default (weiß), green, yellow, gray & dark. (Siehe Abbildung)

twenty_sixteen_color-scheme, Standard-Theme Twenty SixteenTwenty Sixteen Color-scheme, Quelle: WordPress.org

Weitere Features sind eine (fast) selbstverständliche Anpassung an Mobil-Geräte, nach dem „Mobile-First“ Ansatz, also eine Entwicklung von kleinen Displaygrößen hin zu größeren. Auch drei Schriftarten per Google-Webfonts sind eingebunden.

Insgesamt macht das neue Standard-Theme Twenty Sixteen einen durchdachten, modernen Eindruck mit diversen Einsatzmöglichkeiten. Wer sich schon jetzt mit dem Theme beschäftigen will, kann dies tun, da es inzwischen zum Download verfügbar ist. Das Standard-Theme Twenty Sixteen finden Sie auf folgenden Webseiten zum Download:

Weitere Informationen zum Template finden Sie hier, der offiziellen Mitteilung von WordPress.org.

secutecc.de

Webauftritt der Leipziger Sicherheitsfirma SECUTECC Gbr. Hierbei handelte es sich um eine einfache Firmenwebseite mit Informationen zum Unternehmen und themenspezifischen Informationen. Da spätere Content-Pflege durch das Unternehmen getätigt wird, haben wir hier ein CMS-System zum Einsatz gebracht. Template Anpassungen an jegliche Monitorgrößen per CSS3 und Integration einer Javascript-Slideshow per Plug-in. Die Seiten finden Sie hier …

www.secutecc.de

Sauberer WordPress Header

WordPress hat die unschöne Angewohnheit, sich mit nicht immer sehr nützlichen Meta-Tags im head-Bereich des HTML-Dokuments zu verewigen. Jetzt ist Datenballast nie sonderlich von Vorteil, so werden zum einen die HTML-Dokumente entsprechend größer, aber auch andere Probleme könnten dadurch zumindest begünstigt werden, beispielsweise Angriffe auf die Webseite durch die genaue WordPress-Version im Header.

Natürlich gibt es Plugins die einem da Abhilfe schaffen, allerdings sollte man es mit Plugins nicht übertreiben und zudem gibt es auch eine einfache Möglichkeit dies zu ändern. Einige PHP-Anweisungen in der „functions.php“ im aktuellen Theme-Verzeichnis genügen. Hier eine paar Beispiele von möglichen Einträgen, mit Erklärung was damit bewirkt wird.

Hinweis: Wie der Eintrag zu machen ist, hängt vom Aufbau eurer functions.php ab, ich spare mit zu erklären das die Anweisungen natürlich zwischen PHP-Tags zu setzen ist (<?php …. ?>). Wer einen RSS-Feed betreibt lässt natürlich die RSS-Einträge aktiv.

// WP-header bereinigen
//
// Really Simple Discovery Eintrag entfernen
 remove_action('wp_head', 'rsd_link');
// WordPress-Version entfernen
 remove_action('wp_head', 'wp_generator');
// Zeigt die Links zu den Haupt-Feeds, also Post und Comment Feed
 remove_action('wp_head', 'feed_links', 2);
// Zeigt links zu Extra-Feeds, z.B. Kategorien Feeds 
remove_action('wp_head', 'feed_links_extra', 3);
// index link entfernen
 remove_action('wp_head', 'index_rel_link');
// Windows Live Writer entfernen
 remove_action('wp_head', 'wlwmanifest_link');
// Entfernt die relationalen Links, ausgehend vom Start-Post
 remove_action('wp_head', 'start_post_rel_link', 10, 0);
// Entfernt die relationalen Links zum nächsten Post
 remove_action('wp_head', 'parent_post_rel_link', 10, 0);
// Entfernt die relationalen Links zum benachbarten Post
 remove_action('wp_head', 'adjacent_posts_rel_link', 10, 0);

 Entfernen per Plugin

Wie schon erwähnt gibt es auch die Möglichkeit diese Einträge per Plugin zu entfernen, hierfür könnte man zum Beispiel „WP Head Section Cleaner“ verwenden. Laut Plugin-Beschreibung entfernt er genau die genannten Einträge, getestet habe ich dies aber nicht, also ohne Gewähr.

So lässt sich der WordPress Header einfach, schnell und sicher von Ballast befreien.

5 kostenlose Grid Themes für WordPress

Für CMS-Systeme gibt es unzählige Möglichkeiten ein Theme zu gestalten oder zu variieren. Erstes Kriterium ist natürlich der Einsatzzweck der Webseite oder der individuelle Geschmack. Auch der aktuelle Stand der Webentwicklung sollte berücksichtigt werden und diesen stelle ich heute in den Vordergrund. Den meisten ist Responsive Design ein Begriff, falls nicht, hier eine kurze Erklärung:

Bei Responsive Webdesign handelt es sich um eine Technik die Webseiten für verschiedenen Ausgabegrößen (Display-Größen) optimiert. Dies geschieht mit Hilfe der sogenannten CSS3 Media-Queries, meist in Verbindung mit HTML5 oder CMS-Systemen. Hierbei sind drei Größen relevant, nämlich die des herkömmlichen Computer Monitors,  ein Tablets und das Smartphones. Dabei wird das Layout entsprechend flexibel gestaltet und programmiert und bei Aufruf die entsprechende Ausgabe erkennt und das angepasste Layout aufruft. Natürlich hat jeder Monitor, jedes Tablet und erst recht jedes Smartphone eine unterschiedliche Auflösung, somit ist es unmöglich jede zu berücksichtigen, aber zumindest die Gängigsten.

Was hat das nun mit Themes zu tun? Vieles, denn durch diesen Umstand haben sich Darstellungen und Aufteilungen entwickelt, die es vorher in dem Umfang nicht gab. Und um einen Vertreter dieser Darstellung geht es heute, sogenannte „Grid-Themes“. Dabei ist der Name Programm, der Englische Begriff „Grid“ bedeutet in deutsch soviel wie Raster oder Gitter, beides lässt sich auf die Gestaltung solcher Themes projizieren. Dieses Raster lässt sich dann natürlich aus alle Display-Ausgaben übertragen.

responsive

Wie man sofort erkennt wurden diese Themes getreu dem Motto „Form follows function“ erstellt, die Form der Webseite ist der Funktionalität untergeordnet. Sämtliche Inhalte folgen streng einem vordefinierten Raster, auch Bilder und Grafiken. So eignet sich dieser Aufbau hervorragend für Portfolio-, Fotografen- oder Blog-Webseiten, also Bereichen die viel mit Grafiken arbeiten.

Ich habe einige kostenlos erhältliche Themes dieser Form zusammen getragen und stelle sie nachfolgend schnell vor. WICHTIG! Wie und in welchem Umfang ihr die Themes nutzen dürft, erfahrt ihr auf den entsprechenden Webseiten der Anbieter! Hier nun die Übersicht:

Wembley-Theme von FabThemes

Minimalistisch gestaltetes Theme mit einigen vordefinierten Bereichen, z.B. die Änderbarkeit per Backend von Begrüßungstext, CSS-Attributen und Logo. Startseite mit einem Bilderraster, unter welchem Beitragsname und Kategorie zu finden ist. das Theme ist voll flexibel und passt sich an jede Bildschirmgröße an. Der Seiteninhalt erstreckt sich automatisch über die ganze, verfügbare Monitor oder Display-Breite.

wembley_theme

Cell-Theme von alienwp.com

Ebenfalls ein recht einfach gehaltenes Theme, allerdings mit variabler Bildgröße auf der Startseite. Außerdem verfügt das Theme über zwei verschiedene Beitrags-Formate, konfigurierbaren Hintergrund für den Kopfbereich und die Seite. Natürlich ist dieses Theme auch für mehrere Bildschirmgrößen optimiert. Nachfolgend die Demo-Seite des Themes und der Download.

cell_theme

Onion-Theme von goresponsive.in

Der Name ist Programm, ein sehr vielschichtiges Theme mit vielen. vielen Extras. So enthält das Theme unter anderem Social Icons, Google Webfonts, Menü über mehrere Ebenen, individueller 404-Seite, vordefinierten Widgets uvm. Die Seitenformatierungen lassen sich universal einsetzen und sorgen für maximale Flexibilität. Für ein kostenloses Theme selten, sind auch eine ganze Hand voll sogenannter „Shortcodes“ verfügbar. Mit ihnen lassen sich bestimmte Elemente schnell per entsprechenden Platzhalter integrieren. Ein wirklich ungewöhnlich umfangreiches Paket.

onion_theme

Pinbin-Theme von colorlib.com

Auch Pinbin ist ein waschechtes responsive Theme, welches allerdings mit einem ganz so minimalen Design daher kommt. Es zielt auf einen eher etwas edleren Eindruck, was ganz gut gelingt. Pinbin erstreckt sich ebenfalls über die gesamte Fensterbreite, is allerdings nicht zentriert angelegt. Details wie z.B. Logo lassen sich auch bequem per Backend ändern.

pinbin_theme

Grid Theme Responsive von dessign.net

Dieses Theme unterscheidet sich von seinen Vorgängern nur durch den endlosen  Bildlauf, welcher die Startseite fortsetzt solange Beiträge vorhanden sind. Ansonsten lassen sich auch hier beispielsweise Logo per Backend ändern. Insgesamt ein sehr stimmiges Theme.

grid_theme

Thats it! Ich hoffe der Artikel hilft euch bei der Wahl eines responsive Theme für WordPress. Noch ein kleiner Hinweis, bei der Installation der Themes unbedingt entsprechende Dokumentation oder ReadMe anschauen! Manche Funktionen erfordern ein wenig mehr als die gewohnte Installation.

Must-Have WordPress Plugins

Im Zuge der Aktualisierung meiner Webseite, habe ich mich ausführlich mit nützlichen Plugins beschäftigt, die sowohl das Arbeiten mit dem CMS-System erleichtern und auch den Funktionsumfang ordentlich erhöhen. Das jetzt groß in Kategorien zu quetschen halte ich für sinnlos, da ich nur im Umfang einer eher kleineren Webseite (Portfolio, Blog, etc.) gesucht habe.

Dennoch habe ich einige Perlen gefunden die ich kurz erläutern möchte. Hier die nützlichsten fünf WordPress Plugins welche ich getestet habe:

 

1. WP Super Cache


Das WordPress sich schnell zu einem Ressourcenfresser entwickeln kann, weiß jeder der mit dem System mal gearbeitet hat. Schnell hat man dutzende Plugins installiert, die unter dem Strich das System sehr ausbremsen können. Simpler Hintergrund ist meist, das diese Plugins unahängig und natürlich gleichzeitig Abfragen an die Datenbank des Systems schicken. Das macht die Seite träge, und das mag der Nutzer gar nicht.

Hier schafft WP Super Cache Abhilfe! Das Plugin macht jetzt folgendes, es macht aus den dynamisch erzeugten PHP-Seiten (incl. enthaltener Datenbankanbindung), eine statische HTML-Seite und packt diese auf den Webserver. Da eine statische Seite für den Webserver viel einfacher und schneller zu übertragen ist, sorgt das für eine spürbare Entlastung der Webseite. Dabei nutzt das Plugin nicht nur diese Variante, sondern hat die Wahl zwischen folgenden drei Methoden:

  • PHP um Cache-Dateien auszuliefern
    Wie schon beschrieben, werden hier statische HTML Seiten generiert.
  • Legacy Page-Caching
    Hier werden bestimmte Daten, aber keine kompletten Webseiten im Cache ausgelagert.
  • mod_rewrite Caching
    Bei dieser Methode werden statische Supercache-Dateien erstellt.

Wie man sieht, hat sich der Autor einiges einfallen lassen, und so bietet das Plugin verschiedene Möglichkeiten der Webseite Beine zu machen. Die Konfiguration ist nicht weiter schwer, das Plugin gibt einem die wichtigsten Einstellungen vor, durch den Zusatz „empfohlen“ beim betreffenden Einstellungs-Punkt. Zudem ist auf der Plugin-Seite eine ausfühliche Dokumentation zu finden und auch über die Google-Suche findet man hunderte Tutorials.

Zu finden ist dieses Plugin unter folgendem Link:

WP Super Cache

 

2. Jetpack


Die eierlegende Wollmilchsau … wenn man so will. Jetpack ist ein Sammelsurium an Funktionen, Erweiterungen und Widgets. Aus diesem Grund stand ich dem Plugin zunächst sehr skeptisch gegenüber, da so viele Einheiten das System ausbremsen können, wie oben schon erwähnt. Auch das Einarbeiten machte mir Sorgen, auch wenn nicht alle Funktionen benutzt werden, könnte das ganz schön mit Aufwand verbunden sein. Beides ist nicht eingetreten. Das Plugin ist schnell installiert und auch relativ schnell konfiguriert. Als wichtigste Funktionen haben sich für mich folgende herauskristallisiert:

  • Blogeinträge automatisch auf Sozialen-Netzwerken zu veröffentlichen (Facebook, Twitter usw.)
  • Ein Widget mit welchem Nutzer die Möglichkeit haben, per Newsletter dem Blog zu folgen
  • Ein Widget zur Ausgabe der Twitter Timeline
  • Eine Rechtschreibprüfung für den WYSIWYG-Editor im Backend
  • Omnisearch Funktion (Umfangreiche Suche)
  • Das bloggen per E-Mail
  • Shortcode Funktion

Das Plugin und eine komplette Liste der Funktionen gibt es unter diesem Link.

Hinweis: Treu nach dem Motto „Es ist nicht alles Gold was glänzt“, sollte man auch bei Jetpack genau überlegen ob sich ein Einsatz lohnt. Den die Vorteile können auch sehr schnell zu Nachteilen werden, so sollte man sich fragen ob es notwendig ist so von einem Plugin abhängig zu machen. Sollte man die Statistik-Funktion nutzen wollen sollte man sich auch über zwei Dinge im Klaren sein; zum einen ist ein Account von wordpress.org notwendig und zum anderen sollte man sich genau über den Umgang der Nutzerdaten die damit erhoben werden informieren. Ein Hinweis im Impressum halte ich für Pflicht.

 

3. iThemes Security (ehemals WP-Security)


Diese Plugin sorgt für Sicherheit und Überprüft das CMS-System auf Schwachstellen um Angreifern das Leben schwer zu machen.  So empfiehlt das Plugin dann, sortiert nach High, Medium und Low priority (Hohe, mittlere und niedrige Priorität), notwendige Änderungen am System um eine höchst mögliche Sicherheit zu gewährleisten. So kann als Beispiel der Login-Bereich des Backends vor sogenannten „brute-force“ Attaken geschützt werden, das Datenbank-Präfix geändert werden, das komplette System auf Schwachstellen geprüft werden und vieles mehr!

Auch eine eigene Backup-Lösung der Webseite ist integriert und erlaubt zeitgesteuert eine Sicherung der Datenbank. Diese kann automatisch per E-Mail versendet werden. Es macht den Eindruck, als wäre eine „Maske“ über die Export-Funktion von phpMyAdmin gelegt und mit nützlichen, durchdachten Funktionen ergänzt.

insgesamt ein sehr sinnvolles Plugin um vor Datenverlust und Fremdeinwirkung auf die Webseite sicher zu sein. Das Plugin ist unter folgendem Link zu finden: iThemes Security

 

4. Antispam Bee


Spam ist ein Problem, vor allem die Kommentar-Funktion von WordPress ist da anfällig. Jetzt ist von Hause aus der Spamfilter „Askimet“ an Bord von WordPress, dieser ist in Deutschland aber rechtlich zumindest fraglich. Also habe ich mir die Alternative umgeschaut und bin schnell fündig geworden und zwar mit dem Plugin „Antispam Bee“.

Das Plugin filtert sehr zuverlässig jeglichen Spam um (nach eigenen Aussagen der Entwickler) 95%. Auch um Datenschutz muss man sich keine Sorge machen, da keine IP-Adressen gespeichert werden. Zudem ist die Konfiguration denkbar einfach und auch für Laien sehr schnell zu bewältigen. Alle gefährdeten Bereiche wie Kommentar-Funktion oder Kontakt-Formular lassen sich damit schützen.

Auch öffentliche und lokale Spam-Datenbanken lassen sich in die Filterung miteinbeziehen. Zudem ist es möglich Länderspezifisch zu blockieren oder zu erlauben oder Kommentare nur in bestimmten Sprachen zuzulassen.

Eine vollständige Liste der Features ist unter folgendem Link zu finden: Antspam Bee

 

5. WP Wartungsmodus (WP Maintenance Mode)


Vor allem während der Anfangszeit und diversen Programmierarbeiten habe ich diese Plugin zu schätzen gelernt. Es kann immer mal vorkommen das die Webseite kurz für Besucher nicht erreichbar sein soll. Sei es durch Aktualisierung bestimmter Bereiche der Webseite, Umbauarbeiten oder was auch immer. Kurz dieses Plugin aktiviert, Meldung kurz angepasst (welche der Besucher zu sehen bekommen soll) und fertig.

Das Plugin enthält mehrere vorgefertigte Templates die genutzt werden können, aber auch das Einbinden von eigenen Grafiken oder eigener HTML bzw. CSS-Code ist problemlos möglich. Zudem lassen sich Zeitpunkt, Dauer und Umfang an die anstehende Aufgabe anpassen. Auch das integrieren bestimmter Bereiche der Webseite (z.B. den Header) über eine kleinen Funktionsaufruf ist sehr schnell möglich.

insgesamt eine komfortable, einfache Lösung seine Seite kurz vom Netz zu nehmen. Alles Informationen zum Plugin findet man unter diesem Link: WP Maintenance Mode

 

Hinweis: Allgemein empfiehlt es sich unbedingt genau abzuwägen ob man ein Plugin einsetzen möchte oder nicht. Einige getestete Erweiterungen haben sich extrem negativ auf die Performance oder Stabilität des CMS-Systems ausgewirkt. Also auf jeden Fall umfangreich testen!