Rövidkódok

A rövidkódokkal a termékeidet, gombjaidat és oldalaidat a WordPress-webhelyed bármely pontján megjelenítheted: bejegyzésben, saját nyitóoldalon vagy az oldalsávban.

A rövidkód beillesztése

1. Nyiss meg egy oldalt vagy bejegyzést a blokkszerkesztőben.
2. Add hozzá a Rövidkód blokkot, és illeszd be a kódot.
3. Tedd közzé az oldalt.

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

A képen egy háromoszlopos termékrács, alatta a kategórialista darabszámmal és egy különálló kosárba gomb látszik. Ez három rövidkódból áll.

Tipp: a per_page attribútumot alacsony számra (3 vagy 4) állítva kis „Kiemelt termékek” sávot hozhatsz létre a nyitóoldalon.

1. Terméklista: [fluent_cart_products]

A legegyszerűbb mód termékrács megjelenítésére. Jó a fő boltoldalra, a nyitóoldal kiemelt termékeihez vagy egy kategória galériájához.

Alapszint

[fluent_cart_products]

Szűrés termékazonosítóval

Konkrét termékeket egy vagy több azonosító megadásával jeleníthetsz meg. Ez kézzel válogatott kínálathoz jó nyitóoldalon vagy akciós szakaszban.

// Egyetlen termék
[fluent_cart_products ids="433"]

// Több termék
[fluent_cart_products ids="344,346,347"]

Bizonyos termékeket az exclude_ids attribútummal rejthetsz el:

// Egy termék kizárása
[fluent_cart_products exclude_ids="344"]

// Több termék kizárása
[fluent_cart_products exclude_ids="3595,3493"]

Ha nem létező azonosítót adsz meg (például ids="999999"), nem jelenik meg termék.

Szűrés kategória szerint

A terméklistát egy vagy több kategóriára szűkítheted. A kategóriát hivatkozhatod a slugjával vagy a kifejezés azonosítójával, amelyik kényelmesebb.

// Egy kategória slugja
[fluent_cart_products category="ruhak"]

// Több kategória slugja
[fluent_cart_products category="ruhak,cipok"]

// Egy kategória azonosítója
[fluent_cart_products category_id="9"]

// Több kategória azonosítója
[fluent_cart_products category_id="9,12"]

// Slug és azonosító együtt
[fluent_cart_products category="pulcsik" category_id="8"]

A kategóriaszűrő a lapozással is együttműködik. Ez a rövidkód oldalanként két terméket mutat számozott lapozással, és a kategóriaszűrő megmarad, amikor a látogatók lapoznak:

[fluent_cart_products category="pulcsik" per_page="2" paginator="numbers"]

Ha nem létező kategória slugját adod meg, a szűrő figyelmen kívül marad, és az összes termék megjelenik.

Szűrés bármely taxonómia szerint

A kategórián túli szűréshez a taxonomies attribútumot használd. Csak kifejezésazonosítókat fogad, taxonómiánként csoportosítva: taxonómia:azonosító,azonosító, több taxonómiát | jel választ el.

// A 67-es márka termékei
[fluent_cart_products taxonomies="product-brands:67"]

// Két márka és egy kategória egyszerre
[fluent_cart_products taxonomies="product-brands:67,82|product-categories:9"]

Ez működik a product-categories, a product-brands és minden, a termékeken regisztrált egyéni taxonómiával (például az áruház által hozzáadott product-tags). Ha a taxonómia nincs regisztrálva a termékeken, vagy a kifejezés nem tartozik a megnevezett taxonómiához, a szűrő semmit nem talál, ahelyett hogy bővítené a listát.

Ne keverd össze ezt a haladó példa custom_filters részében lévő taxonomies kulccsal: az csak azt dönti el, mely taxonómiaszűrők jelenjenek meg a vásárlói oldalsávban. Az itt leírt attribútum a rövidkód által megjelenített termékeket szűkíti.

Szűrés terméktípus és akció szerint

A product_type csak egy típust mutat, az on_sale az akciós termékeket.

// Csak egyszerű termékek
[fluent_cart_products product_type="simple"]

// Csak változatos termékek
[fluent_cart_products product_type="simple_variations"]

// Csak fizikai termékek
[fluent_cart_products product_type="physical"]

// Csak digitális termékek
[fluent_cart_products product_type="digital"]

// Csak előfizetéses termékek
[fluent_cart_products product_type="subscription"]

// Csak a jelenleg akciós termékek
[fluent_cart_products on_sale="yes"]

Az üres attribútumértékeket (például ids="", category="", product_type="") a rendszer figyelmen kívül hagyja, ezért egy véletlen üres érték nem rontja el az oldalt.

