p-Tag bei Bilden in WordPress ersetzen

Die Zeiten ändern sich.

Dieser Beitrag scheint älter als 12 Jahre zu sein – eine lange Zeit im Internet. Der Inhalt ist vielleicht veraltet.

Die Nutzung von HTML5 halte ich persönlich für sinnvoll und ich mag die neuen Möglichkeiten, auch im Bereich der Semantik.

WordPress hat eine Besonderheit beim Ausliefern von Inhalten, die aus dem Editor kommen – das Setzen von Breaks und Absätzen. Historisch bedingt kümmert sich WordPress darum und nicht der TinyMCE; gleiches gilt bei der Integration von Bildern oder anderen Elementen dieser Art.

Um die Nutzung von HTML5 sauber abzubilden musste in einem Projekt der p-Tag durch den figure-Tag ersetzt werden und so ist folgender kleiner Filter entstanden.

Als kleiner Hintergrund zum figure-Tag lasse ich das folgenden Zitat stehen oder ihr nutzt das Web mit seinen vielfältigen Antwortformen.

HTML5 <figure> Tag
Viele Medien können nicht von Suchmaschinen oder behinderten Menschen erfasst werden. Um diese Medien textlich zugänglich zu machen, kann man sie per <figure> Tag an eine Beschreibung binden.
Robert Agthe

Ich bin nicht sonderlich begabt bei Regex-Ausdrücken und würde mich freuen, wenn es Verbesserungen und Ideen zur Lösung gibt, da diese Art des öfteren genutzt wird und die Nutzung von HTML5 geht voran. Inwieweit WordPress darauf reagiert, ist aktuell nicht abzusehen und an dieser Stelle konnte ich auch keinen Filter erkennen, so dass man ohne einen Regex an diese Stelle kommt und die Vorgabe von WordPress ändert. In diesem Zusammenhang gibt es einige Themen, die einer Überarbeitung von WordPress bedarf um den Editor sauber mittels HTML5 zu nutzen; im Basis Theme habe ich in der HTML5 Version schon einige Sachen integriert.


// unautop for images
function fb_unautop_4_img( $content ) {
    
    $content = preg_replace( 
        '/<p>\\s*?(<a rel=\"attachment.*?><img.*?><\\/a>|<img.*?>)?\\s*<\\/p>/s',
        '<figure>$1</figure>',
        $content
    );
    
    return $content;
}
add_filter( 'the_content', 'fb_unautop_4_img', 99 );

Von Frank Bültge

bueltge.de [by:ltge.de] wird von Frank Bültge geführt, administriert und gestaltet. Alle Inhalte sind persönlich von mir ausgewählt und erstellt, nach bestem Gewissen und Können, was die Möglichkeit von Fehlern nicht ausschließt.