CSS-Klassen für Bilder in WordPress-Artikeln

WordPress bietet mittlerweile schon von Haus aus recht komfortable Möglichkeiten zur Einbindung und Verwaltung von Fotos oder Grafiken. Für die Realisierung von komplexen Galerien würde ich zwar immer auf eine Plugin-Lösung zurückgreifen, aber einzelne Grafiken im Inhalt lassen sich am besten über die WP-eigene „Hochladen/Einfügen“ Funktion für Artikel und Seiten einbinden.

Neben Einstellungen zu Größe, Titel und Beschreibung des Bildes, kann man hier auch entscheiden, ob der Text des Artikels um das eingebundene Bild fließen soll oder nicht. Damit diese Anweisungen auch Früchte tragen, müssen verschiedenen Imageklassen in die CSS-Datei des gewählten Themes integriert werden (falls noch nicht geschehen). Diese kann man natürlich um weitere CSS-Attribute wie Border, Padding, Background etc. erweitern, um alle Grafiken im Inhalt mit einem einheitlichen Style zu versehen.

/* Imageklasse für linksbündige Grafiken */
img.alignleft {
float: left;
margin: 0px 5px 5px 0px;
}
/* Imageklasse für rechtsbündige Grafiken */
img.alignright {
float: right;
margin: 0px 0px 5px 5px;
}
/* Imageklasse für Grafiken ohne Float */
img.alignnone {
float: none;
margin: 0px 0px 5px 0px;
}
/* Imageklasse für zentrierte Grafiken */
img.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}