WordPress

Erstellen, Veröffentlichen, Moderieren mit WordPress 3.2 (1)

Mit diesem etwas längeren Artikel starten wir eine mehrteilige Artikelserie. In dieser Serie wird aus der Sicht eines Redakteurs – Benutzerstufe unterhalb des Administrators – erklärt wie man einen Artikel verfasst, die Bedienung des visuellen und HTML-Editros erklärt und wie man neben Text auch weitere Inhalte einfügen kann.

Hinweis: In dieser Artikel-Serie wird gesiezt, was sich von den üblichen Blog-Artikel unterscheidet wo wir den Blog-Leser direkt ansprechen bzw. duzen … hat etwas mit der Entstehungsgeschichte des Dokuments zu tun … aber das nur am Rande.

1. Benutzergruppen in WordPress – die Schnellübersicht

Das Redaktionssystem WordPress unterscheidet (in der Standard-Installation) fünf Benutzergruppen. In aufsteigender Reihenfolge sind dies die folgenden:

Während der Abonnent sich lediglich anmelden und sein eigenes Profil verwalten kann, hat er keinerlei inhaltlichen Einfluss auf den Blog. In manchen Blogs muss man jedoch Abonnent sein, um Artikel kommentieren zu können.

Der Mitarbeiter kann lediglich Artikel verfassen, diese aber nicht veröffentlichen.

Der Autor ist ein selbständiger Mitarbeiter, der eigene Artikel (inklusive Bild-, Audio- und Videomaterial) verfassen und veröffentlichen kann. Kommentare, die seine eigenen Artikel betreffen, kann er moderieren. Er nimmt somit eine wichtige Rolle bei der Beisteuerung von Inhalten wahr, ist aber kein Mitglied des administrativen Teams von Administrator und Redakteur.

Der Redakteur ist der Stellvertreter des Administrators und hat somit sehr umfangreiche Rechte. Er kann Artikel und Seiten verfassen und veröffentlichen. Er kann die Artikel von Mitarbeitern veröffentlichen und auch die Artikel von Autoren verändern.

Der Administrator eines WordPress-Blogs kann alles, was auch Redakteure können. Zusätzlich dazu ist er der einzige, der das Aussehen und die Funktionalität des Blogs (Design bzw. Themes, Plugins, Einstellungen etc.) beeinflussen kann.

Diese Kurz-Dokumentation zeigt Ihnen, wie Sie als Redakteur einen Artikel verfassen bzw. veröffentlichen können.

Außerdem erfahren Sie einige Tipps und Abkürzungen zum komfortablen Erstellen und Bearbeiten von Artikeln sowie Hinweise zum Umgang mit Kommentaren.

2. Einen Artikel erstellen und veröffentlichen

Um einen Artikel in WordPress zu verfassen, müssen Sie sich auf die Unterseite "Neuen Artikel erstellen" (links in der Navigation: Artikel / Erstellen) begeben.

Auf beiden Wegen gelangen Sie in den Unterbereich Neuen Artikel erstellen. Hier liegt an zentraler Stelle der sogenannte Editor. Hier werden die Artikel verfasst und formatiert. Sie können den Editor entweder im WYSIWYG- oder im HTML-Modus verwenden.

Hinweis:
Falls Sie in Ihrem Profil die Option aktiviert haben, dass die Adminleiste auch im Administrationsbereich bzw. Backend angezeigt wird, können Sie natürlich auch über den dortigen Menüpunkt "Hinzufügen / Artikel" zur Unterseite "Neuen Artikel erstellen" begeben.

Sie können zwischen den beiden Modi (Visuell, bzw. WYSIWYG und HTML) wechseln, indem Sie auf den jeweiligen Reiter oben rechts am Rand des Editors klicken.

Erläuterung:
Die Abkürzung "WYSIWYG" steht für "What You See Is What You Get" und bedeutet, dass Sie im Editor den Artikel (fast) genau so sehen, wie er auch später nach der Veröffentlichung aussieht. Man spricht in diesem Zusammenhang auch von einem "visuellen Editor", im Gegensatz zu einem Code-Editor.

Welchen Editor Sie nutzen hängt alleinig von Ihren Vorlieben ab. Wenn Sie über Vorkenntnisse im Bereich HTML verfügen, empfiehlt es sich den HTML-Editor zu nutzen, da Sie hier eine wesentlich bessere weil genauere Möglichkeit haben Ihren Text zu formatieren.

