Kategorien
Code-Snippets WooCommerce

Standardsortierung auf der WooCommerce Produktkatalogseite entfernen

Wenn du das Dropdown-Menü, mit dem Produkte nach Beliebtheit, durchschnittlicher Bewertung, Neuheit und Preis sortiert werden können, auf der WooCommerce-Produktkatalogseite entfernen oder ausblenden möchtest, gibt es zwei Möglichkeiten, mit denen dir das gelingt.

WooCommerce Standardsortierung Produktarchivseite
Selectbox „Standardsortierung“ auf der WooCommerce Produktarchivseite

1

PHP-Code-Snippet in die functions.php einfügen

Kopiere das nachfolgende PHP-Code-Snippet und füge es in die Datei functions.php deines WordPress-Themes ein.

/** 
 * @author   Münnecke & Vollmers GbR / widilo(r)
 * Entfernt die Produktsortierung (Selectbox) von der   
 * Woocommerce Produktkatalog- bzw. archivseite
 */
remove_action ( 'woocommerce_before_shop_loop',
'woocommerce_catalog_ordering' , 30 );

Code-Snippets dauerhaft implementieren

Wenn du kein selbsterstelltes, sondern ein WordPress Theme von einem externen Anbieter verwendest, bedenke bitte Folgendes:

Wenn dein WordPress Theme aktualisiert wird, gehen die von dir direkt in der funcions.php vorgenommenen Änderungen wieder verloren. Warum? Wei bei einer Theme-Aktualisierung die functions.php überschrieben wird.

Damit das Snippet auch nach einer Theme-Aktualisierung funktioniert und erhalten bleibt, solltest du ein zusätzliches Plugin installieren und nutzen. Gib unter https://de.wordpress.org/plugins/ einfach den Suchbegriff „Code-Snippets“ ein und suche dir ein entsprechendes Plugin aus.

2

CSS-Klasse in die „style.css“ deines Themes einbinden

Mit Hilfe von CSS (Cascading StyleSheets) kannst du die Produktsortierung ganz einfach dauerhaft ausblenden. Kopiere dazu die nachfolgende CSS-Klasse in die Zwischenablage und füge sie in die style.css deines Themes ein.

/** 
 * @author   Münnecke & Vollmers GbR / widilo(r)
 * Blendet die Produktsortierung (Selectbox) auf der   
 * Woocommerce Produktkatalog- bzw. archivseite aus
 */
.woocommerce-odering select.orderby {
  display: none;
}

Im WordPress Customizer kannst du CSS Stile hinzufügen

Um diese Änderung vorzunehmen, musst du nicht die Orginaldatei in deinem Theme verändern Du kannst dafür den eingebauten WordPress-Customizer, den du über das Backend deinerWordPress-Installation erreichen kannst, nutzen.

Gehe wie folgt vor:

  1. Melde dich in deinem WordPress-Backend an.
  2. Klicke in der linken Menüleiste deines Dashboards auf „Design“, siehe Abb. 1
  3. Wähle anschließend im aufklappenden Menü den Punkt „Customizer“ aus, siehe Abb. 1
  4. Du befindest dich jetzt im „Customizer“. Klicke in der linken Menüleiste auf „Zusätzliches CSS“, siehe Abb. 2
  5. Kopiere die CSS-Klasse nun in den Code-Editor, siehe Abb. 3 Speichere deine Änderung indem du ober im Menü auf „Veröffentlichen“ klickst. Voila, du hast es geschafft!
Abb. 1
Abb. 2
Abb. 3

Deine vorgenommene Änderung durch das Hinzufügen der CSS-Klasse im WordPress-Customizer bleibt auch nach einer Aktualisierung deines Themes erhalten!