Seit WooCommerce Germanized 4.0 suchen viele Shopbetreiber nach dem richtigen Shortcode für den Widerrufbutton. Wichtig ist die Unterscheidung: [revocation_form] zeigt das klassische Widerrufsformular, während [eu_owb_order_withdrawal_request_form] das neue Formular für „Vertrag widerrufen“ ausgibt. Der oft getestete Shortcode [woocommerce_gzd_revocation_form] funktioniert hierfür nicht. Wer nur den Button außerhalb des Block Editors einfügen möchte, kann einen eigenen Shortcode per PHP-Snippet erstellen.
WooCommerce Germanized Widerrufbutton seit v4.0+: Shortcodes, Anleitung + Lösung
Mit WooCommerce Germanized ab Version 4.0+ hat sich beim Thema Widerruf einiges geändert. Viele Shopbetreiber suchen nach dem bekannten Widerrufsformular oder möchten den neuen Button „Vertrag widerrufen“ außerhalb des Block Editors einbinden. Dabei kommt es häufig zu Verwirrung, weil nicht jeder Germanized-Button automatisch auch als eigener Shortcode existiert.
Germanized Widerrufbutton funktioniert nicht? Anleitung für Shortcodes, Block Editor und WooCommerce ab Version 4.0+
In dieser Anleitung zeige ich dir, welche Shortcodes tatsächlich funktionieren, wie du das neue Widerrufsformular korrekt einbindest und wie du dir bei Bedarf einen eigenen Shortcode für den „Vertrag widerrufen“-Button erstellst.
Das Problem: Der alte oder falsche Shortcode gibt kein Formular aus
Häufig wird folgender Shortcode ausprobiert:
[woocommerce_gzd_revocation_form]Dieser Shortcode ist jedoch nicht der richtige Shortcode für das Germanized-Widerrufsformular. Wenn du ihn in eine Seite einfügst und nichts erscheint, liegt das nicht zwingend an deinem Theme oder an einem Plugin-Konflikt, sondern schlicht daran, dass dieser Shortcode so nicht als Formular-Shortcode registriert ist.
Der richtige Shortcode für das klassische Germanized-Widerrufsformular
Für das klassische Widerrufsformular von Germanized lautet der richtige Shortcode:
[revocation_form]Diesen Shortcode kannst du auf einer normalen WordPress-Seite einfügen. Er gibt das klassische Widerrufsformular inklusive Absende-Button aus.
Beispiel
[revocation_form]Der Absende-Button innerhalb dieses Formulars hat in Germanized unter anderem folgende ID:
#submit_revocationDadurch kannst du ihn gezielt per CSS gestalten.
Sichtbar/er werden bei Google & Social Media?
In einem kostenlosen Strategiegespräch für datenbasiertes Online-Marketing, decken wir Ihre ungenutzten Potenziale auf, überprüfen ggf. vorhandene Anzeigenkonten, schauen uns das SEO-Ranking und die Sichtbarkeit an und prüfen was zu Ihrem Budget die passende Strategie ist und welche aktiven Maßnahmen zu mehr Anfragen oder Verkäufen führen.
✅ Mehr Sichtbarkeit & Wahrnehmung durch gezielte Platzierung
✅ Mehr Besucher > Interessenten > Kunden > Umsatz
✅ Mit SEA skalierbar Zielgruppe ansprechen
✅ Mit SEO nachhaltig agieren und wachsen
🫵 Maximale Erfolge mit unserer Hybrid-Strategie
💪 Mehr als 15 Jahre Erfahrung branchenübergreifend in über 1.000+ Projekten nachweisbar!
Der neue „Vertrag widerrufen“-Button in Germanized ab Version 4.0
Germanized bringt seit Version 4.0 zusätzlich eine neue Funktion rund um den EU-konformen „Vertrag widerrufen“-Button beziehungsweise das Bestell-Widerrufsformular mit. Dieses neue Formular ist nicht identisch mit dem klassischen [revocation_form].
Für das neue Formular lautet der Shortcode:
[eu_owb_order_withdrawal_request_form]Dieser Shortcode gibt das neue Formular für den Widerruf einer Bestellung aus. Je nach Status, Login-Zustand und Bestellung werden dort unter anderem Bestellnummer, E-Mail-Adresse, Kundendaten oder eine Bestellauswahl angezeigt.
Tipp für immer richtige und aktuelle Rechtstexte für den Shop: IT-Recht-Kanzlei*
Empfehlung für die neue Widerrufsseite
Lege eine Seite an, zum Beispiel:
/vertrag-widerrufen/Füge dort diesen Shortcode ein:
[eu_owb_order_withdrawal_request_form]Diese Seite sollte anschließend in den Germanized-Einstellungen beziehungsweise im Bereich für den Widerrufsbutton korrekt hinterlegt sein.
Gibt es für den „Vertrag widerrufen“-Button einen eigenen Shortcode?
Der sichtbare Button „Vertrag widerrufen“ aus dem Block Editor ist in Germanized selbst nicht als einzelner Button-Shortcode registriert. Der Button wird intern über ein Template ausgegeben und verlinkt auf die hinterlegte Widerrufsseite.
Wenn du den Button aber flexibel per Shortcode in Elementor, WPBakery, Gutenberg, Widgets oder an anderen Stellen einfügen möchtest, kannst du dir einfach einen eigenen Shortcode erstellen.
Die bessere Plugin Lösung für den WooCommerce Widerrufbutton mit Germanized oder German Market unabhängig:
Eigener Shortcode für den „Vertrag widerrufen“-Button
Füge folgenden Code über das Plugin „Code Snippets“ oder in die functions.php deines Child-Themes ein:
add_shortcode( 'gzd_vertrag_widerrufen_button', function() {
if (
! function_exists( 'eu_owb_get_withdrawal_page_permalink' ) ||
! function_exists( 'eu_owb_get_withdrawal_button_text' )
) {
return '';
}
$url = eu_owb_get_withdrawal_page_permalink();
$text = eu_owb_get_withdrawal_button_text();
if ( empty( $url ) ) {
return '';
}
return sprintf(
'<p class="eu-owb-order-withdraw-from-contract-button align-center has-text-align-center"><a class="button gzd-vertrag-widerrufen-button" href="%s">%s</a></p>',
esc_url( $url ),
esc_html( $text )
);
} );Danach kannst du den Button überall per Shortcode einfügen:
[gzd_vertrag_widerrufen_button]Alternative: Button manuell als HTML einfügen
Wenn du keine dynamische Germanized-Funktion nutzen möchtest, kannst du auch einen einfachen Button manuell setzen:
<a class="button gzd-vertrag-widerrufen-button" href="/vertrag-widerrufen/">
Vertrag widerrufen
</a>Diese Variante ist einfach, aber weniger flexibel. Wenn sich die URL deiner Widerrufsseite ändert, musst du den Link manuell anpassen.
CSS: Widerrufbutton optisch wie andere WooCommerce-Buttons stylen
Der klassische Germanized-Widerrufsbutton kann über #submit_revocation gestaltet werden. Der neue Button beziehungsweise der eigene Shortcode kann über .gzd-vertrag-widerrufen-button angesprochen werden.
#submit_revocation,
.gzd-vertrag-widerrufen-button,
.woocommerce-form-return_request__submit {
display: inline-block;
padding: 12px 24px;
border: 0;
border-radius: 4px;
background-color: #222;
color: #fff;
font-weight: 600;
text-decoration: none;
cursor: pointer;
line-height: 1.3;
transition: all 0.2s ease;
}
#submit_revocation:hover,
.gzd-vertrag-widerrufen-button:hover,
.woocommerce-form-return_request__submit:hover {
background-color: #000;
color: #fff;
text-decoration: none;
}CSS für Woodmart oder Themes mit WooCommerce-Button-Variablen
Wenn dein Theme eigene CSS-Variablen nutzt, zum Beispiel Woodmart, kannst du den Button stärker am Theme-Stil orientieren:
#submit_revocation,
.gzd-vertrag-widerrufen-button,
.woocommerce-form-return_request__submit {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 42px;
padding: 5px 20px;
border: 0;
border-radius: var(--wd-brd-radius, 4px);
background-color: var(--wd-primary-color, #222);
color: #fff;
font-weight: 600;
text-transform: uppercase;
text-decoration: none;
cursor: pointer;
}
#submit_revocation:hover,
.gzd-vertrag-widerrufen-button:hover,
.woocommerce-form-return_request__submit:hover {
opacity: 0.9;
color: #fff;
}Schritt-für-Schritt-Anleitung
1. Prüfe, welches Formular du verwenden möchtest
Für das klassische Germanized-Widerrufsformular verwendest du:
[revocation_form]Für das neue Bestell-Widerrufsformular beziehungsweise den EU Order Withdrawal Button verwendest du:
[eu_owb_order_withdrawal_request_form]2. Erstelle eine eigene Widerrufsseite
Lege eine neue Seite an, zum Beispiel „Vertrag widerrufen“. Füge dort den neuen Shortcode ein:
[eu_owb_order_withdrawal_request_form]3. Hinterlege die Seite in Germanized
Prüfe in den Germanized-Einstellungen, ob die richtige Widerrufsseite beziehungsweise die Seite für den Order Withdrawal Button hinterlegt ist. Ohne korrekt zugewiesene Seite kann der Button ins Leere führen oder nicht wie erwartet erscheinen.
4. Optional: Eigenen Button-Shortcode hinzufügen
Wenn du den Button flexibel einsetzen möchtest, füge den oben genannten PHP-Code als Snippet hinzu. Danach kannst du überall diesen Shortcode verwenden:
[gzd_vertrag_widerrufen_button]5. Button per CSS an dein Theme anpassen
Ergänze das CSS im Customizer unter „Zusätzliches CSS“, in deinem Child-Theme oder in deinem eigenen CSS-Plugin.
6. Teste den Ablauf
Teste den Widerruf als eingeloggter Kunde und als Gastkunde. Prüfe außerdem, ob die E-Mails korrekt versendet werden und ob der Widerruf im Backend sichtbar beziehungsweise verarbeitbar ist.
Häufige Fehler und Lösungen
Der Shortcode [woocommerce_gzd_revocation_form] zeigt nichts an
Dieser Shortcode ist nicht der richtige Formular-Shortcode. Verwende stattdessen:
[revocation_form]Der neue Button erscheint im Block Editor, aber ich finde keinen Shortcode
Der Button selbst ist nicht als einzelner Shortcode registriert. Verwende entweder den Germanized-Block oder erstelle dir mit dem oben genannten PHP-Snippet einen eigenen Button-Shortcode.
Das neue Formular erscheint, aber es sind keine Bestellungen auswählbar
Das kann daran liegen, dass keine widerrufsfähigen Bestellungen vorhanden sind, die Bestellung nicht zum Kundenkonto gehört, die Frist abgelaufen ist oder die Germanized-Einstellungen den Widerruf für diese Bestellung nicht erlauben.
Der Button sieht anders aus als die restlichen Shop-Buttons
Style den Button über CSS. Für das klassische Formular ist besonders #submit_revocation relevant. Für das neue Formular ist unter anderem .woocommerce-form-return_request__submit relevant.
Empfohlene Umsetzung
Für die meisten WooCommerce-Shops ist folgende Kombination sinnvoll:
- Neue Widerrufsseite mit
[eu_owb_order_withdrawal_request_form] - Eigener Button-Shortcode
[gzd_vertrag_widerrufen_button]für flexible Einbindung - CSS-Anpassung für
#submit_revocation,.gzd-vertrag-widerrufen-buttonund.woocommerce-form-return_request__submit - Test als Gastkunde und eingeloggter Kunde
Fazit zum Germanized Widerrufsbutton
Seit Germanized Version 4.0 gibt es beim Widerruf zwei wichtige Varianten: das klassische Widerrufsformular und das neue Bestell-Widerrufsformular mit „Vertrag widerrufen“-Funktion. Der klassische Shortcode lautet [revocation_form]. Für das neue Formular lautet der Shortcode [eu_owb_order_withdrawal_request_form].
Einen einzelnen offiziellen Shortcode nur für den sichtbaren „Vertrag widerrufen“-Button gibt es nicht. Mit einem kleinen eigenen Shortcode lässt sich diese Lücke jedoch sauber schließen, sodass der Button auch außerhalb des Block Editors flexibel verwendet werden kann.
Wichtig ist: Nach der Einrichtung sollte der komplette Ablauf getestet werden – inklusive Button, Formular, Gastbestellung, Kundenkonto, E-Mail-Benachrichtigung und Backend-Verarbeitung.
Zusammenfassung:
Klassisches Widerrufsformular:
[revocation_form]
Neues Germanized-Vertrag-widerrufen-Formular:
[eu_owb_order_withdrawal_request_form]
Eigener Button-Shortcode nach Snippet:
[gzd_vertrag_widerrufen_button]
Wichtige CSS-Selektoren:
#submit_revocation
.gzd-vertrag-widerrufen-button
.woocommerce-form-return_request__submit
