Die Lösung ist ganz einfach:

1. Der entsprechende Artikel wird geöffnet
2. In der Box “Publizieren”, bei “Publiziert am:” auf [Bearbeiten] klicken
3. Jetzt das gewünschte Datum und die Zeit einstellen
4. Auf [OK] klicken
5. Mit Klick auf [Planen] bestätigen
6. Abschließend mit einem Klick auf [Aktualisieren] bestätigen

Der zuvor veröffentlichte Artikel ist nun ein geplanter Artikel und wird zum angegeben Zeitpunkt automatisch veröffentlicht.

Vergleiche hierzu auch den dritten Teil der Mini-Reihe: Einstieg in die redaktionelle Arbeit mit WordPress – Teil 3

Die Begeisterung kennt keine Grenzen, der aktuelle Trailer zu “Pirates auf the Caribean” soll eingebunden werden um darüber ein paar warme Worte zu Verlieren. Unterhalb des Videos auf Youtube befindet sich weiterhin der Button [Einbetten]. Ein Klick auf diesen zeigt etwas Neues (Bild 1).

Erstens, der Quelltext hat sich geändert, statt wie bisher mit dem <object> Tag zu arbeiten, lacht uns nun ein < iframe> an. Das ist insofern nicht schön, als dass der Standard-Editor von WordPress mit Iframes gewisse Schwierigkeiten hat.

Was passiert mit denen? Das lässt sich einfach ausprobieren, wechsle mal in die HTML-Ansicht des Editors, füge den kompletten <iframe> ein. Nun ohne in die visuelle Ansicht zurückzuwechseln speichern und die Vorschau betrachten (Bild 2). Ja wunderbar, was redet der Mann? Geht doch. Jahaaaa, geht… im, Moment. ;-)

Jetzt wechsele mal zurück in die visuelle Ansicht und schreib noch ein paar Worte, danach speichern (immer noch in der visuellen Ansicht). Was geschieht? Zauberei, der <iframe> verabschiedet sich, weg ist das Ding.

Daraus lernen wir? Richtig: Nachdem der <iframe> eingebunden wurde, darf nicht mehr in der visuellen Ansicht gespeichert werden, ansonsten war die Mühe vergebens. Wie lässt sich das Umgehen?

1.: Use old embed code

Markiert das Kästchen mit einem Klick, dann ist der alte <object>-Code wieder da.  Es lassen sich übrigens auch die alten Optionen weiterhin nutzen (Farbwahl des Rahmens etc.). Dazu muss man nur in einen alten Quelltext gehen und sich die entsprechenden Passagen rauskopieren (Zeile 4):

Auch da hat sich Einiges geändert. Der Aufruf des eigentlichen Videos erfolgt nun via dem Parameter “movie”, zuvor war dafür der Parameter “src” verantwortlich. Es funktionieren derzeit aber noch beide. Im folgenden Beispiel habe ich den Quelltext eines älteren Posts genutzt und nur die Video-ID des Piraten-Trailer eingefügt:

2.: Nutze ein Plugin

Es gibt tonnenweise Plugins um Videos und andere Medien in WP einzubinden. Bei der Auswahl ist es hilfreich, wenn es sich um ein PlugIn handelt, welches von den Entwicklern auch entsprechend gepflegt wird. Das erkennt man nicht zuletzt an dem Release-Datum der letzten Version, der Kompatibilitätsanzeige (es geistern massig Plugins rum, welche nur mit alten WordPress-Versionen kompatibel sind) und der Bewertung durch die User.

Hier ist ein ganz guter Ausgangspunkt zur Suche: Klick
Fragen, Anmerkungen, Beschwerden? Immer her damit. :-)

Video aussuchen

I'm Shipping Up To Boston - Dropkick Murphys || Youtube

Youtube - Optionen zum Einbetten

Auf Youtube bin ich über ein Video der Dropkick Murphys gestolpert, das sagenhafte “I’m Shipping Up To Boston”. Unterhalb des Videos befinden sich einige Buttons, heute interessiert nur der Button [<Einbetten>]. Dieser wird jetzt angeklickt, das Fenster erweitert sich und es treten auf: Die Embedding Optionen (Bild rechts).

Festlegen der Optionen

Was steht hier eigentlich zur Verfügung?

Der Embedding-Code
Dieser Code wird in den WordPress-Artikel oder in die WordPress-Seite eingefügt. Aber HALT! Noch nicht, einige Anpassungen sind zuvor notwendig.

Vier Checkboxen
Hier werden einige Optionen festgelegt. Ich persönlich verzichte auf deren Nutzung, schließlich geht es mir um die Dropkick Murphys.

Farbschemata
Sie dienen der Auswahl des Farbschemas für den einzubettenden Youtube-Rahmen. Probiert es aus. Ich persönlich habe mich auf die grüne Variante eingeschossen.

Größe
Hier kann die gewünschte Größe der späteren Darstellung ausgewählt werden. Seit einiger Zeit existiert auch die Möglichkeit, ein benutzerdefiniertes Format zu wählen. Das ist genial. Auf netzgeist.org sieht es meiner Meinung nach am Besten aus, wenn die Videos eine Breite von 520px haben.

Es wird alles nach Wunsch ausgewählt bzw. eingestellt. Dabei kann man unschwer feststellen, dass sich der Code in dem Fenster jedesmal ändert, er passt sich automatisch an. Äußerst komfortabel. Mein Dropkick Murphy-Code sieht nun so aus (zwecks Übersichtlichkeit etwas auseinander gedröselt):

Code einfügen

HTML-Ansicht des Textes

Das eingebettete Objekt (Video) im visuellen Editor

Dieser Codeschnipsel muss jetzt noch in den Text eingefügt werden. Zuerst kopiert man diesen Code und fügt ihn dann nach Wunsch ein:

1. Ein Klick in das Youtube-Codefenster, alles ist automatisch markiert
2. [STRG]+[C] kopiert diesen Code in die Zwischenablage
3. Wechsel in die “HTML”-Ansicht des WordPress-Textes
4. An gewünschter Position durch [STRG]+[V] einfügen
5. Zurück in die “Visuell” Ansicht wechseln.

