# Aweb Super Filters

# Instalarea si activarea modulului

<div id="bkmrk-filtrarea-este-o-mod">Filtrarea este o modalitate utilă de a seta doar datele care doriți sa fie afisate in mometul in cautari de catre client in site-ul web pe care il detineti. Aplicând un filtru, puteți să limitați datele într-o vizualizare fără a modifica afisarea initiala.</div><div id="bkmrk-aweb-super-filters-e">Aweb Super Filters este un modul de tip multiplu in care se pot face mai multe instante care au configurari diferite in functie de paginile unde vor fi afisate</div>Pentru instalea unei extesiei folositi pasii de **[aici](https://docs.awebdesign.ro/books/aweb-shop/page/instalare-extensie).**

### Pasi activare

1\. Pentru a configura modulul Aweb Super Filters, accesati in meniul principal **Extensii -&gt; Extensii**

[![yz5Screenshot_2.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/scaled-1680-/yz5Screenshot_2.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/yz5Screenshot_2.png)

2\. Pe pagina extensiilor, selectati tab-ul **Module**.

[![select-modulepng.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/scaled-1680-/select-modulepng.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/select-modulepng.png)

3\. Din pagina cu module selectati modulul "Aweb Super Filters" si apasati butonul **"Instaleaza"** ca in exemplul de mai jos:

[![i1einstal.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/scaled-1680-/i1einstal.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/i1einstal.png)

4\. Dupa ce instalarea s-a efectuat in dreptul mudulului apasati butonul **"Editeaza"** :

[![edit.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/scaled-1680-/edit.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/edit.png)

# Setari Modul Aweb Super Filters

Deoarece vizualizarea pe care o primiți după ce aplicați un filtru conține doar înregistrările cu valorile pe care le-ați selectat, restul datelor rămân ascunse până când debifați filtrul. Există mai multe tipuri de filtre, iar unele dintre ele sunt ușor de aplicat și de eliminat. Disponibilitatea comenzilor de filtrare depinde de tipul și valorile câmpului.

#### Setari

De regulă, filtrele sunt situate în partea stângă a unui magazin online și acestea apar pe paginile de categorie / subcategorie. Iată o parte din filtrele unui magazin online :

[![2zafiltre.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/scaled-1680-/2zafiltre.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/2zafiltre.png)

Din tab-ul **Setari** puteti selecta dintre urmatoarele tipuri de filtre:

[![nume1.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/scaled-1680-/nume1.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/nume1.png)

---

**Nume** - numele instantei care va aparea in lista de module

[![nume-instanta.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/scaled-1680-/nume-instanta.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/nume-instanta.png)

Dupa editarea modulului este necesar sa introduceti licenta software oferita de firma Aweb Design S.R.L. si statusul modulului sa fie Activ

[![licenta.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-04/scaled-1680-/Up2licenta.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-04/Up2licenta.png)

In continuare avem urmatoarele filtre:

[![text.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/scaled-1680-/text.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/text.png)

**Text loading** - apare odata cu iconita de incarcare a produselor pe site  
**Text buton reset** - butonul reseteaza filtre dupa ce acestea au fost selectate  
**Text buton filtre mobil** - butonul pentru modulul cu filtrele care apar pe versiunea de mobil

**Selector Buton Filtre Mobil** - selectorul containerului de produse care poate diferi de la o tema la alta. Nativ exista setari pentru tema Default si pentru Colorix comericalizate de Aweb Design S.R.L. Pentru alte teme trebuie schimbat selectorul.

[![reset.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/scaled-1680-/reset.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/reset.png)

**Arata bunt reset** - selectam daca dorim se se afiseze sau nu butonul de reset de pe pagina web  
**Arata Contor Produse** - afiseaza numarul de produse disponibile in dreptul fiecarui filtru

[![filtru-pret.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/scaled-1680-/filtru-pret.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/filtru-pret.png)

**Filtru Pret** - afiseaza casuta filtrului de pret pe site

**Tip Filtru Pret** - selectam modul in care se afiseaza filtrul pretului : **Slider** - stanga - dreapta sau **Input** - doar campuri pentru completarea intervalului de pret, dupa cum vedeti in exemplul de mai jos:

[![slider1.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/scaled-1680-/slider1.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/slider1.png)

**Clasa de Taxare**  - putem adauga TVA in cazul in care produsul nu are TVA-ul inclus iar platorma dvs OpenCart este cofigurata sa foloseasca taxe de produse. Daca nu dorim adaugarea unei clase de taxare selectam "None"**.** Pentru detalii legate de taxe puteti accesa sectiunea Admin -&gt; Sistem -&gt; Localizare -&gt;Taxe.

[![categorii-producatori.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/scaled-1680-/categorii-producatori.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/categorii-producatori.png)

**Categorii**  - la aceasta setare avem otiunile:

\- **Off** - in cazul in care nu se doreste afisarea categorie;

\- **Lista** - afiseaza categoria sub forma de lista;

\- **Imagine** - afiseaza imaginea categoriei;

\- **Amandoua** - afiseaza categoria sub forma de lista cu imagine;

\- **Multiplu** - afiseaza mai multe categorii;

\- **Sortare** - ordinea in care se afiseaza sectiunea respectiva in site

**Producatori**  - la aceasta setare avem otiunile:

\- **Off** - in cazul in care nu se doreste afisarea categorie;

\- **Lista** - afiseaza categoria sub forma de lista;

\- **Imagine** - afiseaza imaginea categoriei;

\- **Amandoua** - afiseaza categoria sub forma de lista cu imagine;

\- **Multiplu** - afiseaza mai multe categorii;

\- **Sortare** - ordinea in care se afiseaza sectiunea respectiva in site

**Tag** - afiseaza o sectiune cu etichetele produselor din categoria sau sectiunea accesata

**Disponibilitate** - se secteaza "On" daca dorim listarea produselor nou introduse. Ele vor aparea in lista in functie de numarul introdu in sectiunea "Zile pentru ca un produs sa fie clasificat in Noutati". Deasemenea si aici avem optiunea de "Sortare".

Diponibilitatea produselor va aparea in lista filtrelor din magazinul online ca in exemplul de mai jos:

[![disponibilitate.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/scaled-1680-/disponibilitate.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/disponibilitate.png)

#### Atribute

Fiecare produs are anumite atribute, setate în panoul de administrare al magazinului online. Aceste atribute pot fi cuvinte, numere sau coduri corespunzătoare unor informații ca de ex:capacitate HDD , model procesor<span style="color: #666666; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Roboto, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; font-size: 0.94em; font-weight: 400;">, rezolutie, tehnologie, display, tip RAM.</span>

In tab-ul **Atribute** avem mai multe optiuni pentru listarea produselor in functie de anumite atribute pe care le vom seta:

[![atribute.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/scaled-1680-/atribute.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/atribute.png)

Fiecare atribut din tabelul de mai sus are urmatoarele optiuni:

**On** - selectam daca dorim setarea atributului respectiv

**Off** - selectam daca nu dorim sa apara acel atribut in listrea produselor

**Multiplu**- daca dorim sa apara mai multe atribute din categoria respectiva, bifam casuta Multiplu, urmata de completarea in casuta alaturata numarul de listari din atributul respectiv

#### Optiuni

[![otiuni.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/scaled-1680-/otiuni.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-03/otiuni.png)

Pentru fiecare optiune din tab-ul Optiuni exista urmatoarele posibilitati:

**Off** - selectam daca nu dorim sa apara acea optiune in listrea produselor;

**Lista** - afiseaza optiunea sub forma de lista;

**Imagine** - afiseaza imaginea optiuni bifate;

**Amandoua** - afiseaza optiunea sub forma de lista cu imagine;

**Multiplu** - daca dorim sa apara mai multe optiuni din categoria respectiva, bifam casuta Multiplu, urmata de completarea in casuta alaturata numarul de listari din optiunea respectiva.

\* dupa modificarea setarilor de mai sus va trebui sa apasati buton "Salvează" din coltul din dreapta sus.

#### Afisarea Modulului in pagina Web

Dupa ce ati realizat setarile dorite pentru modulul Aweb Super Filters va trebuie sa afisam modulul si pe site-ul web.

Pentru aceasta va trebui sa urmati cativa pasi.

Pentru a stabili modul si numele instantei care va aparea pe site-ul dvs. trebuie sa accesati sectiunea **Design-&gt; Layout-uri.**

**[![design-layout.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-04/scaled-1680-/design-layout.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-04/design-layout.png)**

 In continuare veti edita pe rand layout-ul **Category si Search** unde veti putea seta modul de afisare pe pagina web:

[![category-search.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-04/scaled-1680-/category-search.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-04/category-search.png)

Dupa ce ati editat layout-ul veti putea face setarile dorite. Layout-ul se prezinta ca in exemplul de mai jos:

[![ruta.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-04/scaled-1680-/ruta.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-04/ruta.png)

**Nume Layout** - permite stabilirea denumirii layout-ului

**Ruta** - modul dupa care gasiti categoriile / pagina de search.

Daca in sectiunea Layout-uri nu regasiti cele doua layout-uri Category si Search veti edita layout-urile care contin ruta "product/category" respectiv "product/search"

In continuare se va selecta sectiunea in care se doreste afisarea modulului de filtrare. Noi vom folosi coloana din stanga:

[![pozitie-module.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-04/scaled-1680-/pozitie-module.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-04/pozitie-module.png)

Se va selecta instanta modulului de filtre creata anterior dupa care se va apasa butonul **Plus.** Veti observa adaugarea modulului ca in exemplul de mai jos:

**[![buton-plus.png](https://docs.awebdesign.ro/uploads/images/gallery/2022-04/scaled-1680-/buton-plus.png)](https://docs.awebdesign.ro/uploads/images/gallery/2022-04/buton-plus.png)**

Pentru salvarea modificarilor va fi nevoie sa apasati butonul "Salveaza" din coltul din dreapta sus.