Termékarchívum sablon és dinamikus archívumoldalak

A termékarchívum oldalait (termékkategóriák, címkék, attribútumok és a bolt főoldala) a WooCommerce - Termékarchívum típusú Bricks-sablonnal tervezed meg.

https://minta-bolt.hu/bolt/

A képen a termékarchívum szokásos részei látszanak: az oldal címe, az Összesen 1 találat felirat, a rendezési választó és a termékrács.

A sablon létrehozása

1. Nyisd meg a Bricks sablonok képernyőjét, és adj hozzá új sablont.
2. A jobb felső legördülőben válaszd a WooCommerce - Termékarchívum sablontípust.
3. Kattints a Közzététel vagy a Piszkozat mentése gombra.
4. Kattints a Szerkesztés Bricks-szel gombra a szerkesztő megnyitásához.

Ezt és a többi sablont a Bricks szerkesztőfelületén is létrehozhatod és szerkesztheted a mappák ikonra kattintva vagy a CMD / CTRL + SHIFT + L billentyűkombinációval.

A Termékarchívum sablon elemei

Archívum címe

A termékarchívumhoz nincs külön címsor-elem. Ehhez használhatod a Bejegyzés címe elemet, vagy egy Címsor elemet az {archive_title} címkével.

Breadcrumbok

A Breadcrumbok elem a „Kezdőlaptól” a magasabb szintű kategóriákon át az oldalon megjelenített tartalomig mutatja a navigációs hivatkozásokat. Az elem a WooCommerce alapértelmezett morzsamotorját használja az útvonal egyes részeihez.

Termékarchívum leírása

Megjeleníti a termékkategória (vagy más terméktaxonómia-kifejezés) leírását. Ha a bolt főoldalát megjelenítő sablonban használod, az oldal tartalmát írja ki (a Gutenberg/blokkszerkesztőből).

Termékek

A termékeket rácsban listázó fő elem. Vezérlőkkel testre szabhatod a stílust és az elrendezést, módosíthatod a lekérdezést, és kiválaszthatod, milyen tartalom (mező) jelenjen meg minden termékről.

Az elem együttműködik a Termékszűrő, a Termékek lapozása, a Termékek rendezési szempontja és az Összes terméktalálat elemmel. Ezért a lekérdezés eredményét a szűrők és a rendezési feltételek befolyásolják, ami hatással van a lapozás és az összes találat kimenetére is.

A Termékek elem lekérdezése összefésüli az elem lekérdezési argumentumait az alapértelmezett WooCommerce-lekérdezéssel, ha az oldal a termékarchívum vagy egy terméktaxonómia-archívum (termékkategória vagy címke). Ha tehát egy adott termékkategória archívumoldalát nézed, csak az adott kategória termékei látszanak.

Termékszűrő

A Termékszűrő elemmel lekérdezési szűrőket adhatsz az oldalhoz, hogy a látogató keresni vagy szűkíteni tudja a termékek listáját. Három szűrőtípust tartalmaz:

• Taxonómia: a listát egy vagy több taxonómiakifejezés szerint szűri.
• Termékattribútumok: a listát termékattribútumok, például méret, szín vagy bármely más egyéni attribútum szerint szűri.
• Egyebek: különleges szűrők, például ár kettős csúszkás szűrő, csillagos értékelés szerinti szűrő, készletállapot-szűrő vagy egyszerű keresőmező. Itt találod a szűrők alaphelyzetbe állítása lehetőséget is, amellyel szűrők visszaállító gombot adhatsz.

A taxonómia- és attribútumszűrőknél különféle beviteli elemeket választhatsz: legördülő menü, jelölőnégyzetek, rádiógombok, szöveges lista vagy dobozlista.

Termékek lapozása

A lapszámhivatkozások listája, amellyel a látogató a terméklista különböző oldalai között lép.

Termékek rendezési szempontja

Legördülő menüt ad az elrendezéshez, amellyel a látogató megváltoztathatja a termékek sorrendjét. Az alapértelmezett rendezési lehetőségek: népszerűség, átlagos értékelés, legfrissebb, ár (növekvő és csökkenő). A lista a WooCommerce alapértelmezett listáját használja, és WooCommerce-horgokkal vagy harmadik féltől származó bővítményekkel bővíthető.

Összes terméktalálat

Az aktuális termékekre vonatkozó lekérdezés találatainak számát írja ki.