Jetzt bitte nicht wundern, zu sehen ist hier im Backend nur ein Rahmen mit einem klitzekleinen Flashsymbol in der Mitte. Der Rahmen stellt die Größe des Objektes dar.

Abschließend

Nun nur noch den Artikel oder die Seite speichern und dann mal vorsichtig nachschauen. Aussehen soll es so:

Anmerkungen

Haben die Urheber des Videos das Einbetten untersagt, dann steht oben genannter Weg nicht zur Verfügung. Und in der Regel ist es eine sehr schlechte Idee, sich das Video zum Beispiel per Downloadhelper auf den Rechner zu ziehen und dann selbst, direkt über den eigenen Webspace einzubetten. Der Ärger lässt nicht lange auf sich warten.

Die Möglichkeit des direkten Einbettens von Videos wird mittlerweile von allen großen Portalen unterstützt. Nicht immer so komfortabel (Auswahl von Größe, Rahmen etc.) wie bei Youtube, aber die Arbeitsschritte bleiben die Gleichen. Das ist vor allem dann interessant wenn die… GEMA und deren Schergen Beauftragte mal wieder Videos in Deutschland haben sperren lassen. In der Regel lassen sich diese Videos weiterhin über DailyMotion, Vimeo oder andere Dienste einbetten.

Es gibt durchaus auch WordPress Plugins, welche das Einbetten von Videos unterstützen. Zwei Gründe halten mich von deren Nutzung ab: Erstens habe ich ein weiteres Skript, welches auf netzgeist.org läuft und damit die “Gesamtlast” der Seite erhöht, deren Performance ein weiteres Stückchen verschlechtert und zweitens: Ich möchte die volle Kontrolle. ;)

Nachtrag 21.01.2011

Bitte auch hier weiterlesen, es hat sich doch Einiges geändert.

Fragen, Anmerkungen, Anregungen? Bitte die Kommentarfunktion benutzen.

Was wird benötigt

• Eine aktuelle Version von WordPress, diese findet man zum Beispiel bei wordpress.org im Downloadbereich
• Dann wird eine Umgebung benötigt, welche auf dem eigenen Rechner alles zu Verfügung stellt, was WordPress zum Laufen bringt (Apache-Server, Datenbanken usw. usf.). Hier nutzen wir XAMPP, erhältlich bei den Apache friends
• Einen vernünftigen Editor (nein, ich halte die von Windows mitgelieferten Editoren nicht für sonderlich “vernünftig”), meine Empfehlung: Notepad++. Einfach den aktuellen Installer herunterladen, installieren, fertig.

Schritt 1 – XAMPP installieren

Bild 2

Das ist einfach: Die heruntergeladene .exe Datei starten und den Anweisungen folgen. Empfehlung: Als Installationsverzeichnis direkt C:\ nutzen. Im Laufe der Installation, die übrigens doch ein wenig Zeit in Anspruch nimmt, öffnet sich unter anderem ein Batch-Fenster (Oldtimer werden jetzt nostalgisch und erinnern sich an alte Zeiten), welches unter anderem fragt, ob einige der Anwendungen (Apache, MySQL) als “Dienst”, also “Service” installiert werden sollen. Nein, sollen sie nicht. Irgendwann ist die Installation abgeschlossen und es befindet sich ein neues Icon auf dem Desktop (Bild 2).

Schritt 2 – XAMPP (Apache und MySQL) starten

Bild 3

Bild 4

WordPress benötigt eine Datenbank und der eben installierte Server stellt uns MySQL zur Verfügung. Also los, das wird jetzt “mal eben” erledigt: XAMPP Control Panel über das eben vorgestellte Icon starten. Es öffnet sich das… hm, ja, das Control Panel (Bild 3).

1. Apache durch Klick auf [Start] starten, warten bis die Meldung “Running” erscheint
2. MySQL durch Klick auf [Start] starten, warten bis die Meldung “Running” erscheint
3. Wenn alles so aussieht wie in Bild 4: das Apache Admin-Panel starten (Apache, nicht irgendetwas anderes!)

Schritt 3 – Datenbank anlegen

Bild 5

Bild 6

Nach dem Start des Admin Panels öffnete sich eben im Browser ein neues Fenster/ein neuer Tab. Interessant ist im Moment vor allem der Zugang zu phpMyAdmin, eine Software, welche einen einfachen Zugang zur Arbeit an und mit MySQL-Datenbanken bietet. phpMyAdmin wird über das Menü, durch Klick auf den entsprechenden Menüpunkt gestartet (Bild 5, unter “Tools”). Es öffnet sich phpMyAdmin (Bild 6). Im Moment interessieren nur die beiden Felder unter “Neue Datenbank anlegen”:

1. Datenbanknamen vergeben. Keine Sonderzeichen, keine Leerzeichen, z.B. wordpress_test15
2. In Dropdown-Feld “Kollation” wird utf8_bin gewählt
3. [Anlegen] klicken

Das war es erstmal. Die Datenbank ist angelegt, es muss nichts weiter geändert oder eingetragen werden. Für die Installation von WordPress werden später drei Angaben benötigt. Der Name des Benutzers, das Passwort für die Datenbank und die Angabe des Hostes. Für die Arbeit an einer lokalen WordPress-Installation sind die Default-Angaben aber ok:

• Benutzer: root
• Passwort:          (richtig, kein Passwort)
• Host: localhost

Schritt 4 – WordPress installieren

Das Ende der Installation nähert sich in großen Schritten, viel bleibt nicht zu tun. Das heruntergeladene WordPress zip-Archiv wird auf dem lokalen Server entpackt.  Das Zielverzeichnis ist C:\xampp\htdocs. Mit dem Editor der Wahl wird die Datei wp-config-sample.php geöffnet. Ab Zeile 16 wird es interessant, hier werden die Daten der MySQL-Datenbank eingetragen.

// ** MySQL Einstellungen - diese Angaben bekommst du von deinem Webhoster** //
/**  Ersetze database_name_here mit dem Namen der Datenbank, die du verwenden möchtest. */
define('DB_NAME', 'wordpress_test15');

/** Ersetze username_here mit deinem MySQL-Datenbank-Benutzernamen */
define('DB_USER', 'root');

/** Ersetze password_here mit deinem MySQL-Passwort */
define('DB_PASSWORD', '');

