Alle Beiträge von admin

Themen für mobile Endgeräte

Mobile Endgeräte mit kleinem Display sind auf dem Vormarsch und erzwingen entsprechende Techniken bei der Webdesign, die auf diesen Umstand Rücksicht nehmen. Hat man früher eine mobile Version einer Website nach der Desktop-Version erstellt, ist es heute genau umgekehrt.

Klassische Webseiten sind meist horizontal organisiert und nutzen die Bildschirmbreite eines Heim-PCs aus. Wir wissen alle, wie mühsam die auf einem Handy winzigen Bedienungselemente werden können und dass man beim Hin- und Herschieben des Inhalts rasch das Interesse an der Seite verlieren kann.

Folgende Konzepte unterstützen mobile Endgeräte:

  • Mobile Website
  • Apps und WebApps
  • Responsive Design
  • OnePage Layout

Mobile Website

Eine mobile Website ist eine zweite Version für mobile Endgeräte, die sich meist automatisch aktiviert, wenn die Desktop-Version von einem Handy aufgerufen wird. Beispiel: http://derstandard.at/ und die dazugehörige mobile Seite http://mobil.derstandard.at/

Bei einer mobilen Webseite muss man zwei Webseiten pflegen, wobei es wegen der Zweigleisigkeit Nachteil bei Suchmaschinen geben kann.

Apps und WebApps

Wir kennen alle die große Zahl der Apps, die manchmal eigenständige Programme sind aber in de meisten Fällen mit einer Webanwendung kommunizieren.  Sie bieten statt einer scrollbaren Webanwendung ein Frontend in Form einer Vollseitenanwendung an.

Und es gibt nicht nur Apps, die man aus dem jeweiligen Store downloaden kann sondern auch WebApps, die nicht im Store erhältlich sind und deren Adresse man auf den jeweiligen Webseiten erfährt. Eine Webapp wird im Browser aufgerufen, verhält sich aber aus ergonomischer Sicht nicht wie eine scrollbare Seite sondern wie eine Vollseiten-App.

Responsive Design

Die CSS-Technologie hat sich in den letzten Jahren enorm weiterentwickelt und es ist nunmehr möglich, dass derselbe StyleSheet sich dem jeweiligen Endgerät automatisch anpasst. Praktisch alle modernen Themen für WordPress sind „Responsive“.

Meine Bank, die ERSTE, bietet sowohl Apps als auch responsive Webs aber auch die klassische Webseite parallel an.

OnePage-Layout

Ein besonders für Handys attraktives Design ist das OnePage-Layout, das sich – nach meinem Eindruck –  besonders für kleinere Projekte eignet, kommt man doch dabei überhaupt ganz ohne ein Menü aus.

Die Seite verfügt zwar auch über ein Menü, kann also auch klassisch navigiert werden aber die Startseite stapelt die Seiten ausgewählter Menüpunkte auf einer Seite. Und damit man die Abschnitte auch optisch gut unterscheiden kann, werden die Texte von Ganzseitenbildern unterbrochen, wobei nach jeder Seite ein neues Bild gezeigt wird.

Das neueste WordPress-Thema „Twenty Seventeen“ verfügt über ein solches One-Page-Design. Wir haben eine Basis-Installation hier gespeichert:

Das Bild rechts zeigt den Verlauf der Bilder und Texte, wenn man nach untenscrollt bzw. wenn man am Handy mit dem Finger nach oben streicht. Die Textteile sind einzelne Seiten, in diesem Fall – weil es ein Demo ist – sind die Abschnitte nur ganz kurz.

Es gibt zwei Möglichkeiten ein solches OnePage-Layout herzustellen:  Über ein PlugIn oder über ein bereits dafür eingerichtetes Thema.

Mit einem PlugIn können auch bestehende Themen OnePage-fähig werden:

Das Universal-Thema Enfold