Rendezés

A sorrendet a gyakori beállításokat adó sort_by attribútummal, vagy részletesebben az orderby és az order attribútummal szabályozhatod.

// Ár szerint növekvő (orderby és order)
[fluent_cart_products orderby="price" order="ASC"]

// Ár szerint növekvő
[fluent_cart_products sort_by="price-low"]

// Ár szerint csökkenő
[fluent_cart_products sort_by="price-high"]

// Név szerint A-tól Z-ig
[fluent_cart_products sort_by="name-asc"]

// Legújabbak elöl
[fluent_cart_products sort_by="date-newest"]

// Legrégebbiek elöl
[fluent_cart_products sort_by="date-oldest"]

Elrendezés és megjelenítés

Az oszlopok számát és a nézetet az oldalad külsejéhez igazíthatod.

// Háromoszlopos rács
[fluent_cart_products columns="3"]

// Legfeljebb 6 termék, három oszlopban
[fluent_cart_products limit="6" columns="3"]

// Kétoszlopos rácsnézet
[fluent_cart_products columns="2" view_mode="grid"]

// Listanézet, oldalanként 4 termékkel és számozott lapozással
[fluent_cart_products per_page="4" view_mode="list" paginator="numbers"]

Attribútumok kombinálása

A rövidkód ereje az attribútumok keverésében van. Néhány gyakorlati példa:

// Két kiválasztott termék, oldalanként egy
[fluent_cart_products ids="433,434" per_page="1" paginator="numbers"]

// Kiválasztott termékek háromoszlopos elrendezésben
[fluent_cart_products ids="433,434,435" columns="3" per_page="3"]

// Egy kategória termékei, egy kizárva, legújabbak elöl
[fluent_cart_products category="pulcsik" exclude_ids="433" sort_by="date-newest"]

// Digitális termékek három oszlopban, ár szerint rendezve, oldalanként 6
[fluent_cart_products product_type="digital" columns="3" sort_by="price-low" per_page="6"]

Haladó használat: szűrők és oldalsáv

Oldalsávos szűrőt is bekapcsolhatsz, JSON-alapú beállításokkal. Ez a példa 4 terméket mutat oldalsávos szűrővel:

[fluent_cart_products
    per_page=4
    live_filter='false'
    enable_filter='true'
    paginator='numbers'
    custom_filters='{"enabled":true,"live_filter":true,"taxonomies":"product-categories,product-brands","price_range":"price_range"}'
    filters='{"enabled":true,"sort_by":"name-desc"}'
]

Attribútumtáblázat

Attribútum	Mit csinál	Alapérték	Lehetséges értékek
ids	Csak a megadott azonosítójú termékeket mutatja.	nincs	Egy azonosító vagy vesszővel elválasztott lista (433 vagy 344,346,347)
exclude_ids	Elrejti a megadott termékeket.	nincs	Egy azonosító vagy vesszővel elválasztott lista
category	Egy vagy több kategória slugja szerint szűr.	nincs	Vesszővel elválasztott slugok (ruhak vagy ruhak,cipok)
category_id	Egy vagy több kategória azonosítója szerint szűr.	nincs	Vesszővel elválasztott azonosítók (9 vagy 9,12)
taxonomies	A termékeken regisztrált bármely taxonómia kifejezésazonosítói szerint szűr.	nincs	taxonómia:azonosító,azonosító, taxonómiák között | (product-brands:67,82|product-categories:9)
product_type	Csak egy terméktípust mutat.	nincs	simple, simple_variations, physical, digital, subscription
on_sale	Csak a jelenleg leárazott termékeket mutatja.	nincs	yes
sort_by	Gyors rendezési beállítás.	nincs	price-low, price-high, name-asc, date-newest, date-oldest
orderby	A rendezés mezője (az order mellett használd).	nincs	price, name, date
order	A rendezés iránya (az orderby mellett használd).	nincs	ASC, DESC
columns	Az oszlopok száma a rácson.	nincs	Bármely szám (2, 3, 4)
limit	A megjelenített termékek legnagyobb száma.	nincs	Bármely szám (6, 10)
view_mode	Rács vagy lista elrendezés.	grid	grid, list
per_page	Hány termék látszik egy oldalon.	12	Bármely szám (4, 8, 20)
paginator	A lapozás stílusa az alján.	numbers	numbers, load_more, scroll, none
enable_filter	A szűrő oldalsáv megjelenítése vagy elrejtése.	true	true, false
live_filter	Ha true, a termékek azonnal frissülnek a szűrők kattintására.	true	true, false
custom_filters	A kategória- és árszűrők beállításai.	nincs	Lásd lent
filters	A rendezés beállításai (név, ár és így tovább).	nincs	Lásd lent