/** Ersetze localhost mit der MySQL-Serveradresse */
define('DB_HOST', 'localhost');

/** Der Datenbankzeichensatz der beim Erstellen der Datenbanktabellen verwendet werden soll */
define('DB_CHARSET', 'utf8');

/** Der collate type sollte nicht geändert werden */
define('DB_COLLATE', '');

Die Eingabe der Sicherheitsschlüssel – ab Zeile 36 – kann hier theoretisch vernachlässigt werden. Eigentlich soll man sich so etwas aber gar nicht erst angewöhnen. Die Datei wird nun als wp-config.php gespeichert.

Endspurt! Nun wird im Browser die Installationsdatei von WordPress aufgerufen: http://localhost/wordpress/wp-admin/install.php – Username und Passwort eingeben, fertig. Zukünftig kann das lokal installierte WordPress über http://localhost/wordpress/ aufgerufen werden.

Fragen? Unklarheiten? Bitte die Kommentarfunktion benutzen. :)

Tatsächlich möchte ich das nur unter bestimmten Artikeln stehen haben, das bedarf allerdings noch einiger Schraubereien am Quellcode. Und es ist möglich, einigen Blödsinn zu veranstalten, auch dass gefällt mir nicht im Geringsten. :) Mal schauen.

Update: Im Moment ist das PlugInfür nicht registrierte Besucher deaktiviert!

Update des Updates: Feines Tool, hier wird es allerdings nicht benötig.

Logo "Blind Elephant"

Auf der Black Hat-Konferenz in Las Vegas hat die Firma Qualis ihre Open Source Anwendung Blind Elephant vorgestellt. Blind Elephant scannt Webseiten nach unsicheren, angreifbaren Anwendungen. Eine Untersuchung von insgesamt 1.084.152 betriebenen Online-Applikationen hat ein recht erschreckendes Bild ergeben. Die negative Hitliste sieht folgendermaßen aus:

1. phpBB – 100% der untersuchten Installationen zeigen kritische Schwachstellen
2. Mediawiki – 95% der untersuchten Installationen zeigen kritische Schwachstellen
3. Joomla! – 92% der untersuchten Installationen zeigen kritische Schwachstellen
4. Movable Type – 91% der untersuchten Installationen zeigen kritische Schwachstellen
5. phpMyAdmin – 85% der untersuchten Installationen zeigen kritische Schwachstellen
6. Moodle – 74% der untersuchten Installationen zeigen kritische Schwachstellen
7. Drupal – 70% der untersuchten Installationen zeigen kritische Schwachstellen
8. SPIP – 65% der untersuchten Installationen zeigen kritische Schwachstellen
9. WordPress – 4% (in Worten “vier”!) der untersuchten Installationen zeigen kritische Schwachstellen

Das sehr gute Ergebnis von WordPress wird unter anderem der sehr einfachen Updatefähigkeit des Systemes zugeschrieben. Die meisten untersuchten WordPress-Installationen beinhalten recht aktuelle Versionen. Generell gelten die WordPress-Versionen ab 2.5.1 (aktuell ist die Version 3.0.1) als relativ sicher. Ein starkes Argument für das regelmäßige Updaten von WordPress, den Themes und PlugIns!

Quellen

Qualis PDF mit den Ergebnissen der Studie – Link
Qualis Whitepaper zum Fingerprinting von Web-Anwendungen – Link

1. Überblick (Fertig)
2. Erstellen eines Artikels (Fertig)
3. Metaangaben (Über die Menüs “Publizieren”, “Schlagwörter/Tags”, “Kategorien”) – (Fertig)
4. Arbeiten mit Tabellen (WP-Tables Reloaded Plugin) – Später
5. Arbeiten mit Galerien (NextGenGallery) – Später
6. Einfachste Bildbearbeitung mit IrfanView – (Fertig, Du liest ihn gerade)

Aus gegebenem Anlass ziehe ich das Thema “Bildbearbeitung” vor, der Rest kommt später. Bevor Du loslegst eine Bitte: Einmal komplett durchlesen und dann erst Gas geben… danke. ;)

Screenshot IrfanView

Du hast eine schöne Digitalkamera, aber mit Bildbearbeitung nicht so viel am Hut. Programme wie Gimp, Photoshop und Consorten erschlagen Dich mit Ihren Möglichkeiten, ohne ein Studium scheint erstmal nicht zu gehen, mal abgesehen davon das Photoshop richtig viel Geld kostet (Hüte Dich vor Raubkopien, erstens ist es illegal – definitiv KEIN Kavaliersdelikt und zweitens melden sich viele Programme auf dem Herstellerserver an, ohne dass Du davon irgendetwas merkst. Das gibt viel Spaß mit der Staatsanwaltschaft!)

Es gibt mehrere Lösungen zum Nulltarif z.B. IrfanView und Gimp, wir kümmern uns jetzt um die (in meinen Augen einfachste) Bildbearbeitung mit Hilfe des Programmes IrfanView. Ursprünglich als reines Bildbetrachtungsprogramm entwickelt, ist IrfanView mittlerweile ein sehr nettes, schlankes Werkzeug um kleinere Arbeiten rasch zu erledigen. Derzeit (Mai 2010) ist die Version 4.2.7 aktuell. Downloadquellen folgen jetzt.

Installation

Was brauchst Du um loslegen zu können? Zuerst sind zwei(!) Installationspakete herunter zu laden:

• IrfanView in der aktuellste Version >>>Klick<<<
• die Plugins zu IrfanView (stellt zusätzliche Funktionen bereit, gibt es zum Beispiel hier => Klick)

Sobald beide Zip-Archive auf dem Rechner liegen wird erst IrfanView selbst und danach das Plugin-Paket installiert. Das ist sehr schnell erledigt. Während der Installation von IrfanView fragt das Programm, welche Dateiarten mit IrfanView verknüpft werden sollen. Das must Du letztendlich selber wissen, ich habe IrfanView mit allen Medientypen verknüpft weil ich es wirklich ständig benutze. Und dann kann es auch schon losgehen.

Erster Programmstart – Voreinstellungen