Wer hätte gedacht, dass das Thema des Jahres 2015 aus Wien kommt? Genauer aus der Burggasse 121, von „Kriesi Media“.

Ohne, dass ich selbst das OnePage Layout verwendet hätte, bekam ich eine Frage eines Clubmitglieds bezüglich eines solchen Layouts und dabei ist mir eben eingefallen, dass mein eigenes Thema Enfold das ja kann. Ich selbst verwende nur die Basis-Installation von Enfold (http://fiala.cc) aber man könnte zum flüssigen Lesen einige Schwesterseiten eines Kapitels zu einem OnePayge-Layout zusammenfassen. Vielleicht mache ich das einmal.

Wie vielgestaltig ein solches Thema sein kann, zeigt eine Liste aller Demos des Themas Enfold. Zu meiner Schande muss ich gestehen, dass ich auf diese Möglichkeiten allein durch die Grundinstallation nicht gekommen wäre, aber gerade dazu sind ja die Demos da.

Einige von diesen Demos sind als OnePager ausgeführt.

Und das besonders Praktische: man kann diese Demos so wie sie sind importieren und muss sie dann nur verändern.

Nützliche Links

WordPress Praxisbuch
Sichere Passwörter
Passwörter wechselne
Advanced Custom Fields
Advanced Custom Fields Pro
5 Tipps zum Umgang mit Trollen
PlugIn Disable Comments
Einbetten von Mediendateien
PlugIn Einbetten von Facebook-Inhalten
Jetpack
Slimjetpack (ungewartet)
PlugIn zur Einhaltung der deutschen Gesetzesbesteimungen für Social Buttons
PlugIn: Automatisches Posten in sozialen Netzen
PlugIn: Auto Publish
Automatisches Publizieren mit IFTTT (ohne PlugIn) „If This Then That“
Einführung in WordPress-Feeds
PlugIn: Broken Link Checker
PlugIn: WordPress optimieren
Markdown
Dynamic Sidebars
Vergleichbare Posts auf der Seite anzeigen
PlugIn: Force strong Passwords
PlugIn: BackWP up
PlugIn: Erinnerung, dass Updates zu machen sind
PlugIn: Absichern der Website mit iThemes Security
PlugIn: Antivirus
PlugIn: BackWPup
PlugIn: BackWPup
PlugIn: w3 Total Cache
PlugIn: WP Super Cache
PlugIn: Cachify
PlugIn: P3-Profiler
Google Insight
Pingdom (Ladezeit)
PlugIns: reduziert die Bildgröße von Bilddateien automatisch
Komprimierung von PNG- und JPG-Bildern
PlugIn: Verzögertes Nachladen um Ladezeit zu sparen
Alle Snippets aus dem Buch „Das WordPress Praxisbuch“
PlugIn: Duplicator (WordPress übersiedeln)
PlugIn: Yet another related Posts Plugin
PlugIn: Seo Image
PlugIn: All in one SEO pack
PlugIn: WPseo
PlugIn: Code Snippets /macht das Editieren von Fuctions.php überflüssig)
PlugIn: Google Sitemap herstellen
Über die Datei robots.txt
Breadcrumbs
Metadaten import
Besucherstatistiken
Snippets: WP recipes
Snippets: WP Beginner
Snippets: WP Snippets
Snippets: WP Snipp
PlugIns: Code Snippets
Function File
PlugIn: Download Monitor
PlugIn: Membership
PlugIn: Sidebar Login
PlugIn: Custom Login
PlugIn: Members
PlugIn: Membership PlugIn
PlugIn: Impost existing WordPress Users
PlugIn: Registration Process
PlugIn: Registration Form Shortcode Generator
PlugIn: Registration Form Builder
PlugIn: Redirect Members
Mailchimp
PlugIn: Membership-Mailchimp
Analytics datenschutzkonform
Google Analytics
Google Analytics-1
Analytic (Recht)-1
Analytic (Recht)-2
Datenschutzkonforme Statistiken für WordPress
Analytics
PlugIn: Tracking-Code in WordPress einbinden
PlugIn: SEO (kostenpflichtig)
ThemeForest
ThemeForest-WordPress
Thema Enfold (von Kriesi aus Neubau)
Elegant THemes
Themen: Studiopress
Themen: Appfinite
Thema „Hamburg“
Themen Woocommerce
Themen: WordPress
Themen: Handbook Review
Diashows direkt in einer Seite
Fonts: Typekit
Fonts: Google
Fonts: Dierck-Meyer
Theme Unit Test
Theme Unit Test-Data
Security
Security: Htaccess Control
PlugIn: Memory Usage
Multilingual
Multilinual: WP Globus

