Im WordPress Backend gibt es seit Version 2.6 die Möglichkeit, Fotos mit Bildunterzeilen (Captions) zu versehen. Die entsprechenden CSS-Einträge bieten vielfältige und schöne Gestaltungsmöglichkeiten.

Nutzer des kostenlosen Microsoft Tools “LiveWriter”  (neue Beta – nur in englisch verfügbar) sind zur Lösung dieser Aufgabe immer noch auf Kompromisse angewiesen. Oder man passt die Bildunterzeile nachträglich im WordPress Backend an.

Erst, wenn man dort im Feld “Bildbeschreibung bearbeiten” einen Wert eingetippt hat, erscheint der Inhalt dieses Feldes später im Blog.

Früher, als WordPress noch nicht über diese Möglichkeit verfügte, habe ich das Plugin “Image Caption” eingesetzt. Seit ich den LiveWriter vorziehe, habe ich das Plugin eingemottet. Es sorgt “nur” dafür, dass das Attribut “title”  als Bildbeschreibung genommen und im Blog entsprechend angezeigt wird.

Damit der LiveWriter die gewünschte Platzierung (rechts, links oder zentriert) übernimmt, ist ein kleiner Eingriff nötig. Leider habe ich nämlich im Code des Plugins keine Möglichkeit gefunden, die dies überflüssig macht.

Im Quellcode (Source) des Beitrages (3. Register)   ergänzt man die CSS – Klasse “wlDisabledImage” mit der gewünschten Ausrichtung des Fotos, also “alignright”, “alignleft” oder “alligncenter” (ohne die Anführungszeichen!). In der CSS-Datei müssen diese Klassen natürlich eingetragen sein.

.alignleft  { float: left; width: auto; margin: 5px 20px 5px 5px; font-size: 90%; font-family: verdana;arial }

.alignright  { float: right; width: auto; margin: 5px 5px 5px 20px;font-size: 90%; font-family: verdana;arial }

.aligncenter  { text-align: center; margin-bottom:15px;font-size: 90%; font-family: verdana;arial}

Damit über die dem Plugin “Image Caption” beiliegende CSS-Datei keine Konflikte passieren können, habe ich die infrage kommenden Container auskommentiert. Das sieht also dann so aus:

/* img.center, div.center {

    display: block;

    margin-left: auto !important;

    margin-right: auto !important; }

img.alignright, div.alignright {

    float: right;

    margin: 0 0 2px 18px; }

img.alignleft, div.alignleft {

    float: left;

    margin: 0 18px 2px 0; } */

div.img div {

    font-size: 0.9em;

    line-height: 1.6em;

    text-align: center;

    background-color: #fffde5;

    border-top: 1px solid #f2f0d9;

    border-bottom: 1px solid #e6e4cf;

    padding: 6px;

    margin-top: 5px; }

Mir ist bewusst, dass die Beschreibung ziemlich laienhaft ist aber vielleicht arbeitet ja der eine oder andere auch gerne mit Bildunterschriften. Diese Kompromisslösung zeigt jedenfalls eine Lösungsmöglichkeit auf.

Falls jemand eine bessere Idee hat, wäre ich daran sehr interessiert.  Wer übrigens gar keine Lust auf diesen Caption Kappes hat und seine Artikel nur im Backend von WordPress verfasst, kann die Darstellung unerwünschter Rahmen und Unterschriften auch ganz verhindern.