Mit Klick auf das Icon (was soll das eigentlich darstellen? Ein platt gefahrener Zonk?) startet das Program… doch oh weh, alles in englischer Sprache. Kein Problem, Du musst Dir das Leben nicht unnötig schwer machen. Du öffnest das Menü [OPTIONS] und klickst dort auf “CHANGE LANGUAGE…” es öffnet sich folgendes Fenster:

Hier klickst Du “Deutsch” bzw. “DEUTSCH DLL” an, bestätigst durch einen beherzten Klick auf [OK] und das Programm spricht Deutsch. Nachdem das erledigt ist, geht es jetzt mit den grundlegenden Funktionen weiter. Um eine etwas komfortablere Anzeige zu erhalten, empfehle ich die Einstellung, dass große Bilder an das IrvanView-Fenster angepasst werden sollen. Dazu gehst Du in des Menü [ANSICHT], dann auf [ANZEIGEOPTIONEN] und klickst auf “Nur große Bilder an Bildschirm anpassen“. Hier kann man auch ruhig herumprobieren. Nachdem all das erledigt ist kümmern wir uns um die Bilder an sich.

Das Problem

Du hast auf Deinem Rechner einige Bilder von dem tollsten Pferd der Welt, nämlich Deinem und willst diese der Online-Welt präsentieren. Deine Kamera ist der Hammer, die löst locker 8 Millionen Pixel auf, entsprechend sind die Bilder riesig. Allerdings sind auch heute noch viele Menschen mit augenschonenden Monitorauflösungen unterwegs und müssten sich einen Wolf  scrollen um Dein Pferd im Ganzen zu erfassen. Andererseits gibt es auch viele Menschen, die nicht mit 16.000er DSL am Netz hängen und bei diesen dauert es ganz schön lange, bis so ein riesen Bild im Browser geöffnet wird. Du willst diesen Besuchern etwas Gutes tun? Fein, dann werden wir uns jetzt mal anschauen wie die Bilder schnell sowohl im Format als auch im Speicherbedarf verkleinert werden können. Dazu suche ich jetzt mal eine freie Beispieldatei… moment…

Ändern der Bildgröße

Aha: Da ist ja ein Bild (wikipedia sei Dank), fotografiert von der flickr Userin Nikki Tate unter der Creative Commons-Lizenz

“Namensnennung-Weitergabe unter gleichen Bedingungen 2.0 US-amerikanisch (nicht portiert)”

lizensiert…. Vorsicht, jetzt wird es GROSS:

Bild vom Hannoveraner, unbearbeitet (472kb gross, 964 x 729 Pixel, © Nikki Tate)

Dieses Bild hat eine Auflösung von 964 x 729 Pixel. Zum direkten Einbinden in eine Seite ist es eigentlich zu groß, Du schrumpfst das jetzt auf eine Breite von 640 Pixel. Und das geht so:

1. Öffnen des Bildes in IrfanView – In Deinem Bilderordner Rechtsklick auf die Datei, “ÖFFNEN MIT” wählen oder IrfanView starten und über [DATEI] => [ÖFFNEN] das gewünschte Bild öffnen
2. 

   IrfanView Fenster zum Ändern der Bildgröße

   Die Größe des Bildes ändern – Menü [BILD] => “GRÖSSE ÄNDERN“, schwupps öffnet sich ein Fenster (siehe rechts)

3. Ist unter “Einheit” Pixel ausgewählt? Wenn ja ist es gut, wenn nein mach das bitte jetzt.
4. Hier gibst Du in dem Feld “BREITE” 640 ein, den Rest nicht anfassen
5. Kontrolliere bitte, ob “PROPORTIONAL” mit einem Häkchen aktiviert ist
6. Kontrolliere auch die Angabe unter “DPI“. Hier hinein gehört ein Wert von 72. Warum? Erkläre ich ein anderes Mal
7. Abschließend ein Klick auf [OK], fertig
8. Bild in der neuen Größe speichern – Menü [DATEI], dann “SPEICHERN UNTER…” und dann wählst Du bitte einen anderen Ordner, nicht dass Du Dir Deine Originale überschreibst! Als Dateityp wählt Du JPG – JPG/JPEG FORMAT.

Hinweis: Bei der Benennung der Dateien bitte möglichst kurz bleiben, Sonderzeichen und Umlaute dringend vermeiden, möglichst auf Leerzeichen verzichten, stattdessen mit Unterstrichen (_) arbeiten, z.B. schoenstes_pferd_von_die_ganze_welt_mindestens.jpg … ok, ich arbeite noch an der Länge der Dateinamen…

ACHTUNG

Nur noch 10kb aber extrem verpixelt und verrauscht

Unten in dem Fenster findest Du ein Kästchen “OPTIONEN ANZEIGEN“, aktiviere das bitte, es öffnet sich ein kleines Zusatzfenster. Hier kannst Du mit dem Schieber die Kompressionsrate verändern. Je niedriger der eingestellte Wert, desto höher die Kompression und desto kleiner die bearbeitete Datei. Aber es gibt Grenzen! Zu stark komprimierte Bilder zeigen Pixelfehler und andere unschöne Effekte. Probiere ruhig ein wenig herum, es gilt die Datei schlank zu halten (das verringert die Ladezeiten) ohne zu brutale Qualitätseinbußen in Kauf zu nehmen. Ich persönlich fahre ganz gut damit, Bilder auf ungefähr 65% einzudampfen. Ausnahmen bestätigen die Regel. Rechts oben ein Beispiel, bei dem ich die Kompression deutlich übertrieben habe.

Das bearbeitete Bild, jetzt in 640 x 483 Pixel und knapp 40kb

Hier links sieht es deutlich besser aus. Mit der Einstellung “65%” komprimiert verschwinden die groben Fehler. Nun kann das Bild in Deinen Text eingebunden werden. Selbstverständlich ist es auch möglich, das Bild für sich allein stehen zu lassen oder aber zu einer bestehenden Gallerie hinzu zu fügen. Die Dateigröße beträgt nur noch ca. 10% der Originaldatei.

Feines Programm nicht wahr? Es würde zu lange dauern, alle Möglichkeiten von IrfanView vorzustellen. Man kann Diashows zusammenstellen, größere Bildermengen gleich stapelweise verarbeiten, in verschiedenste Formate umwandeln, usw. usf. Sehr schön ist die Leuchtkastenfunktion: Du hast eins von vielen Bildern aus einem Ordner geöffnet. Drücke nun auf [T] und Du bekommst eine Vorschauansicht aller in diesem Ordner befindlicher Bilder. Die Größe der Vorschaubilder und vieles mahr kannst Du in den Optionen einstellen.

Oder mal ganz schnell einen Bildausschnitt fertigen:

1. Rahmen um den gewünschten Bereich ziehen, eventuell noch kurz anpassen
2. [Strg + X] – markierten Ausschnitt ausschneiden und in die Zwischenablage packen
3. [Strg + V] – Ausschnitt aus der Zwischenablage in IrfanView darstellen
4. [S] – Bild speichern unter… und Du musst nur noch den Dateinamen vergeben, unter welchem der Ausschnitt gespeichert werden soll. :)

Fragen? Es fehlen Dir Infos? Dann nutze bitte die Kommentarfunktion, ich antworte schnellstmöglich. Und um Gimp kümmern wir uns ein anderes Mal…

1. Überblick (Fertig)
2. Erstellen eines Artikels (Fertig)
3. Metaangaben (Über die Menüs “Publizieren”, “Schlagwörter/Tags”, “Kategorien”) – (Fertig, Du liest ihn gerade)
4. Arbeiten mit Tabellen (WP-Tables Reloaded Plugin) – Später
5. Arbeiten mit Galerien (NextGenGallery) – Später
6. Einfachste Bildbearbeitung mit IrfanView – (Fertig)

Nachdem der Artikel geschrieben wurde muss der ja auch irgendwie ins Netz gestellt werden. Das geschieht mittels des Menüs “Publizieren”. Du findest es unter Artikeln erstellen oder auch Artikel bearbeiten rechts oben.

Publizieren

Hier finden sich verschiedene Einstellmöglichkeiten und die werden wir von oben nach unten durchgehen. Nur eines im Voraus: Der blaue Button [Publizieren] sorgt dafür, dass Dein Text veröffentlicht wird.

Was, wenn ich diesen versehentlich anklicke, obwohl der Artikel noch nicht fertig ist?

Kein Problem, Du wirst es gleich sehen. Ein Klick auf [Speichern] speichert Deinen Artikel. Dabei bleibt der Status “Entwurf” erhalten, der Text ist also noch nicht veröffentlicht. Du kannst jetzt aber den Entwurf verlassen und etwas ganz Anderes machen. Wenn Du an dem Artikel weiterarbeiten möchtest ist der Text in der zuletzt gespeicherten Version vorhanden.

Um zu sehen was Du bisher fabriziert hast, klickst Du auf [Vorschau]. Es öffnet sich ein neuer Tab (z.B. Firefox) oder ein neues Browserfenster (z.B. Internet Explorer) und Du siehst den Artikel so, wie er erscheinen würdest wenn Du jetzt auf [Publizieren] klicken würdest.

Im Feld “Status” siehst Du den Veröffentlichungsstatus Deines Artikels. Im Bild ist dieser momentan “Entwurf“. Nachdem Du auf [Publizieren] geklickt hast, ändert sich der Status in “Veröffentlicht“. Angenommen, die Jugendgruppe Deines Vereines möchte selbst Artikel verfassen, Du willst diese aber vor der Veröffentlichung noch kontrollieren und gegebenenfalls nachbessern lassen:

• Die jungen Leute bekommen den Nutzerstatus “Autor“
• Alles was diese dann schreiben bekommt den Status “Ausstehender Review“
• Ist der Artikel Deiner Meinung nach reif für die Veröffentlichung, kannst Du diesen [Publizieren]
• Voraussetzung dafür: Du selbst hast die Nutzerrolle “Redakteur” oder “Administrator” (oder aber eine andere Rolle, welche Dir entsprechende Rechte einräumt. Das hängt ganz davon ab, welche Rollen auf der jeweiligen WordPress-basierten Seite eingerichtet wurden).

Dann gibt es noch die “Sichtbarkeit“. Das wird sehr interessant, wenn Du beispielsweise den Mitgliedern des zuvor schon erwähnten Reitvereines exklusive Informationen auf der Internetseite präsentieren möchtest. Angenommen, die Mitglieder sollen sich, so sie mögen, die Protokolle der letzten Jahreshauptversammlung auch im Internet durchlesen können (Eventuell kann man so eine ganze Menge Porto sparen). Dann hast Du hier zwei Möglichkeiten:

1. Du versiehst Deinen Artikel mit einem Passwortschutz und verteilst das Passwort exklusiv an die Mitglieder des Vereines. Wollen diese dann die so geschützten Inhalte lesen, müssen sie zuerst das Passwort eingeben. Selbstverständlich besteht immer die Möglichkeit, dass dieses Passwort weitergegeben wird. Aber in diesem beispielhaften Fall wäre das vielleicht nicht so dramatisch?
2. Du setzt die “Sichtbarkeit” des Artikels auf “Privat“. Solche Inhalte sind nur noch für Personen sichtbar, deren Rolle, z.B. “Vereinmitglied” auch die Berechtigung zum Betrachten privater Artikel beinhaltet.

Und was hat es mit dem Kästchen “Diesen Artikel auf der Startseite halten” auf sich?

Wenn Du eine wichtige Ankündigung schreibst, zum Beispiel, dass ein Turnier ausfallen muss o.ä., dann kannst Du dafür sorgen, dass dieser Artikel auf alle Fälle als Erster auf der Internetseite erscheint. Dazu klickst Du einfach das Kästchen “Diesen Artikel auf der Startseite halten” an. Ist diese Ankündigung irgendwann hinfällig, beispielsweise weil ein wichtiger Termin verstrichen ist, dann entfernst Du einfach die Markierung dieses Kästchen. Nach dem Speichern wird der Text dann automatisch in die normale Artikelreihenfolge zurückgesetzt.

Abschließend werfen wir einen Blick auf das Feld “Sofort publizieren“. Ich mag diese Funktion sehr. Nehmen wir einmal an, die Planung der Arbeitsdienste für das laufende Jahr wurde fertig gestellt. Du hast geplant, jeweils drei Tage vor diesen Terminen eine Erinnerung ins Internet zu stellen, auf dass viele Vereinsmitglieder zum Mitarbeiten kommen. Mit dieser Funktion kannst Du Dir das Leben deutlich leichter machen:

