Nur WooCommerce-Produkte in der WordPress-Standard-Suche anzeigen

In einem Projekt hatte die Design-Agentur ein Theme ohne Suche-Template erstellt (manuelle Suchen waren aber trotzdem möglich). Nun wollten die Shop-Verantwortlichen eine Suche in der Kopfzeile der Seite haben, die aber nur nach Produkten suchen sollte.

Einige Themes haben dies bereits in der Header-Suche implementiert, wie das „Standard-Theme“ Storefront. Andere verwenden die normale WordPress-Suche, die immer nach allen Beitragstypen suchen würde. Schauen wir uns an, wie wir das ändern können.

Nur Produkte finden

In WordPress kann man ?s=something an eine beliebige URL anhängen, was die WordPress-Site nach allen öffentlichen Beitragstypen durchsuchen würde, die in den Einstellungen während der Registrierung des Post-Types nicht exclude_from_search auf true gesetzt haben. Wenn wir aber nur nach Produkten suchen wollen, können wir dies auf verschiedene Weise erreichen.

Verwenden eines verstecktes Feld, um den Beitragstyp festzulegen

Wenn wir uns den Quellcode des Headers im Storefront Theme ansehen, finden wir den folgenden HTML-Code:

<form role="search" method="get" class="woocommerce-product-search" action="https://woocommerce.ddev.site/">
	<label class="screen-reader-text" for="woocommerce-product-search-field-0">Search for:</label>
	<input type="search" id="woocommerce-product-search-field-0" class="search-field" placeholder="Search products&hellip;" value="" name="s" />
	<button type="submit" value="Search" class="">Search</button>
	<input type="hidden" name="post_type" value="product" />
</form>

Wie der placeholder Text andeutet, ist das Suchfeld nur für Produkte gedacht. Dies wird erreicht, indem ein verstecktes Feld hinzugefügt wird, das den post_type für diese Suche auf product setzt. Nach dem Absenden würde die Suche eine URL wie https://example.com/?s=something&post_type=product öffnen. Diese würde dann nur Produkte anzeigen und das Template archive-product.php verwenden, sofern es im Thema vorhanden. Hiermit würden die Suchergebnisse auf die gleiche Weise aufgelistet werden, wie im Shop (in den meisten Themes).

Umleiten der normalen Suche auf den Shop

Auch mit dieser Erweiterung wäre es immer noch möglich, nach jedem anderen Beitragstyp zu suchen, indem man den Suchparameter an eine URL anhängt, die nicht zum Shop gehört (wie oben gezeigt). Wenn wir die normale Suche wirklich einschränken wollen, damit nur Produkte anzeigt werden, können wir jede normale Suche auf die Shop-Suche umleiten. Das können wir mit einem Snippet wie diesem hier umsetzen:

function product_search_only_redirect_search_to_products() {
	if ( is_admin() ) {
		return;
	}

	if ( ! is_search() ) {
		return;
	}

	// We are already at the right search result page.
	if ( is_shop() || is_tax( get_object_taxonomies( 'product' ) ) ) {
		return;
	}

	$search_query = get_search_query();
	$shop_url     = wc_get_page_permalink( 'shop' );
	$redirect_url = add_query_arg( 's', rawurlencode( $search_query ), $shop_url );
	wp_safe_redirect( $redirect_url );
	exit();
}
add_action( 'template_redirect', 'product_search_only_redirect_search_to_products' );

In dieser Callback-Funktion zur template_redirect Aktion wird jede Frontend-Suche umgeleitet, die nicht bereits auf dem Shop oder einer Taxonomie-Archivseite durchgeführt wird. Dies verhindert jede normale Suche. Wenn wir nun auf der Seite suchen, werden wir auf eine URL wie https://example.com/shop/?s=something umgeleitet und sehen nur Produkte.

Bonus-Tipps

Ich habe mich für die zweite Option entschieden, da das Shop-Theme kein Such-Template hatte (eigentlich hatte es eines, aber es wurde nur eine leere Seite mit Kopf- und Fußzeile ausgegeben). Nach dieser Implementierung fanden wir aber zwei kleine Probleme – nicht mit dieser Lösung, sondern allgemein mit der Funktionsweise der Suche.

Leere Suchbegriffe aus dem Header des Templates entfernen

Ich habe auch ein Suchfeld zu den „Filter-Dropdowns“ hinzugefügt. Dies hatte den Effekt, dass jedes Mal, wenn einer der Filter verwendet wurde, die Ergebnisseite einen leeren Suchbegriff verwendet hat. Dies würde zu einer URL wie https://example.com/shop/?s= führen, deren Titel auf der Seite etwas wie Suchergebnisse: „“ verwendet anstelle von einem Titel wie Shop. Um das zu beheben, habe ich den folgenden Codeschnipsel hinzugefügt:

function product_search_only_clear_empty_search_from_request( $wp ) {
	if ( isset( $_GET['s'] ) && empty( trim( $_GET['s'] ) ) ) {
		unset( $wp->query_vars['s'] );
	}
}
add_action( 'parse_request', 'product_search_only_clear_empty_search_from_request' );

Weiterleitung der Suche auf ein einzelnes Produkt verhindern

Das zweite Problem wurde von dem Shop-Verantwortlichen bemerkt. Jedes Mal, wenn es nur ein Produkt als Ergebnis einer Shop-Suche gab, wurde dieses Ergebnis nicht mit dem „Produkt-Archiv“ Template angezeigt, sondern es auf dieses eine Produkt umgeleitet. Und da wir alle Suchanfragen auf die Shop-Suche umleiten, würde dies bei jeder Suche, die nur ein Produkt findet, der Fall sein, was verwirrend sein könnte. Glücklicherweise habe ich durch einen Blick in den Quellcode von WooCommerce die Stelle gefunden, an der das geschieht, und einen Filter gefunden, mit dem sich diese Umleitung deaktivieren lässt. Ich musste dazu nur eine weitere Code-Zeile hinzuzufügen:

add_filter( 'woocommerce_redirect_single_search_result', '__return_false' );

Das war es auch schon! Jetzt zeigt die Suche immer eine Liste von Produkten oder nur ein einziges an, leitet aber nicht automatisch zu diesem einen Produkt weiter.

Fazit

Ich bin nicht wirklich ein WooCommerce-Experte, ganz im Gegenteil. Aber da WooCommerce Core die gleichen Techniken verwendet wie WordPress selbst, kann ich in der Regel Wege finden, es so anzupassen, wie ich es brauche.

Wenn ihr das auch in eurer WooCommerce-Installation haben möchtet, dann findet ihr den Code als Plugin in einem GIST, wo ihr auch als ZIP herunterladen und auf eurer Website installieren können.

Wenn ihr weitere Tipps zur Suche in WooCommerce habt, hinterlasst bitte einen Kommentar.

Veröffentlicht von

Bernhard ist fest angestellter Webentwickler, entwickelt in seiner Freizeit Plugins, schreibt in seinem Blog über WordPress und andere Themen, treibt sich gerne bei den WP Meetups in Berlin und Potsdam herum und läuft nach Feierabend den ein oder anderen Halbmarathon.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert