Design Meets Code

Design Meets Code

WordPress · PrestaShop

  • Startseite
  • WordPress
  • PHP / Datenbanken
  • Ubuntu
  • Prestashop
  • Verschiedenes
  • Grafik
  • Glossar
You are here: Home / WordPress / Masonry Layout für WooCommerce Produkte

Masonry Layout für WooCommerce Produkte

21. April 2020 Leave a Comment

Um auf der Shopseite oder in Kategorie-Archiven von WooCommerce die Artikel im Masonry Layout aufzulisten, hilft folgende Funktion im Childtheme

// Load isotope scripts on the shop pages
add_action( 'wp_footer', function() {
	if ( wpex_is_woo_shop() || wpex_is_woo_tax() ) {
		wpex_enqueue_isotope_scripts();
	}
} );

// Add masonry classname to WooCommerce grid
add_filter( 'wpex_woo_loop_wrap_classes', function( $classes ) {
	if ( is_array( $classes ) ) {
		$classes[] = 'wpex-masonry-grid';
	} else {
		$classes .= ' wpex-masonry-grid';
	}
	return $classes;
} );

// Add masonry class to woo entries
add_filter( 'post_class', function( $classes, $class = '', $post_id = '' ) {
	if ( wpex_is_woo_shop() || wpex_is_woo_tax() ) {
		$classes[] = 'isotope-entry';
	}
	return $classes;
}, 60, 3 );

Quelle: https://wpexplorer-themes.com/total/snippets/apply-masonry-layout-to-woocommerce-shop/

Filed Under: WordPress Tagged With: WooCommerce

Schreibe einen Kommentar Antwort abbrechen

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

Anzeige

Themen

Apache BuddyPress chmod chown Code Snippets Concatenation Operator Conditional Statement Custom Post Types Datenbank Email Enfold Escape Zeichen Foren genesis Grid View htaccess JavaScript Layout Builder List View Medien MegaShop Mitgliederbereich MySQL PHP PHP Anfänger PHP Variablen Plugins Prestashop Prestashop 1.5 Prestashop 1.6 Prestashop 8 Prestashop Module Registrierung RSS Feed s2member Schreibrechte Server ssl Strings Tipps Windows Windows 10 WooCommerce WooCommerce Sortierung WordPress
Anzeige

Letzte Kommentare

  • dmc zu Woocommerce: Produktbewertungen deaktivieren
  • medienplus zu Woocommerce: Produktbewertungen deaktivieren
  • Martin zu CSS: Automatische Silbentrennung in einzelnen Wörtern verhindern
  • Martin zu CSS: Automatische Silbentrennung in einzelnen Wörtern verhindern
  • Klaus zu Woocommerce: Shop Seiten neu generieren

Informationen

  • Kontakt
  • Datenschutzerklärung
  • Impressum
  • Cookie-Richtlinie (EU)
  • Kontakt
  • Datenschutzerklärung
  • Impressum
  • Cookie-Richtlinie (EU)
Anzeige