1. Du schreibst Deinen Text, Titel vielleicht “Erinnerung – Arbeitsdienst am xx.xx.2010″
2. Jetzt kopierst Du den Text und legst für jeden Arbeitsdiensttermin einen Artikel an
3. Nun änderst Du das Datum im Titel des ersten Textes.
4. Danach klickst Du bei “Sofort publizieren” auf [Bearbeiten] und setzt das Veröffentlichungsdatum auf 3 Tage vor dem eigentlichen Termin, 06:00 Uhr morgens.
5. Nun klickst Du auf [Publizieren], fertig. Drei Tage vor dem Arbeitsdienst wird dieser Artikel morgens um 06:00 Uhr automatisch veröffentlicht.

Die Schritte  3. bis 5. wiederholst Du für jeden Arbeitsdienst und danach brauchst Du Dich in diesem Jahr nicht mehr um diese Routinesache kümmern. Klasse, oder? Das ist auch sehr praktisch wenn Du in den Urlaub fährst, aber eigentlich währenddessen einen beliebigen Text veröffentlichen möchtest. Schreib alles vorher, binde die Bilder ein usw. usf. Dann legst Du das Veröffentlichungsdatum fest und fertig bist Du damit.

Schlagwörter

In diesem Feld werden Schlüsselbegriffe vergeben, die den Inhalt bzw. das Thema Deines Artikels beschreiben. Es geht nicht um Masse, wichtig ist, möglichst exakt den Schwerpunkt des Artikels zu erfassen. Links siehst Du ein Beispiel für ziemlich viele Tags… *hüstel*. Diese Begriffe sind unter anderem auch für Suchmaschinen relevant. Diese können dann nämlich den Inhalt der Artikel besser einsortieren (indexieren). Außerdem hilft es Besuchern Deiner Internetseite dabei, Gesuchtes schneller und treffsicherer zu finden.

Die Schlagwörter werden einfach hintereinander eingegeben. getrennt werden diese durch Kommata. Mit einem Klick auch [Hinzu] werden diese an den Artikel “gehängt”. Hast Du Dich verschrieben, dann kannst Du jederzeit Begriffe löschen, indem Du das graue Symbol vor dem Begriff anklickst (Kreuz im Kreis). Auch das Hinzufügen weiterer Schlagwörter ist jederzeit möglich, selbst wenn der Artikel schon vor langer Zeit veröffentlicht wurde.

Mit einem Klick auf [Wähle aus den beliebtesten...] werden die bisher vergebenen Schlagwörter angezeigt. Du kannst hier durch einfaches Anklicken bereits in der Vergangenheit vergebene Begriffe dem neuen Artikel zuordnen.

Das ist ja einfach.

Sag ich doch. Eigentlich ist alles recht einfach. Durch die Vielzahl an Möglichkeiten wirkt WordPress im ersten Moment kompliziert. Ist es aber nicht wirklich, man muss sich nur erstmal dran gewöhnen. Auch und gerade im Vergleich mit anderen Content Management Systemen. Da gibt es wahrlich schröckliche Beispiele…

Kategorien

Jetzt kümmern wir uns nur noch um die Kategorien und dann wars das erstmal wieder.

Alle Artikel werden in sogenannte Kategorien einsortiert. Man könnte auch sagen: In thematisch organisierte Regale gepackt. Das schafft eine große Übersichtlichkeit, gerade wenn es im Laufe der Zeit sehr viele Artikel werden. Kategorien können jederzeit neu angelegt oder gelöscht werden (die Inhalte bleiben erhalten!).  Außerdem können auch Unterkategorien zu bestehenden Kategorien angelegt werden. Man sollte allerdings darauf achten nicht zu viele Kategorien zu erstellen. Eine weitere “Feinsortierung” der Inhalte wird ja beispielsweise durch die Schlagwörter erreicht.

Um Deinem Artikel den passenden Kategorie-”aufkleber” zu verpassen, markierst Du einfach das entsprechende Kästchen im Menü “Kategorien“.

Und wenn ich nun etwas über unsere Volti-Pferde schreiben möchte, welche Kategorie nehme ich da?

Beide. Du kannst einem Artikel quasi beliebig viele Kategorien zuordnen. In diesem Beispiel würde ich es vielleicht bei der Kategorie “Voltigieren” belassen und dafür mit Schlagworten arbeiten. Falls spontan eine neue, noch nicht existente  Kategorie benötigt wird, kann diese mit einem Klick auf [+ Neue Kategorie...] angelegt werden.

Soweit, so bunt. Falls Fragen offen bleiben bitte ich um entsprechende Kommentare.

• Grundlagen zum Erstellen eines Child-Themes
• Anwendung der in Thematic integrierten Action- und Filter-Hooks
• Die unterschiedliche Gestaltung von Seiten ohne Veränderung des MarkUps

Viel Spaß beim Lesen und Lernen. Das Child-Theme, welches Leland erstellt hat findet Ihr >>>hier<<<.

1. Überblick (Fertig)
2. Erstellen eines Artikels (Fertig, Du liest ihn gerade)
3. Metaangaben (Über die Menüs “Publizieren”, “Schlagwörter”, “Kategorien”) – (Fertig)
4. Arbeiten mit Tabellen (WP-Tables Reloaded Plugin) – Später
5. Arbeiten mit Galerien (NextGenGallery) – Später
6. Einfachste Bildbearbeitung mit IrfanView – (Fertig)

Erstellen eines Artikels

Geht es nun endlich los?

Bild 1

Ja, jetzt geht es ins Eingemachte. Ein Artikel wird erstellt… gleich. Vorher werfen wir noch einen Blick auf den Editor. Diesen erreichen wir durch einen beherzten Klick im linken Menü. Nach dem Klick auf [Artikel] öffnet sich das dazugehörende Untermenü. In diesem finden wir den Menüpunkt [Erstellen] (2.). Noch ein Klick und der Editor öffnet sich.

Puh, viele Knöpfe und was bedeutet das ganze Zeugs rechts und unterhalb des Editorfensters?

