WordPress & Webwork

WordPress: gesuchte Begriffe hervorheben

Die Suchfunktion von WordPress beherrscht standardmäßig leider keine Hervorhebung der gesuchten Begriffe, was eindeutig ein Mangel an Usability (Benutzerfreundlichkeit) ist.

Wie üblich gibt es auch für dieses WordPress-Problem mehrere Lösungswege, entweder man greift auf Plugins zurück, zum Beispiel Search Hilite, Search Unleashed oder Search Everything.

Wer der Meinung ist, dass er schon genug Plugins im Einsatz hat, der kann auch selber Hand anlegen. Wichtig ist dabei, dass in dem eingesetzten WordPress-Theme die search.php existiert, welche für die Ausgabe der Suchergebnisse zuständig ist. In der search.php sucht man die Stelle wo die Überschrift durch the_title() ausgegeben wird. Das the_title() ersetzt man durch zum Beispiel echo $titel;.

Anschließend setzt man vor der vorhin angepassten Stelle folgenden Code:

<?php
$titel = get_the_title();
$suchwort = get_search_query();
$wert = explode(" ",$suchwort);
$titel = preg_replace('/('.implode('|', $wert) .')/iu','<strong class="suchwort">\0</strong>',$titel);
?>

Nun werden die gesuchten Wörter durch strong ausgezeichnet und mit Hilfe des Attributswertes bzw. des Klassen-Selektors kann man das gesuchte Wort hervorheben, z. B.: strong.suchwort { background: #ff9; }.

Durch diese Maßnahme werden allerdings nur die Suchbegriffe in den Überschriften hervorgehoben. Falls man in den Suchergebnissen die Artikel auszugsweise (the_excerpt();) ausgibt, was an sich eh empfehlenswert ist, da es schnell unübersichtlich werden kann, wenn man viele Treffer hat, dann ersetzt man wie gehabt the_title() durch echo $titel; und the_excerpt(); durch zum Beispiel echo $auszug; und dann gibt man folgenden Code vor den beiden geänderten Stellen:

<?php
$titel = get_the_title();
$auszug = get_the_excerpt();
$suchwort = get_search_query();
$wert = explode(" ",$suchwort);
$titel = preg_replace('/('.implode('|', $wert) .')/iu','<strong class="suchwort">\0</strong>',$titel);
$auszug = preg_replace('/('.implode('|', $wert) .')/iu','<strong class="suchwort">\0</strong>', $auszug);
?>

Nun werden die Suchergebnisse sowohl in den Überschriften als auch in den Artikelauszügen hervorgehoben und schon hat man die Besucher wieder ein bisschen glücklicher gemacht. 🙂

Gefunden bei wprecipes.com.

Alternativen sind wie immer herzlich willkommen.

Nachtrag: habe die Code-Beispiele aufgrund des Kommentars von Markus erweitert.

38 Reaktion(en)

  1. Tom

    Wie einfach doch die Lösungen meistens sind, wenn man kurz nachdenkt. Und manche Plugins packen MB-weise Frameworks rein.
    Dein Tipp reich vollkommen aus, danke.

  2. Pingback: WordPress: dein oder mein Code-Beispiel | Peruns Weblog

  3. Sergej Müller

    Wollte ich mal vor Monaten (als ich meinen Blog aufgeräumt hatte) ebenfalls eine Hervorhebung umsetzen. Dann aber doch nicht gemacht, weil:

    Falls der Suchtreffer nicht im Titel und auch außerhalb des Excerpts liegt, dann hat man ein Ergebnis ohne optische Markierung. Das wird den Nutzer irritieren, wenn andere über Hervorhebungen verfügen und nur ein Treffer nicht.

    Man müsste intelligenter vorgehen und die Stelle um den Suchbegriff herum mit wenigen Sätzen umgeben – so einen Auszug, wie bei Trackbacks üblich.

    1. Perun

      Hallo Sergej,

      Man müsste intelligenter vorgehen und die Stelle um den Suchbegriff herum mit wenigen Sätzen umgeben – so einen Auszug, wie bei Trackbacks üblich.

      an sich wäre das schon besser, aber dann frage ich mich ob es nicht sinnvoller wäre auf einen externen Dienst (z. B. Tante Guugel) zurückzugreifen, da müsste man ja das Rad nicht neu erfinden.

  4. Perun

    @Sergej,

    imho ist das smarter was einen konstruktiv nach vorne bringt. Hat die eigene Lösung etwas, was die anderen nicht bieten, ist das zweifellos smarter. Bin auf deine Lösung gespannt. 🙂

  5. KingOli

    Wenn man sich nur kurz mit den genannten Plugins beschäftigt (Thema Rad nicht neu erfinden), dann sieht man auch sofort die Probleme der selbstgeschriebenen Lösung.

    Zum Einen hat Sergej Recht mit seinem Einwand, dass man schon den Textteil mit extrahieren müsste, der den Suchstring enthält. Desweiteren rotzt WordPress bereits HTML als Ausgabe heraus, d.h. es kann passieren, dass man mit preg_replace auch nicht sichtbare Elemente des Code wie Linkadressen auszeichnet oder diesen Code selber zerstört.

    Das schlimmste ist jedoch der Sicherheitsaspekt. Die Variable $s sollte niemals ungefiltert irgendwo auf der Seite ausgegeben werden, um etwaige JS-Code-Ausführung zu verhindern. Suchen nach zum Beispiel HTML-Snippets sollte aber dennoch möglich sein.

    Leider gibt es keine perfekte Lösung für alle Probleme in PlugIn-Form 🙁

  6. Markus

    Nichts zu danken, hab das ja aúch von Dir in einem neuen Projekt eingebaut. Eine Hand wäscht die andere. Werd aber auch noch versuchen das hinzubekommen, das im Auszug immer die Stelle mit dem Suchwort angezeigt wird, falls das Suchwort im eigentlich Auszug noch nicht auftaucht. Wenn ich es hinbekomm meld ich mich wieder, es sei den jemand anderes hat das vorher schon raus, komm so schnell erstmal nicht dazu, steht ziemlich weit hinten auf der ToDo.

  7. Pingback: Links und Video der Woche (2010/11) :: cimddwc

  8. Pingback: Linkhub – Woche 11-2010 « pehbehbeh

  9. Pingback: uberVU - social comments

  10. NewsShit!

    Ich bin kein großer Programmierer aber ich habe vielleicht für die Sache mit der Anzeige des Suchworts, das nicht mehr innerhalb the_excerpt() liegt, eine Lösung:

    Ich bin mir relativ sicher, dass es eine PHP-Funktion gibt, mit der man bestimmte Bereichen (z.B. Zeichen 20 – 50) in Zeichenketten ausgeben lassen kann.

    Wenn man erst herausfindet, an welcher Stelle (x) im the_content() das $suchwort steht, könnte man den umgebenden Text von x-50 bis x+50 ausgeben lassen.

  11. Sergej Müller

    @NewsShit!
    Das ist schon richtig, doch schau was KingOli zurecht sagte – es kann passieren, dass du HTML-Tags mitten drin abscheidest. Man darf mit festen Werten (in deinem Fall 50) nicht arbeiten. Man muss den Text drumherum erst richtig parsen.

  12. Pingback: Dobschat » Links vom 9. März 2010 bis 30. März 2010

  13. Pingback: Die besten Tipps und Tools für die Recherche im Netz – Part 1

  14. Pingback: WordPress: Begriffe im Suchergebnis jederzeit hervorheben › Suche, Suchwort, Suchergebnisse, Hervorhebung, Markierung › Playground

  15. Pingback: WordPress: Suchergebnisse hervorheben und more-Tag mit Werbung ersetzen | Peruns Weblog

  16. Frank

    Hoi,

    und was, wenn die search.php die beschriebenen codes nicht hat? Gibts in meinem Theme z.B. nicht.

    Und Plugins möchte ich nicht nehmen……

    Immer dieser Stress….. 🙂

    ciao

  17. cimddwc

    Ich hatte das auch bei mir eingebaut und heute ein Problem bemerkt, als ich nach "[poll" gesucht hatte (was bei dir auch reproduzierbar ist) – wenn nämlich der Suchende nach etwas sucht, das eine fehlerhafte Regexp ist, kommen unschöne Fehlermeldungen à la "Warning: preg_replace() [function.preg-replace]: Compilation failed: missing terminating ] for character class…".

    Lösung: man nehme preg_quote($suchwort) statt einfach $suchwort

  18. Alex

    Hallo,

    ich habe eine allgemeine Frage zum Thema WordPress Suche, bei der ich absolut nicht weiterkomme.
    Wenn ich bei mir auf der Seite einen Suchbegriff eingebe, werden mir immer alle Artikel angezeigt, egal welchen Suchbegriff ich eingebe.

    Hat irgend jemand eine Idee, wo ich da die Fehlersuche ansetzen könnte?

    Vielen Dank und grüße
    Alex

  19. Daniel

    Das ist ein super Tip. Vielen Dank, Gerade wenn man auch die Performance der Webseite im Auge hat, sollte man auf so viele PlugIns wie möglich verzichten. Da kommt dieses Snippet gerade recht.

  20. Marco

    explode(" ",$suchwort);
    implode('|', $wert);

    Was soll das den? Wie wäre es einfach mit
    str_replace(' ',’|',$row['zahlungen_zweck'])

    Ich würde dann noch zusätzlich doppelte Leerzeichen vorher entfernen.

  21. Thorsten Schäfer

    Ich grabe den etwas älteren Beitrag einmal aus 😉

    Habe die beschriebene Lösung für meinen Blog umgesetzt. Funktioniert auch eigentlich super. Danke schon mal an dieser Stelle…

    Ich habe jedoch das Problem, dass mir die Links zerschossen werden, sobald sich der gesuchte Begriff in einem meiner Links (entweder im Titel des Links oder der URL) wiederfindet. Es wird dann der komplette Link (komplette URL) im Blog sichtbar. Das sieht etwas unschön aus…

    In Kommentar 13 von KingOli wird glaube ich darauf schon hingewiesen.

    Irgendeine Idee, wie man den "Fehler" beheben kann?

  22. Lotta

    Hallo Perun,

    ich habe diesen Artikel gerade gefunden:

    Gebt mal in Eurer Suche statt 'Hallo' 'Hallo ' mit einem Blank ein. Das Ergebniss ist verblüffend, weil die Umlaute im Ergebniss nicht mehr in UTF-8 ausgegeben sind.
    Hat da vieleicht jemand eine Erklärung??
    LG Lotta

  23. cimddwc

    @Lotta: Danke für den Hinweis – das ist wohl etwas, das man selten bemerkt, weil man selten sowas eingibt. 🙂

    Aber ich würde trim statt chop empfehlen – das Problem besteht nämlich auch, wenn man nach " Hallo" (mit Leerzeichen am Anfang) sucht.

Die Kommentare in diesem Beitrag sind geschlossen.

WordPress-Wartung & Betreuung

Wir kümmern uns um Ihre WordPress-Website:

WordPress-Wartung und Betreuung

 WordPress-Wartung und Betreuung