Dein Web verlinkt

Damit eine Webseite auch von Google gefunden wird, muss es einen Link auf diese Seite geben.
Diesem Link folgt der Google-Crawler und daher findet er die Seite und kann sie in seinem Index aufnehmen.
Je mehr solche Links bestehen, desto besser.

ClubComputer und ccc.at verlinken alle gehosteten Domänen auf dieser (und auch auf anderen Seiten).
Damit ist gewährleistet, dass jede Seite grundsätzlich gefunden wird.

Diese Seite ersetzt aber nicht inhaltsbezogene Verlinkungen, die den Stellenwert der Seite erhöhen.

Fehlersuche

Beispiel

Unsere WordPress-Seite hätte den Url http://meinwp.domain.at

Administrationsseite erreichbar

Wenn es Fehler beim Aufruf einzelner Seiten gibt aber man noch die Administrationsseite /wp-admin aufrufen kann, kann man durch temporäres Ausschalten der PlugIns feststellen, ob es sich um einen Fehler von WordPress oder um einen Fehler in einem der installierten PlugIns handelt.

Ebenso kann man mit dem Thema verfahren. Man aktiviert ein anderes (einfaches) Thema, um eine eventuelle Fehlerursache dadurch zu eliminieren.

Administrationsseite nicht erreichbar

Gehen wir davon aus, dass beim Aufruf von http://meinwp.domain.at sich gar nichts meldet.

Zuerst testen wir, ob eine statische Seite aufrufbar ist. Dazu rufen wir auf:

http://meinwp.domain.at/liesmich.html

Wenn die Seite angezeigt wird, ist der Webserver in Ordnung. Wenn die Seite nicht angezeigt wird, dann sollte man andere bekannte Referenzseiten wie zum Beispiel http://fiala.cc aufrufen, die am selben Server laufen oder die Statusseite http://status.ccc.at. Diese Statusseite gibt Aufschluss über die Erreichbarkeit des Webservers.

Wenn der Webserver nicht erreichbar ist, müssen wir uns darum kümmern; bitte um eine Mail an support{at}clubcomputer.at.

Wenn aber andere Seiten funktionieren und nur die eigene „spinnt“, geht man weiter so vor:

Man geht in das Website-Panel und dort mit dem Dateimanager in den Ordner wwwroot. In diesem Ordner legt man eine neue Datei mit dem Namen phpinfo.php an und als Inhalt schreibt man:

<?php
phpinfo():
?>

Jetzt ruft man diese Datei auf:
http://meinwp.domain.at/phpinfo.php

Meldet sich die Statusseite von PHP, dann ist PHP korrekt am Server installiert und der Fehler liegt woanders.

Meldet sich aber PHP nicht, dann ist im Allgemeinen der so genannte Application-Pool angestürzt. In diesem Fall empfehlen wir folgende Vorgangsweise:

https://panel.ccc.at -> Website meinwp.domain.at -> Erweiterungen

PHP von der aktuell eingestellten Version auf eine andere Version ändern (meist sind die zwei letzten Versionen installiert) und den Versuch, die Seite

http://meinwp.domain.at/phpinfo.php