Das “Zeugs” schauen wir uns jetzt mal an. Allerdings nicht alles. Im Moment geht es nur um die Funktionen des Editors selbst, sowie einige wenige Extras. Der Rest kommt später. Übrigens: Das Aussehen, vor allem die Anzahl der Knöpfe im Editor kann variieren. Das hängt unter anderem von den installierten Plugins (Funktionserweiterungen für WordPress) ab. Aber mach Dir keine Sorgen, das ist alles nicht sehr kompliziert. Also:

Das Fenster “Artikel bearbeiten”

Nur das Du es einmal gehört hast, das Teil heißt TinyMCE. Diese Information ist aber nebensächlich und Du kannst sie (vorerst) gleich wieder vergessen.

Du siehst sechs markierte Bereiche. (A.) bis (E.) behandeln wir im Folgenden. Um den Bereich (F.) kümmern wir uns später.

A. Die Titelzeile – Hier wird der Titel des Artikels eingetragen. Dieser erscheint nach der Veröffentlichung als Überschrift des Artikels.

B. Der Editor – Hier werden die Texte eingegeben und formatiert. Außerdem stehen einige Funktionen zur Verfügung, welche Du so nicht aus Deinem Textverarbeitungsprogramm kennst (und hier auch nicht alle kennen lernen wirst).

C. Publizieren – In diesem Feld werden verschiedene Dinge die Veröffentlichung Deines Artikels betreffend eingestellt. Ganz einfache Geschichte, damit halten wir uns nicht lange auf..

D. Schlagwörter – Hier werden einige wenige Begriffe eingefügt, welche den Inhalt Deines Artikels charakterisieren. Auch sehr einfach, später mehr dazu.

E. Kategorien – Hierwird Deinem Artikel eine Kategorie zugewiesen, unter deren Deckel er inhaltlich passt.

F. Hochladen/Einfügen – Alles was bunt macht. Hier fügst Du Bilder ein, verlinkst Dateien usw. usf. Das kommt noch lange nicht dran.

Schweinerei, das ist doch das Beste…

Naja, aber mit den ersten fünf Teilen wirst Du vorerst etwas beschäftigt sein. Wenn wir damit fertig sind geht es auch um Medien. Bis dahin musst Du Dich noch ein wenig gedulden. Bedenke: Wenn Du Bilder einfügen möchtest, dann solltest Du ein paar grundlegende Handgriffe einfachster Bildverarbeitung beherrschen.

Editor

Ein Tipp am Rande: Erst den Inhalt als Fließtext erfassen, dann formatieren und mit Bildern etc. versehen. Ein Fehler den die Mehrzahl der Anwender auch bei Textverarbeitungsprogrammen machen. Vom ersten Tastendruck an wird formatiert das es nur so kracht. Das ist aus mehreren Gründen unsinnig. Das wichtigste und bewusst kaum wahrgenommene Problem – Der Schreib-/Gedankenfluss wird ständig unterbrochen. Und das liest man aus dem Text heraus. Die Qualität des Textes leidet. Genauso ist es mit Tippfehlern. Nicht verharren, nachsehen, korrigieren. Das macht man hinterher wesentlich komfortabler.

Der neue Text kann eingegeben oder auf kopiert werden. Die Eingabe bedarf keiner Erläuterung, wohl aber das Kopieren. Es werden nämlich alle Formatierungen des Ursprungsprogrammes, z.B. Word mit kopiert. Das führt zu einem sehr aufgeblähten Quelltext, unter Umständen werden sogar die eigenen Formatierungen überschrieben. Um Texte unfallfrei zu kopieren gibt es den Button [Als unformatierten Text einfügen].

Ein Klick öffnet das „Einfügefenster“:

Mit [STRG] + [V] wird der Text in das Fenster eingefügt und mit Klick auf den Button [Einfügen] in den Artikel übernommen. Danach kann der Text dann nach Wunsch formatiert werden.

Links (Hyperlinks) im Text

Nun wäre das Netz nicht das Netz, wenn es keine Hyperlinks gäbe. Du willst einen Begriff aus unserem Text mit dem entsprechenden Eintrag in der Wikipedia verlinken.

Will ich?

Ja! Dazu markierst Du den Begriff mit der Maus oder per Doppelklick auf den Begriff. Plötzlich sind zwei Buttons erreichbar, die vorher nur grau und nicht funktionsfähig waren. Hast Du gesehen welche ich meine?

Na klar!

Hm, soso… Es handelt sich um die beiden Buttons [Link einfügen/ändern] und [Link entfernen]. Du willst einen Link einfügen, also klickst Du auf den linken Button, es öffnet sich das Fenster „Link einfügen/ändern“:

Unter „URL“ gibst Du die vollständige Internetadresse ein. Mit „Target“ kannst Du vorgeben, ob der verlinkte Inhalt in einem neuen, oder in dem aktuellen Browserfenster angezeigt wird. Ein Klick auf [Einfügen] … *ZACK*, der Begriff trägt jetzt einen Hyperlink mit sich herum. Zwischendurch das Speichern nicht vergessen!

Zu Hyperlinks könnte man noch viel erzählen, wichtig ist vielleicht Folgendes:

Es war und ist recht beliebt, diese Links in einem neuen Browserfenster oder Tab öffnen zu lassen. Allerdings spricht sich die Mehrheit der Usability-Spezialisten (Leute die sich um die Zugänglichkeit, Benutzbarkeit von Internetseiten und Programmen kümmern) mittlerweile dagegen aus. Der Besucher soll selbst entscheiden wo dieser Link geöffnet wird. Dem kann man folgen, muss man aber nicht.

Und was ist das hier?

Ah, ganz feines Ding. Das ist der „More“- oder genauer [More-Tag einfügen] Button.

Der “More” oder “Weiterlesen”-Button

Es ist ja so: Dein Text wächst und gedeiht, die Worte, Sätze, Absätze fließen nur so… und Dein Text wird länger und länger. Das ist aber ziemlich unschön, zumindest auf der Startseite macht es sich nicht so gut. Also setzt Du nach zwei oder drei Absätzen den Cursor in den Text und klickst beherzt auf diesen Button. In der Folge wird eine Art horizontale Linie mit Beschriftung eingefügt. Keine Sorge! Das soll so sein. Wenn Du den Artikel veröffentlichst, wird Dein Text bis zu dieser Position dargestellt und dann folgt direkt hintendran ein Link (Weiterlesen…), (Mehr…), (Den vollständigen Artikel lesen…) oder wie auch immer das bei Dir exakt getauft wurde. Erst nach Klick auf diesen Link wird Dein Artikel vollständig dargestellt. Das hält die Startseite ein wenig aufgeräumt/abwechslungsreich.

