Egyedi pénztárlépés hozzáadása

Saját lépést (fület) is felvehetsz a pénztár folyamatába, de ehhez egyedi fejlesztés kell. A példában egy „Korhatár-ellenőrzés” lépés kerül a pénztárra az adatok és a szállítási mód lépése közé. A kódot a téma functions.php fájljába vagy egy kódrészlet-kezelő bővítménybe tedd; nyitó <?php címke nélkül ugyanez a CheckoutWC → Haladó → Szkriptek fül PHP kódrészletek mezőjébe is mehet.

add_filter( 'cfw_get_checkout_tabs', 'add_age_verification_checkout_step' );

function add_age_verification_checkout_step( $tabs ) {
  /**
   * A lépések prioritása
   * - Ügyfél adatai: 20
   * - Szállítási mód: 30
   * - Fizetési mód: 40
   */
  $tabs['age_verification'] = array(
    'label'            => 'Korhatár-ellenőrzés',
    'classes'          => array(),
    'priority'         => 25, // Az adatok és a szállítási mód között
    'enabled'          => true,
    'display_callback' => 'cfw_display_age_verification_checkout_step',
  );

  return $tabs;
}

function cfw_display_age_verification_checkout_step() {
  ?>
  <h1>Hány éves vagy?</h1>
  <p>Itt kérdezheted meg a vásárlótól a korát.</p>

  <div class="cfw-bottom-controls">
    <div class="previous-button">
      <?php cfw_return_to_customer_information_link(); ?>
    </div>

    <?php cfw_continue_to_shipping_button(); ?>
  </div>
  <?php
}

Mit csinál a kód

• A lépés bekerül a lépésjelzőbe (breadcrumb), vagyis megjelenik a hivatkozása.
• A lépés bekerül a fülek közé, a megadott prioritás szerinti helyre.
• A lépés aljára előző és következő gombot rak, amelyek a megfelelő szomszédos lépésre visznek.
• A lépésben a woocommerce_form_field függvénnyel kiírt mezők megkapják a Parsley JavaScript-ellenőrzést, így kötelező mezőt kitöltetlenül nem lehet továbblépni.

Mit nem csinál (neked kell megoldanod)

• Nem írja át az ügyféladatok és a szállítási mód lépés gombjait, hogy az új lépésre mutassanak. A natív lépések gombjait horgok adják hozzá, ezeket kell a saját lépéseidhez igazítanod.
• A szállítási lépés dinamikusan rejtődik el, ha a kosárban nincs szállítandó termék. Ezt a példa nem kezeli. Ilyenkor az új lépésen két „tovább” gombot kell kirakni, és a cfw-hide-shipping CSS-osztály alapján eldönteni, melyik látszik.
• Nem tesz a lépésbe tényleges űrlapelemet (a példában a korhatár-ellenőrzéshez nincs bemeneti mező).

A kód kiindulópont: a hiányzó részeket a saját igényeid szerint kell kiegészíteni.