Wenn Sie unten rechts in der Ecke des Editors (egal ob im Visuellen oder HTML-Modus) mit der Maus über die angedeuteten Ecken ûû fahren, ändert sich der Cursor, so dass Sie das Textfeld vergrößern oder verkleinern können.

2.1 Arbeiten mit dem HTML-Editor

Zunächst einmal sollten Sie folgendes über die Arbeit mit dem HTML-Editor wissen:

Der Editor erzeugt automatisch einen Zeilenumbruch (<br />), wenn man die Enter-Taste einmal drückt.

Wenn man nach einem Satz die Enter-Taste zwei Mal drückt, erzeugt der Texteditor in der (X)HTML-Ausgabe einen richtigen Absatz (<p></p>).

Das ist aus zwei Gründen wichtig: Zum einen wird das Absatzelement semantisch richtig eingesetzt (Stichwort: Webstandards) und zum anderen hat man dadurch einen zusätzlichen "Ansprechpunkt" (Selektor), an dem man eigene CSS-Regeln ansetzen könnte.

1.1.1 Text formatieren

Wenn Sie nun einen Text in den Editor eingeben stehen Ihnen standardmäßig die folgenden Formatierungsmöglichkeiten bzw. HTML-Tags  in der sog. Quicktag-Leiste zur Verfügung:

1. b (steht für engl. bold) = Der mit diesem Tag ausgezeichnete Abschnitt wird fett formatiert.
2. i (engl. italic) = Der hiermit ausgezeichnete Abschnitt wird als wichtig hervorgehoben bzw. kursiv formatiert.
3. link = Hiermit fügt man einen Link ein.
4. b-quote = Hiermit wird ein Abschnitt als Zitat ausgezeichnet.
5. del (delete) = überholten bzw. alten Inhalt kennzeichnen
6. ins (insert) = neuen bzw. aktuellen Inhalt kennzeichnen (Gegenstück zu del)
7. img (image) = Hiermit kann man ein Bild (image) einfügen.
8. ul (unnumbered list) = eine Aufzählungsliste einleiten
9. ol (ordered list) = eine nummerierte Liste einleiten
10. li (list) = einen Listenpunkt innerhalb einer Aufzählungs- oder einer nummerierten Liste einfügen
11. code = ein Code-Beispiel kennzeichnen
12. more = Der "weiterlesen…"-Link trennt den Text in eine Einleitung (engl. Teaser) und den Rest.
13. nachschlagen = Standardmäßig wird www.answers.com geöffnet, um nach einem Wort zu suchen.
14. Tags schließen = alle offenen Tags werden geschlossen
15. fullscreen = öffnet den Editor im Vollbildmodus

Generell gilt, dass Sie zwei Möglichkeiten haben, die Tags einzufügen:

Entweder Sie klicken den gewünschten Tag an, z. B. b, es erscheint der öffnende Tag <strong>, Sie schreiben Ihren Text und schließen den Tag mit einem erneuten Klick auf das b oder auf den Button "Tags schließen". Es erscheint nun der schließende Tag </strong>.

Oder Sie markieren einen Textabschnitt oder ein Wort und klicken dann den gewünschten Button an, z. B. b. Der öffnende und der schließende Tag werden dann automatisch vor und hinter dem markierten Bereich eingefügt. Beide Varianten führen zu folgendem Ergebnis:

<strong>Dieser Abschnitt ist sehr wichtig.</strong>

Tastaturkürzel

Mit Tastaturbelegungen arbeitet mittlerweile fast jeder. Am häufigsten genutzt wird wahrscheinlich Strg+C (kopieren) und Stg+V (einfügen), gerne natürlich auch Strg+Z (rückgängig).

Auch der Editor von Worddpress erlaubt einem das Arbeiten mit Tastaturkürzeln. Aufpassen muss man lediglich, weil es unterschiedliche Tastaturkürzel gibt, abhängig davon welchen Editor man nutzt. Außerdem decken die Tastaturkürzel unterschiedliche Sachen ab.