A szűrők JSON-beállításai

A custom_filters objektum:

• enabled: true értéknél megjelennek az egyéni kategória- és márkaszűrők.
• live_filter: true értéknél a frissítés azonnali, oldal újratöltése nélkül.
• taxonomies: mit mutasson a szűrő (például "product-categories,product-brands").
• price_range: árcsúszkát ad a "price_range" érték megadásával.

A filters objektum:

• sort_by: milyen sorrendben jelenjenek meg először a termékek. Lehetséges értékek: name-asc, name-desc, price-asc, price-desc, date-desc.

2. Pénztárgomb: [fluent_cart_checkout_button]

Olyan gombot hoz létre, amely a pénztároldalra visz, vagy felugró „Vásárlás most” ablakot nyit. Nyitóoldalakra és akciókra való, ahol a lehető leggyorsabbá akarod tenni a vásárlást.

[fluent_cart_checkout_button variation_id="113" instant_checkout="yes"]

Attribútum	Mit csinál
button_text	A gomb felirata, például button_text="Megveszem". Ha üres, általában „Checkout” a felirat.
variation_id	(Nagyon fontos) Az eladandó konkrét változat azonosítója. A termék beállításaiban látható változatazonosítót kell megadnod.
target	Hol nyíljon meg a hivatkozás: _self ugyanabban a lapban, _blank új ablakban.
instant_checkout	yes értéknél a pénztár felugró ablakban nyílik. no értéknél a gomb sima hivatkozásként viszi a vevőt a pénztároldalra.

Példák:

• Hivatkozás a pénztárhoz: [fluent_cart_checkout_button button_text="Tovább a pénztárhoz" target="_self"]
• Egykattintásos vásárlás: [fluent_cart_checkout_button variation_id="113" instant_checkout="yes" button_text="Vásárlás most"]

3. Kosárba gomb: [fluent_cart_add_to_cart_button]

Egyszerű Kosárba gombot tesz oda, ahová szeretnéd. Akkor használd, ha azt akarod, hogy a vevő a kattintás után az oldalon maradjon, és vásároljon tovább.

[fluent_cart_add_to_cart_button button_text="Kosárba teszem" variation_id="113"]

Attribútum	Mit csinál
button_text	A gomb felirata (például „Zacskóba”, „Kérek egyet”).
variation_id	A kosárba tett termék vagy változat azonosítója.

4. Minikosár: [fluent_cart_mini_cart]

Kis, praktikus kosárösszegzést jelenít meg, fejlécbe vagy oldalsávba való. A vevő egy pillantással látja a tételek számát és a végösszeget.

[fluent_cart_mini_cart cart_icon="bag" show_total_price="true"]

Attribútum	Mit csinál
cart_icon	Az ikon stílusa: cart, bag, bag-alt. Egyéni SVG-t is megadhatsz URL-lel: cart_icon="https://pelda.hu/ikon.svg".
show_total_price	true értéknél az ikon mellett látszik a jelenlegi végösszeg.
show_item_count	Mikor látszik a tételek száma: always (nullánál is), has_items (csak ha van tétel a kosárban), never (soha).
icon_color, price_color, product_count_color	Hexadecimális színkódok a márkádhoz (például icon_color="#cf2e2e").
button_class	Egyéni CSS-osztály a kosárgombhoz, ha saját stílust adnál neki.

5. Termékkategóriák: [fluent_cart_product_categories]

A termékkategóriákat listában vagy legördülő menüben mutatja, hogy a vevők kategória szerint böngészhessenek.

[fluent_cart_product_categories display_style="list" show_hierarchy="true"]

Attribútum	Mit csinál
display_style	A megjelenítés módja: list (sima lista) vagy dropdown (helytakarékos legördülő menü).
show_hierarchy	true értéknél a szülő és gyermek kategóriák behúzva látszanak.
show_empty	true értéknél azok a kategóriák is megjelennek, amelyekben még nincs termék.
show_product_count	true értéknél a kategórianév mellett látszik a termékek száma.

6. Áruház logó: [fluent_cart_store_logo]

Az áruház logóját jeleníti meg a webhely bármely pontján, egyéni hivatkozással és méretbeállítással.

[fluent_cart_store_logo is_link="true" logo_url="https://pelda.hu/logo.png" max_width="200"]

Attribútum	Mit csinál
logo_url	(Kötelező) A logófájl közvetlen URL-je.
is_link	true értéknél kattintható a logó (általában a nyitóoldalra visz), false értéknél állókép.
link_target	_self ugyanabban a lapban, _blank új lapban nyitja a hivatkozást.
max_width	A logó legnagyobb szélessége képpontban (például "300").
max_height	A logó legnagyobb magassága képpontban (például "200").