Bilder einfügen

Davon ausgehend, dass die Bilder zur Veröffentlichung vorbereitet wurden und auf Deinem Rechner bereitliegen…

Ähemm, was heißt “vorbereitet”? Ich hab hier massig Bilder die Online gestellt werden sollen! Was muss da noch vorbereitet werden?

OK, das behandeln wir später. Mit dem Erstellen von Artikeln hat das ja direkt nichts zu tun. Etwas Geduld bitte. Angenommen Deine Bilder sind zur Veröffentlichung bereit. Wir machen das jetzt Schritt für Schritt:

1. Klick auf den Button [Bild einfügen] -> Es öffnet sich folgendes Fenster:

2. Klick auf [Hochladen] und ein Auswahlfenster öffnet sich, in welchem Du ein Bild von Deiner Festplatte hochladen kannst:

3. Du hast ein Bild ausgewählt und diese Wahl mit [Öffnen] bestätigt. Das Fenster “Bild einfügen” ändert sich. Hier solltest Du nun einige Angaben machen.

Das Feld “Titel” wird ausgefüllt, der Titel des Bildes wird hier eingetragen. Danach ist das Feld “Alternativer Text” an der Reihe.

Fein, da kopiere ich den Text aus Titel und füge den dort ein…

Stopp! Nein, das tust Du nicht. DasFeld “Alternativer Text” hat eine ganz besondere Aufgabe. Hier wird das Bild beschrieben. Was würde ein Besucher sehen, wenn er das Bild betrachten würde? Dieses Feld macht Deine Seite etwas barrierearmer, bedenke das im Netz Millionen Menschen unterwegs sind, die nicht besonders gut oder gar nicht sehen können. Diese Menschen können dann erfahren, was dort abgebildet ist. Oder die vielen Nutzer, die die Anzeige von Grafiken per Browser-Einstellung unterdrücken.

Warum sollte man denn sowas machen, die spinnen doch!

Wenn Du die Anzeige von Bildern unterdrückst, surfst Du wesentlich schneller durch das Netz. Hast Du viel zu recherchieren, dann lässt sich so schon sehr viel Zeit sparen. Weiter geht es mit dem Feld “URL” (wir nehmen hier nicht alles durch, probiere einfach mal aus, was die einzelnen Optionen bewirken). In der Regel steht hier schon die Adresse des Originalbildes. Diese kannst Du ersetzen, zum Beispiel wenn Du möchtest, dass ein Klick auf das Bild eine neue Seite öffnet. Das wird bei Link-Seiten gern gemacht. Du kannst durch Klick auf den Button [Keine] auch jedwede Verlinkung ausschalten.

Unter “Ausrichtung” legst Du fest, wie das Bild im Text ausgerichtet werden soll. Und unter “Größe” kannst Du einstellen, in welcher Größe das Bild dargestellt wird. Ist alles zu Deiner Zufriedenheit eingestellt und ausgefüllt, dann klickst Du auf [In Artikel einfügen]. Fertig, das Bild befindet sich im Text. Eigentlich einfach nicht wahr?

Ähhh, ja. Aber ich mag das jetzt doch nicht so gern leiden. Löschen und alles von Vorn?

Nein, das geht wesentlich einfacher. Klicke mal im Editor auf das Bild selbst…

*Klick*

Du siehst in der oberen linken Ecke zwei Symbole auf dem Bild erscheinen. Das rechte Symbol ist schnell erklärt. Ein Klick, das System fragt nach ob Du Dir sicher bist und mit dem Löschen des Bildes fortfahren willst, ein zweiter Klick und das Bild ist aus dem Text entfernt. Beachte: In der Mediathek ist das Bild immer noch vorhanden (und manchmal ist das auch ganz gut so).

Ein Klick auf den linken Button öffnet ein neues Fenster um bestimmte Einstellungen an dem Bild vornehmen zu können. Einiges hast Du schon in dem Fenster “Bild einfügen” gesehen. Unter dem Reiter  “Bild bearbeiten” findest Du…

Hä? Wie jetzt? Was ist ein Reiter?

Ist Dir “Tab” geläufiger? Schau Dir den oberen Bereich des Bildes an, Dort siehst Du “Bild bearbeiten” und “Erweiterte Einstellungen”. Die schauen wir uns jetzt an an.

“Größe” probierst Du selbst aus , nur soviel: Das geht echt auf die Qualität des Bildes. Keine ganz so dolle Option. Aber Du kannst nachträglich die Ausrichtung des Bildes anpassen, Bildtitel und Bildbeschreibung ändern, und Dir überlegen, ob Du das Bild über das Feld “URL” mit irgendwas verlinken möchtest, oder eben nicht. In den erweiterten Einstellungen gibt es weitere Möglichkeiten, ich möchte Dein Augenmerk auf drei Felder lenken:

Und zwar auf “Bildeigenschaften”-> “Rand”, “Vertikaler Abstand” und “Horizontaler Abstand”. Bei “Rand” wird die Breite des  Bildrahmens in Pixel angegeben. Es ist natürlich Geschmackssache, ich würde empfehlen jedweden Rand wegzulassen und hier explizit eine “0″ einzutragen. Die beiden Abstandsfelder sind allerdings wichtig! Vereinfacht ausgedrückt wird hier eingestellt, wieviele Pixel der  Abstand vom Text zum Bild betragen soll. Probiere es aus. Ich persönlich bervorzuge 5 Pixel.

Mit einem Klick auf [Aktualisieren] werden Deine Änderungen vom Bild übernommen. ACHTUNG: Du musst trotzdem noch im rechten Menü auf den Button “Aktualisieren” klicken, damit das auch im Artikel gespeichert wird!

Soweit, so gut, die erste Version dieses Textes wird nun online gestellt und ich mache mich demnächst an den dritten Teil (Weitere Einstellungen). Dort werden die Menüs “Publizieren”, “Schlagwörter” und “Kategorien” behandelt