englischTastaturkürzeldeutsch
Bold	Alt+SHIFT+b	fett
Italics	Alt+SHIFT+i	kursiv
Del (strikethrough)	Alt+SHIFT+d	durchgestrichen
Ins (insert date/time)	Alt+SHIFT+s	eingefügt
Link	Alt+SHIFT+a	Link
Insert img URL	ALT-SHIFT-m	Bild einfügen
Blockquote	Alt+SHIFT+q	Zitat
Code	Alt+SHIFT+c	Code
Read More	Alt+SHIFT+t	Mehr
Unordered List (ul)	Alt+SHIFT+u	Unsortierte Liste
Ordered List (ol)	Alt+SHIFT+o	Sortierte Liste List
Item (li)	Alt+SHIFT+l	Listeneintrag

Tabelle 1: Tastaturkürzel im HTML-Editor

2.2 Arbeiten mit dem Visuellen Editor

Das Verhalten des Visuellen Editors ist in Bezug auf die Zeilenumbrüche etwas anders als in der HTML-Ansicht.

Hier genügt es einmal die Enter-Taste zu betätigen um einen Absatz (<p></p>) zu generieren. Möchte man einen Zeilenumbruch generieren, dann muss man – so wie in Word – die Tastenkombination Shift + Enter drücken.

1.2.1 Text formatieren

Der Text in der Textbox des Visuellen Editors kann mit den Buttons, die sich im oberen Bereich der Textbox befinden, formatiert werden. Folgende Möglichkeiten stehen Ihnen dabei zur Verfügung:

1. Der entsprechende Abschnitt wird als sehr wichtig hervorgehoben bzw. fett formatiert.
2. Der entsprechende Abschnitt wird als wichtig hervorgehoben bzw. kursiv formatiert.
3. Der entsprechende Abschnitt wird durchgestrichen.
4. Der entsprechende Abschnitt stellt eine Aufzählungsliste dar.
5. Der entsprechende Abschnitt stellt eine nummerierte Liste dar.
6. Der entsprechende Abschnitt wird als Zitat gekennzeichnet.
7. Linksbündiger Absatz.
8. Zentrierter Absatz.
9. Dieser Absatz wird rechtsbündig.
10. Einen Link einfügen/ändern.
11. Einen Link entfernen.
12. Der "weiterlesen…"-Link. Trennt den Text in eine Einleitung (engl. Teaser) und den Rest.
13. Die Rechtschreibprüfung. (Über das Dropdown-Feld können Sie die Sprache einstellen.)
14. Mit diesem Button de-/aktivieren Sie den Vollbildmodus des Editors.
15. Der letzte Button erweitert die Formatierungsleiste des visuellen Editors, wie man schön in der nächsten Abbildung sehen kann.

1. In der Auswahlliste mit dem Namen "Absatz" befinden sich neun Auswahlmöglichkeiten, mit denen Sie den Inhalt kennzeichnen können: Absatz, Überschriften etc.
2. Dieser Textabschnitt wird unterstrichen. Sie sollten allerdings auf diese Auszeichnung/Formatierung verzichten, da im Web ein unterstrichener Text einen Link symbolisiert. Der Nutzer ist dann evtl. irritiert, wenn manche "Links" anklickbar sind und manche wiederum nicht.
3. Der entsprechende Textabschnitt bekommt einen Blocksatz. Denken Sie bitte daran, dass es im Web bzw. (X)HTML und CSS keine Silbentrennung gibt und der Blocksatz durch vergrößerte Leerzeichen simuliert wird. Dies kann zu unschönen Lücken im Text führen.
4. Mit diesem Knopf bestimmen Sie die Textfarbe.
5. Einen unformatierten Text einfügen. Hier werden die Formatierungen aus der ursprünglichen Quelle nicht übernommen. Sehr wichtig, wenn Sie Texte aus einer Textverarbeitung (z.B. Word oder OpenOffice), aber nicht deren Formatierung aus dem Programm übernehmen möchten. Dies entspricht der Funktion "unformatierten Text einfügen" aus MS Word.
6. Bei dem Knopf mit dem Word-Symbol handelt es sich um die Möglichkeit einen Text inkl. seiner Formatierungen aus der ursprünglichen Anwendung einzufügen. Hierbei werden die Formatierungen übernommen, soweit dies mit (X)HTML und CSS möglich ist.
7. Unter dem Knopf mit dem Radiergummi-Symbol verbirgt sich eine Funktion, die Formatierungen für einen Textabschnitt nachträglich entfernt.
8. Hinter dem Button mit dem Omegasymbol verbirgt sich eine sehr hilfreiche Funktion. Hier haben Sie die Möglichkeit, ganz einfach und komfortabel Sonderzeichen einzufügen.
9. Einzug zurück.
10. Einzug vor.
11. Ein Bearbeitungsschritt zurück.
12. Ein Schritt in der Bearbeitung vor.
13. Die Hilfe.