7. Vásárlói fiók gombja: [fluent_cart_customer_dashboard_button]

Gombot vagy hivatkozást ad, amelyen át a bejelentkezett vevők elérik a profiljukat vagy rendeléseiket. A fejléc és a lábléc menüjébe való.

[fluent_cart_customer_dashboard_button button_text="Profilom" display_type="link"]

Attribútum	Mit csinál
button_text	A hivatkozás vagy gomb szövege (például „Fiókom”, „Profil”).
display_type	Megjelenés: link (egyszerű szöveges hivatkozás) vagy button (stílusos gomb).
show_icon	true értéknél kis felhasználóikon látszik a szöveg mellett, false értéknél nem.
link_target	_self ugyanabban a lapban, _blank új lapban.

8. Terméknév: [fluent_cart_product_title]

Egy konkrét termék nevét írja ki az oldalon. Egyéni nyitóoldalakon hasznos, ahol a nevet a képtől vagy a leírástól külön szeretnéd elhelyezni.

[fluent_cart_product_title product_id="123" is_link="true"]

Attribútum	Mit csinál
product_id	(Kötelező) A termék azonosítója.
is_link	true értéknél kattintható a név, és a termékoldalra visz.
link_target	_self ugyanabban a lapban, _blank új lapban.
is_default	true értéknél az alapértelmezett stílus érvényes, false értéknél a környező szöveg stílusát örökli.

9. Termékkép: [fluent_cart_product_image]

A terméknévhez hasonlóan egy konkrét termék kiemelt képét jeleníti meg. Egyéni elrendezéshez jó: az egyik oszlopba a kép, a másikba a részletek kerülhetnek.

[fluent_cart_product_image product_id="123"]

Attribútum	Mit csinál
product_id	(Kötelező) A termék azonosítója.
is_default	false értéknél CSS-sel saját méretet és stílust adhatsz, true értéknél az alapértelmezett kimenet látszik.

10. Oldalba ágyazott pénztár: [fluent_cart_checkout]

A pénztár rövidkódja általában a vevő saját kosarát mutatja. Ha változatok listáját adod meg, oldalba ágyazott pénztárűrlap lesz belőle: a vevők az általad kiválasztott termékek közül választanak, és ugyanazon az oldalon fizetnek. Ehhez a FluentCart Pro kell. Az űrlap részletes leírása az Értékesítési eszközök fejezetben van.

[fluent_cart_checkout variant_ids="185,186,187" selection_mode="single" selector_label="Válaszd ki a csomagodat"]

Attribútum	Mit csinál
variant_ids	(Ehhez a módhoz kötelező) A felkínált változatok azonosítóinak vesszős listája, legfeljebb 20.
selection_mode	single rádiógombokat mutat (ez az alapérték), multiple jelölőnégyzeteket.
max_items	multiple módban a legtöbb, egyszerre kijelölhető lehetőség, 1 és 20 között.
selector_label	A lista feletti cím.
field_label_style	A pénztármezők feliratának módja, miután a vevő beírt valamit: docked (az alapérték), floating vagy placeholder. variant_ids nélkül is működik.

11. Pénznemváltó: [fluent_cart_currency_switcher]

Gombot mutat, amellyel a vevők kiválaszthatják, melyik pénznemben látják az árakat. Csak akkor jelenik meg, ha a többvalutás értékesítés be van kapcsolva legalább két pénznemmel, különben semmit nem ír ki. A többvalutás értékesítéshez a FluentCart Pro kell.

[fluent_cart_currency_switcher display="flag" list_display="name"]

A list_ kezdetű attribútumok a gombra kattintva megnyíló listát, a többiek a gombot szabályozzák.

Attribútum	Mit csinál
display	Mit mutat a gomb: name_code, name, code, symbol vagy flag. Ha kihagyod, a kód látszik a jellel (például USD $).
symbol	yes hozzáadja a pénznem jelét a gomb feliratához, no elveszi.
flag	no elrejti a zászlót a gombon. Alapból látszik.
flag_position	left (alapérték) vagy right: a zászló helye a gombon.
list_display	Mit mutat a lista egy sora: name_code (alapérték), name, code, symbol vagy flag.
list_symbol	yes a lista minden sorához hozzáadja a jelet. Alapból nincs jel a listában.
list_flag	no elrejti a zászlót a lista soraiban.
list_flag_position	left (alapérték) vagy right: a zászló helye a lista sorában.

A váltó blokként és menüelemként is elérhető; az értékek részletes leírása és a kész kombinációk a Többvalutás értékesítés fejezetben vannak.