WooCommerce: Eigene Variationen-Bulk Actions zum "Bulk Actions"-Dropdown hinzufügen

9. November 2023 von Michael Nissen · ,

WooCommerce bringt von Haus aus die Funktion mit, Eigenschaften von Variationen in der Massenbearbeitung zu setzen. Dafür gibt es in den Produktdaten unter "Varianten" das Dropdown "Bulk Actions".

Kunden von mir benötigten ein weiteres Feld "Einkaufspreis" für die jährliche Inventur. Sie wollten dieses Feld mit den Bulk Actions setzen können.

Das Feld selbst habe ich als Meta-Feld implementiert. Darum soll es aber in diesem Artikel nicht hauptsächlich gehen.

Die Frage lautete: Wie können eigene Bulk Actions zum Variationen-Interface hinzugefügt werden?

Leider ist die WooCommerce-Dokumentation bei "Spezialfragen" wie dieser häufig nicht besonders aufschlussreich. Auch Stackoverflow hielt keine passende Antwort bereit.

Zum Glück haben andere Plugin-Entwickler das Problem schon "gelöst". Hier die Schritt-für-Schritt-Anleitung, damit du weniger Zeit investieren musst.

Schritt 1: Dropdown-Feld anzeigen

Zunächst müssen wir das entsprechende <option>-Feld in das Dropdown hinzufügen. Am Ende soll das Ganze so aussehen:

Dafür ist der Hook "woocommerce_variable_product_bulk_edit_actions" zuständig. Das Ganze ist relativ selbsterklärend. Den Code fügst du über ein Plugin wie z.B. Custom Scripts, als eigenes Mini-Plugin oder in der functions.php ein.

add_action( 'woocommerce_variable_product_bulk_edit_actions', 'mn_procurement_price_bulk_edit_variation', 10 );

function mn_procurement_price_bulk_edit_variation() {
?>
<optgroup label="Einkaufspreis">
	<option value="set_procurement_price">Einkaufspreis setzen</option>
</optgroup>
?>
}

Damit wird jetzt das Feld entsprechend angezeigt. Wenn du jetzt auf das Feld klickst, erzeugt WooCommerce auch automatisch einen AJAX-Request an das "Backend". Leider enthält der AJAX-Request aber noch keinen Wert.

Schritt 2: AJAX-Request-Event-Daten bearbeiten/hinzufügen

WooCommerce erzeugt für jeden Dropdown-Klick automatisch ein JavaScript-Event namens "DROPDOWN_BEZEICHNUNG_ajax_data". "DROPDOWN_BEZEICHNUNG" ist dabei die "value" des <option>-Elements. In meinem Fall also "set-procurement_price". Zusammen ergibt dass dann das AJAX-Event "set_procurement_price_ajax_data" - und zu diesem Event müssen wir noch unsere Daten hinzufügen (z.B. den neuen Einkaufspreis), der dann automatisch gesetzt werden soll.

jQuery( function(){
		jQuery( 'select.variation_actions' ).on( 'set_procurement_price_ajax_data', function(e, data) {
			var value = window.prompt( "Einkaufspreis eingeben" );

            if ( value !== null ) {
                data.value = value;
                return data;
            } else {
                return;
            }
		});
	});

Den JavaScript-Code solltest du nur im Admin-Backend laden. Die WordPress-Referenz zeigt dir, wie du den Code "sauber" eingeklingt bekommst. Oder du machst es "quick and dirty" und kopierst den Code zum Testen einfach erst mal unter das <option>-Feld ;-). Das sieht dann so aus:

function rg_procurement_price_bulk_edit_variation() {
?>
<optgroup label="Einkaufspreis">
	<option value="set_procurement_price">Einkaufspreis setzen</option>
</optgroup>
<script>
	jQuery( function(){
		jQuery( 'select.variation_actions' ).on( 'set_procurement_price_ajax_data', function(e, data) {
			var value = window.prompt( "Einkaufspreis eingeben" );

            if ( value !== null ) {
                data.value = value;
                return data;
            } else {
                return;
            }
		});
	});
</script>
<?php
}

PS: Wenn du ein eigenes Plugin entwickelst, denk daran, die entsprechenden Strings passend auf englisch zu benennen und mit den entsprechenden WordPress-Funktionen zu übersetzen. Der Einfachheit halber habe ich das hier weggelassen.

Schritt 3: Daten im Backend verarbeiten

Jetzt müssen wir nur noch die übermittelten Daten verarbeiten. Dafür ist der Hook "woocommerce_bulk_edit_variations" zuständig. In meinem Fall setze ich einfach den übergebenen Wert bei allen Variationen des Produkts im jeweiligen Meta-Feld.

add_action( 'woocommerce_bulk_edit_variations', 'mn_procurement_price_bulk_save', 10, 4 );

function mn_procurement_price_bulk_save( $bulk_action, $data, $product_id, $variations ) {
	if( in_array( $bulk_action, [ 'set_procurement_price' ] ) ) {
		if( isset( $data['value'] ) ) {
			foreach( $variations as $variation_id ) {
				// Update post meta will not update if variation_id exists, thus no check is necessary
				// Else use if ( $variation = wc_get_product( $variation_id ) )
				update_post_meta( $variation_id, 'purchase', esc_attr( $data['value'] ) );
			}

		}
	}
}

Kommentare

Schreibe einen Kommentar

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

Sie haben Fragen oder möchten ein Angebot anfordern?

Jetzt Kontakt aufnehmen
crosslist