Az elemek beállításait a WooCommerce elemek: Termékek, Termékek lapozása és Összes terméktalálat és a WooCommerce elemek: Értesítés, Termékarchívum leírása, Termékszűrő és Termékek rendezési szempontja fejezet részletezi.

Dinamikus archívumoldal: kategóriák és termékek

Ebben a példában egyéni WooCommerce-archívumsablont készítesz, amely termékkategóriákat és termékeket is meg tud jeleníteni. Ezzel egy időben a WordPress Megjelenés → Testreszabás → WooCommerce → Termékkatalógus oldalon a Bolt oldal megjelenítése és a Kategóriaoldal megjelenítése beállítással szabályozhatod, mikor jelenjenek meg a kategóriák vagy a termékek.

1. lépés: termékek és termékkategóriák előkészítése

Győződj meg róla, hogy a termékkategóriáid között vannak alkategóriák is. Vegyél fel néhány terméket, és rendeld őket különböző termékkategóriákhoz. A legjobb, ha minden kategóriához adsz képet, mert a sablonban azt is kiírjuk.

2. lépés: a WooCommerce-archívum létrehozása

1. Hozz létre új sablont, és válaszd a megfelelő sablontípust (WooCommerce - Termékarchívum).
2. Állítsd be a sablon feltételeit a Sablonbeállítások → Feltételek alatt, hogy a sablon a WooCommerce bolt oldalán és a termékkategóriák és címkék archívumoldalain érvényesüljön.
3. Hozz létre két különböző lekérdezési ciklust, amelyeket feltételekkel renderelsz dinamikusan a látogatói oldalon. A példában két szakasz van: az egyik a termékkategóriák ciklusa, a másik a termékeké.

3. lépés: a termékkategóriák szakasz

A termékkategóriák dinamikus megjelenítéséhez a Szülő mezőben a get_queried_object_id() PHP-függvényt kell használnod. Ehhez a Bricks echo dinamikus címkéjét használd: írd a Szülő mezőbe az {echo:get_queried_object_id} címkét.

A szakasz feltételes megjelenítéséhez a WooCommerce woocommerce_get_loop_display_mode() függvényét is használod. Ez a beállításaid szerint products, subcategories vagy both szöveget ad vissza.

A kategóriák szakaszra állítsd be a feltételt:

{echo:woocommerce_get_loop_display_mode} != products

Ez a szakasz akkor jelenik meg, ha nem a „Termékek megjelenítése” van kiválasztva.

A ciklus képének és szövegének beállításai a példában: a {woo_product_cat_image} a kategória képét, a {term_name:link} a kategória nevét hivatkozással írja ki.

4. lépés: a termékek szakasz

A termékek lekérdezésének beállításai egyszerűek: csak az oldalankénti bejegyzések számát kell megadnod. A termékek szakaszra állítsd be a feltételt:

{echo:woocommerce_get_loop_display_mode} != subcategories

Ez a szakasz akkor jelenik meg, ha nem az „Alkategóriák megjelenítése” vagy „Kategóriák megjelenítése” van kiválasztva. A ciklusban a termékek beállításainál csak a használt dinamikus címkékre figyelj, a stílus nem lényeges.

Ha egy terméknél több termékkategória is be van jelölve, de te csak az elsőt akarod kiírni, hogy a címke ne legyen túl hosszú, használhatsz egy egyszerű egyéni függvényt. Cseréld ki a {post_terms_product_cat} címkét az {echo:product_first_category_name} címkére:

// A gyermektéma functions.php fájljába
// Egy termék első kategóriájának nevét adja vissza
function product_first_category_name() {
  global $product;
  if ( $product && is_a( $product, 'WC_Product' ) ) {
    // A termék kategóriái
    $terms = get_the_terms( $product->get_id(), 'product_cat' );
    $cats = [];
    // Végigmegyünk a kategóriákon, és a $cats tömbhöz adjuk őket
    foreach ( $terms as $term ) {
      $cats[] = $term->name;
    }
    // Az első kategória visszaadása
    if ( ! empty( $cats ) ) {
      ob_start();
      echo $cats[0];
      return ob_get_clean();
    }
  }
}

Az eredmény ellenőrzése

Ezután a bolt oldalnak és a termékkategória-oldalaknak a várt módon kell működniük. A kategóriák és a termékek szakasz megjelenését bármikor szabályozhatod a WordPress vezérlőpultján a Megjelenés → Testreszabás → WooCommerce → Termékkatalógus beállításaival.