Falls Sie <img>-Tags in Ihren Inhalt einfügen möchten, aber nicht möchten, dass sie von WordPress automatisch mit Absätzen versehen werden.
Beispiel für das Problem
blah blah blah
<img src="monkey.jpg">
blah blah blah
wird zu
<p>blah blah blah</p>
<p><img src="monkey.jpg"></p>
<p>blah blah blah</p>
Wir können es mit diesem Code beheben
function filter_ptags_on_images($content){
return preg_replace('/<p>\s*(<a .*>)?\s*(<img .* \/>)\s*(<\/a>)?\s*<\/p>/iU', '\1\2\3', $content);
}
add_filter('the_content', 'filter_ptags_on_images');
Seien Sie sehr vorsichtig, wenn Sie den obigen Code kopieren und einfügen. Ich musste ein Nullbreiten-Leerzeichen nach dem öffnenden ‚ in der preg_replace-Funktion einfügen, um ein Rendering-Problem zu lösen. Beim Kopieren und Einfügen müssen Sie das Nullbreiten-Leerzeichen auf jeden Fall entfernen.
Für Ihre `functions.php`-Datei oder siehe Referenz-URL für ein Plugin. Mit dieser Einstellung erhalten wir
<p>blah blah blah</p>
<img src="monkey.jpg">
<p>blah blah blah</p>
… was bedeutet, dass das Floaten von Bildern viel einfacher wird.
Ich habe gerade damit angefangen und ja, das ist ein ewiges Problem. Nicht so sehr bei Websites, die ich verwalte, sondern bei Kunden. Wagenrückläufe (oder deren Fehlen) und ein Kunde, der gerne mit dem WYSIWYG-Editor spielt, und Sie haben ein Rezept für eine Katastrophe.
Früher habe ich in Situationen, in denen der Benutzer möglicherweise JavaScript deaktiviert hat, die folgende JavaScript-Zeile verwendet. Die Alternative bricht nichts… Nicht wirklich dasselbe und sicherlich nicht so zuverlässig, kann Ihnen aber zusätzliche Flexibilität bieten.
$("p:has(img)").css('yadda... yadda..');Ich würde dies erweitern auf
jQuery("p:has(img) img").unwrap()Danke! Meine Güte, danke.
Wie würde ich das Gleiche in Joomla erreichen?
Entschuldigung, ich habe vergessen hinzuzufügen: Ich habe den PHP-Code in meine index.php-Vorlagendatei eingefügt, wenn ich ihn ausführe, erhalte ich folgende Fehlermeldung
Fatal error: Call to undefined function add_filter() in
Eher eine späte Antwort, aber es muss in die functions.php-Datei innerhalb von PHP-Tags.
Vielen Dank für diesen Code, ich versuche das zu tun, aber ich verstehe es nicht.
Hallo – der ursprüngliche Beitrag (WordPress P Tag removal on Fublo blog) wurde mit Code zum Entfernen von P-Tags für iframes aktualisiert.
Außerdem gibt es Links zu anderen WP-Artikeln mit verwandten Diskussionen und regulären Ausdrücken für HTML5-Tweaks.
Hallo James, danke für das Teilen des Links. Ich habe genau das gesucht (wie man die p-Tags auch um iframes entfernt). Der Fublo-Blog existiert nicht mehr, kann jemand vorschlagen, wie das gemacht wird?
Ich hätte zuerst nach der Antwort suchen sollen… habe sie direkt nach dem Posten gefunden :)
http://blog.iamcreative.me/code-snippets/remove-phantom-paragraph-tags-iframes-images-wordpress/#.Uw-Bkl6cfxg
Danke. Das ist sehr hilfreich. Besonders wenn der Kunde gerne auch mit dem HTML spielt…
Sie können immer ändern, um Probleme zu vermeiden, wenn Sie mit etwas Padding oder ähnlichem in Ihrem CSS haben.
Und weil ich meinen Code in meinem Kommentar nicht richtig formatiert habe, hier ist die vollständige Version
Leif
Danke!
Jede Seite hat die gleiche Version wie Chris und ich hatte gemischte Ergebnisse. Habe gerade Ihren aktualisierten Code eingesteckt und wir sind wieder im Geschäft.
Hallo Leif, ich frage mich, ob Sie mir helfen könnten zu verstehen, was der Unterschied zwischen Ihrem preg_replace und dem ursprünglichen Code-Schnipsel oben ist. Ihrer funktioniert für mich und das Original nicht, und ich versuche zu verstehen, warum :)
Vielen Dank im Voraus
Das funktioniert super. Danke!
Wie würde ich jedes Bild im Beitrag mit einem div umschließen, indem ich diese Funktion verwende?
Ich ♥ dich. Danke für die Wohltat :)
Leider habe ich festgestellt, dass dies zu sehr gemischten Ergebnissen führt. Sobald ein Kunde anfängt zu fummeln und Beiträge im WYSWYG-Editor zu maximieren, kann dieser Hack kaputt gehen.
Ich habe es auf einer Multi-User-Site getestet, die ich erstellt habe, und festgestellt, dass es bei einem Bruchteil der Beiträge funktionierte.
Danke für diesen Tipp – das Absatz-Tag um Bilder hat mich wahnsinnig gemacht!
Großartig! Sollte Standard sein, aber zumindest gibt es CSS-Tricks, um den Tag zu retten!
Immer wenn ich ein Problem habe, weiß ich, dass ich die Antwort auf CSS Tricks finden kann. Ehrlich gesagt, ich bin ein großer Fan. Kann ich Ihr Autogramm haben? Hat wie ein Zauber funktioniert.
Sehr geschätzt, funktioniert perfekt, ein
<
<p> um meine Tags herum hat meine codierende OCD gestört!
Ich weiß, dass dieser Beitrag etwas alt ist. Laut Samuel Wood (Otto) (WordPress-Prominenter) ist dies jedoch ungültiges HTML. Lesen Sie den Beitrag hier (5 Jahre alt! Aber immer noch gültig): http://wordpress.org/support/topic/wp-adds-paragraph-tags-to-images?replies=6
Das ist absolut falsch.
Es ist nicht ungültig, kein Bild in einem Blockelement zu haben. Ich glaube, das war es nie.
Es wäre hilfreich, wenn Sie tatsächlich erklären würden, wo dieser Code platziert werden soll.
die functions.php-Datei Ihres Themes
Es wäre hilfreich, wenn Sie den Artikel tatsächlich lesen würden. Es ist buchstäblich die erste Zeile unter dem Codeblock
„Für Ihre functions.php-Datei oder siehe Referenz-URL für ein Plugin.“
Diese Website ist die beste Ressource für CSS und mehr, sie liefert immer Antworten auf typische Probleme ohne die üblichen einleitenden Texte. Direkt auf den Punkt mit prägnanten Lösungen, die funktionieren. Schönes Design dazu! Danke, Danke, Danke!
Danke für dieses Tutorial.
Sie haben mir heute Zeit gespart LOL
Vielen Dank!
Dies entfernt nicht das
<p>, wenn ich die Bildausrichtung auf „Mitte“ einstelle, da es sich nicht mehr um ein leeres<p>-Tag handelt; es wird zu<p style="text-align: center;">.Nun, ich muss Ihnen danken. Ich habe 11 Stunden an diesem Problem gearbeitet und bin gerade auf Ihre Seite gestoßen. Ich habe ein Kinderthema erstellt und die functions.php mit Ihrem Code modifiziert und es funktioniert
Lebensretter, danke!
Warum sollte das für alle außer mir funktionieren?
Habe den ursprünglichen und auch den anderen angepassten Code (in den Antworten) in meiner functions.php ausprobiert, bekomme dieses verdammte P-Tag einfach nicht weg
Funktioniert bei mir auch nicht. Ich verwende die neueste Version von WordPress und weiß nicht, ob das einen Unterschied macht
Funktioniert nicht…
Code wurde in functions.php eingefügt. Kein Erfolg….
KORREKTUR! Es hat funktioniert
Ich habe den folgenden Code in „Erscheinungsbild > Editor > Functions.php“ eingefügt
Ich habe das Folgende zur Datei hinzugefügt unter
<?php
einfügen unten……..
function filter_ptags_on_images($content){
return preg_replace('/\s?(|)?\s/s’, ‘\1’, $content);
}
add_filter(‘the_content’, ‘filter_ptags_on_images’);
Und wie entferne ich Absatz-Tags nur um img.alignone?
Vielen Dank dafür. Ich habe über eine Stunde lang damit gekämpft, dann dachte ich mir… anstatt damit zu kämpfen, entferne ich einfach das img aus dem Tag. Das ist brillant!
Es wäre gut zu klären, ob dies in WP3.9.2 noch funktioniert. Bisher habe ich keinen Erfolg gehabt…
Prost!
Mein Problem ist, dass WP jedes Mal, wenn ich Enter drücke, „ “ hinzufügt.
Das ist kein HTML5-valides, weil der p-Tag nie geöffnet wurde.
Irgendwelche Ideen zur Behebung?
Wie entferne ich p-Tags in WooCommerce?
Das hat anfangs nicht für mich funktioniert… nachdem ich ein paar Stunden mit regulären Ausdrücken gekämpft habe, stellte ich fest, dass das Problem darin bestand, dass WordPress kein schließendes </p>-Tag einfügte (in meinem Fall folgt direkt auf das Bild ein Shortcode, was meiner Meinung nach die Sache durcheinander brachte). Der Browser korrigiert automatisch – daher wird </p> in der Konsole usw. angezeigt, aber wenn ich die Quelltextansicht aufrufe, ist es nicht da.
Ich habe den Filter daher wie folgt modifiziert, was zu funktionieren scheint
Grundsätzlich das schließende </p>-Tag in Klammern setzen, gefolgt von ? – macht es optional.
Ich bin kein Regex-Experte, daher sind Verbesserungen willkommen!
Vielen Dank, die Lösung hat sofort funktioniert!
Hallo,
Süßer Code! Ich habe auch nach der gleichen Methode gesucht, um das
<tag> um iframes anzupassen… Ich habe das hier gefunden
Das funktioniert gut, um das
<tag> zu entfernen, aber in meinem Fall wäre es besser, etwas wie
Aber offensichtlich funktioniert das nicht… :/ Könnte mir jemand helfen?
Ich schätze, die meisten von uns könnten diesen Trick für Bilder, aber auch für iframes verwenden, oder?
Danke
Sie können auch die P-Tag-Umschließung für alle Elemente in Ihrem HTML deaktivieren, indem Sie diesen Code zu Ihrer functions.php-Datei in Ihrem Theme hinzufügen.
Hier ist der WP-Artikel, der erklärt, wie es geht.
http://codex.wordpress.org/Function_Reference/wpautop
Tatsächlich erreicht diese Zeile:
remove_filter( 'the_content', 'wpautop' );in Ihrer functions.php genau dasselbe Ergebnis wie die Verwendung vonVielen Dank.
Danke exoboy, das funktioniert für mich… nochmals danke
Hallo,
Vielen Dank für das Teilen.
Ich habe diese Seite gerade gefunden, während ich nach „wordpress fügt Absatz um Bilder hinzu“ gesucht habe.
Jetzt möchte ich die Funktion entfernen, die die automatische Absatzformatierung deaktiviert hat, und stattdessen den visuellen Editor von WordPress verwenden, anstatt jedes HTML selbst zu schreiben.
Danke schön :)
Wow! Ich bin 2016 auf das Problem gestoßen (5 Jahre nach Ihrem Beitrag). Es hat tatsächlich funktioniert, aber es schlug fehl, wenn das
<IMG>eine Ausrichtungsklasse hatte, die zusammen mit einfachem Text in<P>eingeschlossen war. Wie unten<p><img class="alignright" src="" />Absatztext hier</p>Ich konnte jedoch den folgenden Ausdruck dafür machen
Leider funktioniert dies immer noch nicht, wenn der Absatztext vor dem Bild-Tag kommt. z. B. wenn ein Bild direkt zwischen einem Absatztext platziert wird, wie unten.
<p>Text vor dem Bild<img class="alignright" src="" />Text nach dem Bild</p>Ich habe die letzte (Gruppe) von „irgendetwas“ im Regexp (.*?) versucht, indem ich sie vor die erste Gruppe gesetzt habe, sodass insgesamt 3 Gruppen entstehen. Aber es hat nicht wie erwartet funktioniert.
Könnten Sie mir diesbezüglich helfen?
Diese Fehlermeldung erhalten
Warning: preg_replace() [function.preg-replace]: Delimiter must not be alphanumeric or backslash in
Hallo,
Es gibt bereits Methoden, die Sie verwenden können. Wenn Sie hinzufügen
remove_filter( ‘the_content’, ‘wpautop’ );
remove_filter( ‘the_excerpt’, ‘wpautop’ );
In Ihrer functions.php wird dies die Arbeit erledigen.
Siehe
https://stackoverflow.com/questions/11248628/disable-wordpress-from-adding-p-tags
Wie wäre der Ausdruck, um das
<p>-Tag anstelle des Entfernens in ein<figure>-Tag zu ändern?