# Alkalmaz gomb

> Az Apply Button blokk, widget és elem beállításai: szolgáltató, alkalmazási mód, gombfelirat, aktív állapotok és átirányítás.

Az alkalmaz gomb egy gomb az oldalon, amely egy kattintással elindítja a szűrést. Mivel a szűrést indítja, mindig szűrőkkel együtt használod, amelyeket előbb kell az oldalra tenni.

Két feltétel kell hozzá: a megfelelő szűrők már az oldalon legyenek, és a szűrők **Apply on** beállítása legyen **Click on apply button**. Különben a szűrő magától, értékváltozáskor szűr, és a gombnak nincs mit elindítania.

![Az Apply Button blokk beállításai a Gutenberg oldalsávjában](./kepek/szurotipusok-alkalmaz-gomb-blokk.webp)

*Az Apply Button blokk beállításai a Gutenberg oldalsávjában* (https://minta-bolt.hu/wp-admin/post.php?post=23&action=edit)

A képen a blokk **Általános** panelje látszik. A gomb felirata alapból az „Apply filter” angol szöveg, amelyet az **APPLY BUTTON TEXT** mezőben átírhatsz.

## Beállítások

| Beállítás | Mit csinál |
| --- | --- |
| **This Filter For** | A szolgáltató. Elementorban: Elementor Pro Loop Grid, JetEngine, JetWooBuilder Products Grid és Products List, WooCommerce archívum (JetWooBuilder), alapértelmezett WooCommerce archívum (klasszikus), Bricks query loop. Gutenbergben: Listing Grid és WooCommerce shortcode. |
| **Apply type** | **AJAX** vagy **Page reload**: így jelennek meg a szűrt találatok. |
| **Apply button text** | A gomb felirata az „Apply filters” helyett. |
| **Active button states** | Mikor legyen aktív a gomb: **Always** (mindig), **Any filter selected** (ha bármelyik szűrő ki van választva) vagy **All filters selected** (ha minden szűrő ki van választva). Az utolsó két érték mellett megjelenik az **If button inactive** lista: **Hide** (a gomb elrejtése) vagy **Disable** (letiltása). |
| **Apply redirect** | Bekapcsolva megjelenik a **Redirect path** mező az átirányítás URL-jével. **AJAX** módban az URL tiszta marad, **Page reload** módban az átirányításkor a paraméterek bekerülnek az URL-be. Gutenbergben a kapcsoló alatt jelenik meg az **ACTIVE BUTTON STATE** lista is. |
| **Open in new window** | Bekapcsolva a szűrt találatok új ablakban nyílnak meg. |
| **Query ID** | Egyedi lekérdezési azonosító. Ha az oldalon több azonos szolgáltatójú elem van, a szűrt elemnek ugyanezt az azonosítót kell adnod. |
| **Additional Providers Enabled** | Bekapcsolva újabb szolgáltatókat is felvehetsz (Gutenbergben **ADDITIONAL PROVIDER** és **ADDITIONAL QUERY ID**), amelyekre a gomb ugyanúgy hat. |

## Kinézet

- **Elementor:** a **Style** fül a gomb tipográfiáját, színeit, testét, margóit és igazítását adja. A **Haladó** fülön elrendezés, Jet Advanced, dinamikus láthatóság, mozgáseffektek és más csoportok vannak.
- **Gutenberg:** a blokknak **Általános** és **Haladó** panelje van. A **Haladó** panelen a **TOVÁBBI CSS OSZTÁLY(OK)** mező van. A stílus a JetStyleManager ingyenes bővítménnyel is állítható.
- **Bricks:** a **CONTENT** fül az Elementor widget beállításait ismétli, a **STYLE** fül elrendezést, tipográfiát, hátteret, szegélyt és árnyékot, színátmenetet és más stílusbeállításokat ad.

## Eredmény az oldalon

![Szűrők és gombok a nyilvános oldalon, még nincs szűrés](./kepek/szurotipusok-gombok-alap.webp)

*Szűrők és gombok a nyilvános oldalon, még nincs szűrés* (https://minta-bolt.hu/szuro-gombok/)

A nyilvános oldalon a szűrő alatt a gomb áll, a lista pedig minden terméket mutat.

![A kijelölt kategória és az alkalmazott szűrő](./kepek/szurotipusok-gombok-alkalmazva.webp)

*A kijelölt kategória és az alkalmazott szűrő* (https://minta-bolt.hu/szuro-gombok/)

A kategória kijelölése és a gomb megnyomása után a lista a kijelölt kategória termékeire szűkül, és megjelenik a **Szűrők eltávolítása** gomb is.