aufzurufen, wiederholen. Der Fehler könnte behoben sein. Wenn nicht bitte an support{at}clubcomputer.at schreiben.

Sollte aber das auch funktionieren, dann sollte man sich bei der deutschen WordPress-Seite eine aktuelle WordPress-Version downloaden und mit Ftp auf den Server übertragen, entpacken und alle Dateien in wwwroot verschieben. Die Konfigurationsdatei wird dabei nicht überschrieben, weil sie in den Installationsdateien nicht enthalten ist. Ebenso werden upgeloadete Bilder dadurch nicht angetastet. Sollte es sich daher um einen Defekt bei der WordPress-Installation gehandelt haben, sollte er nach diesem „Auffrischen“ aller Dateien entfernt worden sein.

Wenn dieses „Auffrischen“ auch keinen Erfolg bringt, dann könnte es sein, dass ein PlugIn oder das Thema der Übeltäter ist. Man geht daher mit dem Dateimanager im WebsitePanel (https://panel.ccc.at) in den Ordner wp-content. Dort schaltet man im Ordner plugins alle PlugIns aus, indem man die einzelnen Ordnernamen umbenennt (statt akismet schreibt man akismet-disabled). Danach startet man WordPress neu. Jetzt sollte WordPress starten und man kann daran gehen, die PlugIns der Reihe nach auf Fehler zu untersuchen.

Backup händisch erstellen

Was muss man sichern?

  1. Datenbank
  2. Bilder und Dateien
  3. Konfiguration

Datenbank sichern

Alle Texte und Einstellungen sind in der WordPress-Datenbank enthalten.

Um ein Backup von der Datenbank zu erstellen, geht man in das WebSitePanel (https://panel.ccc.at)

  • MySql-Datenbank -> Browse Database.
  • Im phpMaAdmin die Datenbank (zum Beispiel wp_name) anklicken.
  • Menüpunkt „Exportieren“
  • Exportiere Tabellen der Datenbank „wp_name“ („Schnell“) -> OK
  • Datenbank wird als Text auf den eigenen Rechner downgeloadet.

Sollte alles kaputt gehen, legt man wieder eine gleichnamige Datenbank an und verwendet den Menüpunkt „Importieren“.

Damit werden alle Tabellen und ihre Inhalte wiederhergestellt.

Bilder und Dateien sichern

Alle upgeloadeten Bilder, PlugIns und Themen befinden sich im Ordner wwwroot\wp-content

Es genügt, alle Dateien in diesem Ordner mit Ftp auf den eigenen Rechner downzuloaden.

Im Wiederherstellungsfall wird WordPress neu installiert und dann dieser Ordner vom Backup überschrieben.

Alle anderen Verzeichnisse muss man nicht sichern, die kann man jederzeit durch eine Neu-Installation von Word-Press wiederherstellen.

Konfiguration sichern

Die wichtigste Datei zur Wiederherstellung einer WordPress-Installation ist die Datei wwwroot\wp-config.php

In dieser Datei ist die Datenbank-Konfiguration enthalten und auch die Schlüssel zur Validierung der Passwörter.

Diese Datei muss man nach einer eventuellen Neuinstallation von WordPress in den Ordern wwwroot zurück übertragen.

Andernfalls kann man keine Verbindung zur Datenbank herstellen.


Wenn man also WordPress händisch sichert, dann muss man diese drei Schritte ausführen.

Es geht auch automatisch und dazu gibt es im folgenden Artikel eine Auswahl von Programmen:

Hier werden ein paar Backup-Lösungen beschrieben:
http://wp.clubcomputer.at/2015/10/backup-am-client/

Bild kann nicht eingefügt werden

Nah langer problemloser Arbeit mit eingefügten Bildern, trat plötzlich folgender Fehler auf: ein Bild sollte in die Medienbibliothek aufgenommen werden, der Upload funktionierte, doch dann wurde das Bild nicht angezeigt und im Texteditor wurde statt des Bildes das Symbol für einen gebrochenen Link gezeigt.

Wenn allerdings das Bild über einen Internet-Link eingefügt wurde (zum Beispiel aus Picasa-Webalben) funktionierte die Einfügung.

Das Rätselraten hatte ein Ende, nachdem die Adresse des Bildes genauer untersucht wurde: es war ein Bild mit Umlauten im Namen.

Meine aktuelle Schlussfolgerung ist, dass Bilder mit Umlauten im Dateinamen in WordPress nicht eingefügt werden können.

Dass das Bild über einen Internet-Link eingefügt werden kann, liegt daran, dass in diesem Fall die Umlaute URL-kodiert werden und daher der Fehler nicht auffällt.

Galerie NextGEN

Die Galerie NextGEN bindet einen Ordner mit Bildern an eine Seite oder einen Beitrag in WordPress.

In den Einstellungen von NextGEN wird konfiguriert, wie diese Bilder angezeigt werden sollen.

Mehrere solcher Ordner können auf einer so genannten Album-Seite zusammengefasst werden.

Man kann die Bilder über FTP uploaden und dann von NextGEN „lernen“ lassen. Ebenso ist es möglich, nachträglich Bilder in den einzelnen Ordnern der Galerie zu ergänzen.

Da die Galerie auf einer ganz normalen WordPress-Seite erscheint, kann man vor und nach der Galerie Texte und weitere Bilder einfügen.

Man kann eine Galerie an mehreren Stellen und dann auch in verschiedener Darstellung im Web verwenden. Und man kann viele verschiedene Darstellungsvarianten anwenden.

Die Galerie ist linear und die Ordner können nicht verschachtelt werden. Es gibt aber einen Trick, wie man das dann doch machen kann. Man kann nämlich beliebig viele Galerien (=Ordner) auf einer Seite vereinen und das heißt dann „Album“.

In einer Plus-Version gibt es auch weitere Darstellungsvarianten, alle „fully responsive“, die aktuell im Angebot 35, Euro kostet.

Es gibt auch eine weitere Pro-Version dieser Galerie aber diese zielt auf den Verkauf der Bilder ab und das brauchen wir nicht. Wir kommen daher mit der kostenlosen Basis-Version aus.

Beispiel aus dem Web von Frau de Comtes
http://www.decomtes.at/werke/serie-1/

Homepage der Galerie
http://www.nextgen-gallery.com/

 

Einsteigerfragen

Was tun im Fehlerfall?

Wenn man die Administrationsseite noch erreicht:

Schritt 1: Alle aktivierten PlugIns deaktivieren
PlugIns->Installierte PlugIns->alle mit lauem Rand anklicken->Aktionwähöen=deaktivieren->Übernehmen
Ist der Fehler weg? Dann war es irgend eines dieser PlugIns!

Schritt 2: Thema zurücksetzen auf das einfache Thema twentysixteen
Design->Themes TwentySixteen anklicken und „Aktivieren“ klicken
Ist der Fehler weg? Dann war es das Thema!

Schritt 3: WordPress neu installieren
Dabei passiert Ihren Inhalten nichts, es wird nur wieder ein Grundzustand hergestellt:
Dashboard->Aktualisierungen->Erneut installieren (dauert ein paar Minuten)

Wenn man aber nicht mehr in die Verwaltungsseite ../wp-Admin kommt, dann muss man das WordPress händisch neu installieren.
Bitte dann einfach beim Clubtelefon anrufen.

Themenwechsel

Im Auslieferungszustand sind immer nur die Jahresthemen der letzten drei Jahre enthalten.
Es gibt aber darüber hinaus Tausende kostenlose.
Design->Themes->“neues Thema hinzufügen“
Jetzt im Menü „gustieren“ und eventuell „Nach Funktion filtern“
Zum Beispiel „Fließendes Layout“.
Wenn man den Namen kennt (z.B. Vantage), diesen in Suchmaske eingeben und dann über das Vorschaubild fahren und „installieren“ klicken.

Beider Auswahl der Themen auf den Zeitpunkt der letzten Aktualisierung achten. Die Themen müssen sich laufend der aktuellen WordPress-Version anpassen. Geschieht das nicht, dann wird es irgend wann nicht mehr fehlerfrei funktionieren.

Gibt es mehrsprachige Layouts?

Man kann jedes Layout im Nachhinein mehrsprachig machen, bitte schau Dir dazu den folgenden Artikel an:
http://wp.clubcomputer.at/2015/10/sprachumschaltung/

Themenwahl

Das Thema allzu oft umzuschalten ist keine gute Idee, denn damit ist immer auch ein gewisser Gestaltungsaufwand verbunden, weil an die benützten Widgets wieder neu anordnen muss.
Die einfachen mitgelieferten Themen haben meist nur zwei Bereiche: einen Bedienungsstreifen und den Inhalt.
Alle Widgets sind diesem einen Streifen.
Bei komplexeren Themen gibt es aber mehrere Bereiche für die Widgets und da muss man sich ein bisschen damit beschäftigen, bis es so ist, wie es einem gefällt.

Welches Thema soll man wählen?

Wichtig ist, dass das Thema auf allen Endgeräten den Inhalt ohne viel Scrollen präsentiert. Die Eigenschaft, dass sich ein Layout dem Endgerät anpasst, nennt man „Responsive Layout“.
Auf der Seite wordpress.org finden Sie diese Layouts:
https://wordpress.org/themes/
-> Feature Filter -> Layout -> Responsive Layout
Wenn man dann ein Thema gewählt habt, steht dann folgender Text (Beispiel) bei den Details zu diesem Thema:

Tags:
Custom Background, Custom Menu, Featured Images, Light, Post Formats, Responsive Layout, Right Sidebar, Sticky Post, Threaded Comments, Translation Ready, Two Columns

Hier stehen weitere (technische) Details:
https://de.wikipedia.org/wiki/Responsive_Webdesign

Am einfachsten testet man das Layout so, indem man am Desktop das Browserfester absichtlich schmal machen. Dann muss sich das Layout dramatisch verändern. Bei den einfachen Themen passiert folgendes: das ganze Menü (der Widget-Bereich) verschwindet hinter drei horizontalen Stricherln, die man bei Bedarf anklickt. um das Menü wieder zu sehen,

Ich brauch unbedingt ein Menü, damit man sich zurechtfindet!

WordPress kennt zwei Arten von Inhaltselementen: Seiten (Pages) und Posts (Berichte).

  • Die Berichte sind Artikel eines Blogs, die durch Kategorien und Schlagworte organisiert werden.
  • Die Seiten sind Artikel, die man nur über Menüs ansprechen kann.

Vom Editieren des Inhalts her sind Berichte und Seiten völlig gleich. Verschieden ist die rechte Spalte.

  • Bei Berichten vergibt man eine oder mehrere Kategorien und ein oder mehrere Schlagwörter, die später zum organisierten Wiederfinden dienen.
  • Bei Seiten sagt man, auf welcher Position in einem Menü die Seite zu liegen kommt, wer also die Elternseite in einem verzweigten Menübaum ist.

Meine erste Seite

Erstelle eine Seite, zum Beispiel „ErsteSeite“ und schau Dir dann die WordPress-Seite an: Du wirst die Seite nicht sehen. Warum? Seiten werden erst sichtbar, wenn man sie über ein Menü verlinkt und dort anwählt.

Daher braucht an für die Darstellung von Seiten  ein Menü. Leg unter Design -> Menü ein neues Menü an, zum Beispiel „Hauptmenü“ und klicke die Seiten (links) an und füge sie zu dem Menü dazu. Weiters kannst Du Dir das Leben noch mit der Chekbox erleichtern: „Neue Seiten der ersten Ebene automatisch zum Menü hinzufügen“

Jetzt musst Du noch angeben, auf welcher Position im Thema das Menü zu liegen kommt. Bei den einfachen Layouts gibt es nur die Möglichkeit „Primäres Menü“ -> Menü speichern.

Damit dann das Menü auch in der Seitenleiste sichtbar wird, muss man das Menü-Widget unter Design -> Widgets .> „Individelles Menü“ nach rechts ziehen und sagen, welches von mehreren Menüs man zeigen will. Hier also „Hauptmenü“ -> Speichern.
Damit wird das Menü an der Stelle sichtbar, wo Du es hingezogen hast.

Reicht mein Webspace für die viele Themen aus?

Du hast bei ClubComptuer viel mehr Webspace als solche Themen verbrauchen. Derzeit 250 MB, die Datenbank wird nicht mitgezählt.
Was eventuell ins Gewicht fallen könnte, ist Downloadmaterial und Bilder.
Wordpress verkleinert aber ohnehin alle Bilder auf ein Webmaß.
Das alles ist am Anfang kein Problem.

Kann man Themen verändern?

Farben und Bilder lassen sich bei praktisch allen Themen anpassen und zwar so:
Dashboard->Design->Themes->Anpassen
Dort kann man einerseits alle verfügbaren Themen umschalten (ohne das zunächst wirklich zu tun aber man kann das Resultat rechts anschauen) und darunter verschiedene Parameter verändern.
Beispielsweise gibt es bei Ihrem Standardthema unter „Farben“ die Basis-Vorlagen Standard, Dunkel, Grau, Rot Gelb und einige weitere Möglichkeiten.

Wenn die Änderung OK sind, auf „Speichern“ nicht vergessen.

Bei den Schriften ist man eher eingeschränkt aber Achtung: man msss bedenken, dass keine Schrift aus dem PC-Font-Bestand verwendet werden kann (auch wenn sie auf dem PC angezeigt wird), denn man kann nie voraussetzen, dass die Schrift auch bei den vielen möglichen Usern verfügbar ist.

Man kann bei WordPress alles verändern, weil sogar ein Editor mit an Bord ist:
Themen -> Editor
Man verändert diese Dinge aber mit
Themen -> CSS bearbeiten
Ein Beispiel, wie man ein Thema anpasst (also ein eigenes Thema aus einem bestehenden Thema ableitet), wird hier bescshrieben:
http://wp.clubcomputer.at/2015/12/thema-anpassen/
Nehmen wir das StadardThema Twenty Sixteen.
Dort ist der Standard Font:

font-family: Merriweather, Georgia, serif;

Man holt sich die Datei style.css, sucht alle Vorkommen dieser Schriftart, und nimmt diese wenigen Stile und kopiert diese in die leere Datei unter Themen -> CSS-Bearbeiten.

Diese Vorgangsweise hat den Vorteil, dass die Änderung auch dann wirksam bleibt, wenn das Thema aktualisiert werden muss.

PlugIns sollten natürlich in allen Themen funktionieren. Aber dass es manchmal zu unbeabsichtigten Merkwürdigkeiten des Aussehens kommt, kann schon vorkommen.

Nicht alle PlugIns sind geeignet

Bei den PlugIns muss man beachten, dass es einerseits viele alte PlugIns gibt und anderseits auch viele Erstlingswerke, die noch nicht stabil genug sind. Das gilt auch für die Themen. Man sollte daher darauf schauen, ob der Anbieter des PlugIns eine kostenpflichtige „Pro“-Version anbietet. Das ist immer ein gutes Zeichen dafür, dass sein Produkt Kunden hat, die dafür zahlen. Für viele User ist die kostenlose Version ausreichend, und sie profitieren von der Stabilität der Pro-Version.

Thema anpassen

In WordPress hat man vollen Zugang zum Source-Code eines Themas. Man kann daher über Die Funktion Dashboard -> Design -> Editor so ziemlich alles verändern. Aber das sollte man nicht tun.

Genau so wie PlugIns unterliegen auch Themen einer fallweisen Aktualisierung. Wenn daher ein Update erfolgt, kann es sein, dass diese Änderungen wieder durch eine neue Version überschrieben werden.

In WordPress ist dieser Fall der Anpassung eines Themas bereits geregelt. Man legt nämlich ein so genanntes Child-Thema an, und das geht so:

Man erzeugt einen neuen Ordner mit dem Namen des Child-Theme an. Nehmen wir an, das Thema TwetyFifteen soll verändert werden.

https://panel.clubcomputer.at -> Einloggen

DateiManager -> „Domäne“ -> wwwroot -> (wp ->) -> wp-content -> themes

Hier legt man den Neuen Ordner twentyfifteen-neu an.

NeuesThema

In diesem Ordner legt man zwei Dateien an: style.css und functions.php (Im Bild ist auch noch die Datei Hintergrund1.jpg dazugekommen, die für den geänderten Stil erforderlich ist.)

NeuesThema1

In style.css schreibt man den Kopf der gleichnamigen Datei aus dem ursprünglichen Thema twentyfifteen.

/*
Theme Name: Twenty Fifteen Muth
Theme URI: https://wordpress.org/themes/twentyfifteen/
Author: Franz Fiala
Author URI: https://http://mondon-muth.clubcomputer.at//
Description: Our 2015 default theme is clean, blog-focused, and designed for clarity. Twenty Fifteen's simple, straightforward typography is readable on a wide variety of screen sizes, and suitable for multiple languages. We designed it using a mobile-first approach, meaning your content takes center-stage, regardless of whether your visitors arrive by smartphone, tablet, laptop, or desktop computer.
Template: twentyfifteen
Version: 1.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, blue, gray, pink, purple, white, yellow, dark, light, two-columns, left-sidebar, fixed-layout, responsive-layout, accessibility-ready, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
Text Domain: twentyfifteen

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

.hentry {
background-color: #dddddd !important;
background-image: url("Hintergrund1.jpg");
color: white;
}

Wichtig ist die markierte Zeile „Template: twentyfifteen“, die sagt, welches Thema die Grundlage für diese Änderungen/Ergänzungen ist.  Nach dem Kopf (markiert durch /*… */) kommen alle Stile, die anders sind als im Original. In diesem Beispiel wurde der Stil mit der Klasse .hentry neu formuliert. Die Hintergrundfarbe wurde von ursprünglich #fff auf #dddddd geändert, die Textfarbe ist jetzt weiß und es gibt ein Hintergrundbild. (Gleichzeitige Angabe von Hintergrundfarbe und Hintergrundbild ist eigentlich zuviel, das Bild setzt sich durch.)

Kleine Schwierigkeit: Bei der css-Datei fehlt rechts neben dem Dateinamen der Bleistift, man kann die Datei daher nicht bearbeiten. Man kann daher entweder die Datei mit Ftp uploaden oder einen Trick anwenden: Man benennt die Datei mit dem Symbol rechts in style.css.txt um, dann kann man die Datei normal bearbeiten. Nach der Einfügung des Textes, benennt man die Datei wieder auf style.css um.

In functions.php schreibt man Folgendes:

<?php
function theme_enqueue_styles() {

$parent_style = 'parent-style';

wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'child-style',
get_stylesheet_directory_uri() . '/style.css',
array( $parent_style )
);
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
?>

Diese Zeilen sorgen dafür, dass die neue Datei style.css auch korrekt an die bestehende Datei im Ordner twentyfifteen angehängt wird.

Jetzt muss man das Thema nur noch aktivieren. In Dashboard -> Design -> Themes sollte man das neue Thema finden. Anklicken und aktivieren. Fertig.

Die genauere Beschreibung findet sich hier:
http://codex.wordpress.org/Child_Themes