Die Funktionen der einzelnen Buttons sind selbsterklärend und die Symbole entsprechen denen aus gängigen Textverarbeitungs- oder E-Mail-Programmen (erweiterte Ansicht) bzw. anderen CMS.

Fähigkeiten des Editors, die einer Erklärung bedürfen – wie z. B. Links und Dateien einfügen – werden im Folgenden näher erläutert. Sie gelten sowohl für das Arbeiten mit dem HTML- wie auch mit dem Visuellen Editor.

Tastaturkürzel

Auch während der Arbeit mit dem Visuellen Editor können Sie auf Tastaturkürzel zurückgreifen. Aber Achtung, diese sind nicht identisch mit denen des HTML-Editors.

englisch	Tastaturkürzel	deutsch
Advanced Editor	Alt+SHIFT+z	Werkzeugleiste ein/aus
Align Left	Alt+SHIFT+l	linksbündig
Align Center	Alt+SHIFT+c	zentriert
Align Right	Alt+SHIFT+r	rechtsbündig
H1 Header	STRG+1	Überschrift 1
H2 Header	STRG+2	Überschrift 2
H3 Header	STRG+3	Überschrift 3
H4 Header	STRG+4	Überschrift 4
H5 Header	STRG+5	Überschrift 5
H6 Header	STRG+6	Überschrift 6
Paragraph	STRG+7	Absatz
Format	STRG+8	Format
Address	STRG+9	Adresse

Tabelle 2: Tastaturkürzel im Visuellen Editor

Zwischen den Editoren (HTML und Visuell) kann man übrigens mit den Tastenkombination Alt+Shift+e hin und her schalten.

Im nächsten Teil, der in ein paar Tagen erscheinen wird wird es unter anderem darum gehen wie man Links und Dateien einfügt, dem Vollbildmodus und einigem mehr.

«« Zum vorherigen Beitrag — Zum nächsten Beitrag »»

---

13 Reaktionen auf diesen Beitrag

Kommentare

1. 

   Judith sagte am
   Donnerstag, 15. März 2012 um 22:27 folgendes:

   Und gibt es auch ein Tastaturkürzel für das Veröffentlichen???
2. 

   nao-prozess.de sagte am
   Montag, 30. April 2012 um 09:44 folgendes:

   Wie läßt sich denn sicherstellen, daß das die untere Formatierungsleiste (Abbildung 5) überhaupt angezeigt wird?
   Bei mir ist überhaupt nur die obere (Abbildung 4) zu sehen.
   • 

     Sahanya sagte am
     Montag, 30. April 2012 um 12:37 folgendes:

     Die untere Reihe öffnet sich bei einem Klick auf den letzten Button (Nr. 15) der oberen Reihe.
     • 

       nao-prozess.de sagte am
       Montag, 30. April 2012 um 14:43 folgendes:

       Danke – tja, ich hätte wohl einfach auch die Anleitung zu der mir vermeintlich bereits bekannten oberen Leiste lesen sollen…
       • 

         Sahanya sagte am
         Donnerstag, 03. Mai 2012 um 11:05 folgendes:

         

Trackbacks und Pingbacks

1. WordPress-Newsletter Nr. 20 | WordPress & Webwork
2. Wordpress Artikel erstellen | Computerstammtisch
3. Erstellen, Veröffentlichen, Moderieren mit WordPress 3.2 (2) | WordPress-Buch
4. WordPress: Anleitung für Autoren und Redakteure | WordPress & Webwork
5. Linkempfehlung: Arbeiten mit WordPress 3.2 - Webdesigner Fotograf Oldenburg Bremen WordPress Internet Agentur
6. Erstellen, Veröffentlichen, Moderieren mit WordPress 3.2 (3) | WordPress-Buch
7. Erstellen, Veröffentlichen, Moderieren mit WordPress 3.2 (4) | WordPress-Buch
8. [Shared Artikel] Nutzen von Wordpress | Lüftungsanlagen in Wohngebäuden

Tut mir Leid, die Kommentarfunktion für diesen Beitrag wurde geschlossen.