Tässä artikkelissa käydään läpi tuotesuodattimien laatiminen tuotelistojen yhteyteen MyCashflow-teemoissa.

Tuen lisääminen tuotesuodattimille teemassa

  1. Mene hallintatyökalun sivulle Tuotteet > Tuoteominaisuudet.
  2. Määritä tarvittavat suodattimet, niiden arvot ja tuotteiden ominaisuudet.

    Lue lisää suodattimien hallinnasta ja ominaisuuksien käyttämisestä tuotteilla.

    Tuotesuodattimet eivät tule käyttöön verkkokaupassa, mikäli vähintään yksi niistä ei ole näkyvillä.

  3. Lisää theme.xml-tiedostoon <ProductListFilters supported="true"/> -asetus.

    Alla näet esimerkin teeman asetuksista, joihin on lisätty tuki tuotesuodattimille.

    ...
<Features>  
    <ProductListFilters supported="true"/>
    <BrandProductListFilters supported="true"/>
    <CampaignProductListFilters supported="true"/> 
</Features>
...

    Jos haluat käyttää tuotesuodattimia myös tuotemerkki- ja kampanjasivuilla, lisää myös seuraavat asetukset:

    • <BrandProductListFilters supported="true"/>
    • <CampaignProductListFilters supported="true"/>

    Lue tarvittaessa lisää teeman asetuksista.

    Tuotesuodatinasetuksen käyttöönotto muuttaa {Products}-tagin toimintaa. Lue lisää seuraavasta kappaleesta.

  4. Lisää teemaan {ProductListFilters}-tagi ennen tarvittavia tuotelistoja.

    Tagi on käytössä kaikilla sivuilla, mutta sitä on syytä käyttää varsinkin tuoteryhmien ja -merkkien sekä kampanjoiden päätuotelistoilla.

    Katso myös lista tuotesuodattimien tageista.

    {ProductListFilters}-tageja voi olla samalla sivulla vain yhden tuotelistan yhteydessä.

    Tuotesuodattimet on mahdollista lisätä vain {Products}-tagin avulla laadittujen tuotelistojen yhteyteen.

    Voit hyödyntää suodattimien toteutuksessa hakutulossivun suodattimia (jos nämä on toteutettu verkkokaupan teemassa).

    Hakutulossivun tagit toimivat saman periaatteen mukaisesti. Muuta vain tagien nimet, niin voit säästää aikaa ja vaivaa toteutuksessa.

  5. Muotoile suodattimet haluamallasi tavalla.

Tuotesuodattimien vaikutukset tuotelistoihin

Kun tuotesuodattimet ovat käytössä verkkokaupassa ja niille on lisätty tuki verkkokaupan teemassa, {Products}-tagilta poistuu käytöstä useita attribuutteja, joiden avulla määritetään listan sisältö.

Tuotesuodattimia käyttävien listojen sisältöä hallitaan kaupan asetuksissa.

Seuraavat attribuutit jäävät käyttöön {Products}-tagille, kun tuotesuodattimet ovat käytössä:

  • type
  • list_type
  • list_classes
  • classes
  • helper

{Products}-tagin aliakset (esim. {CategoryProducts}, {DiscountProducts}, jne.) toimivat samoin kuin aiemminkin. Näitä tageja ei ole mahdollista käyttää tuotesuodattimien kanssa.

Tuoteominaisuuksien näyttäminen tuotesivulla

MyCashflow'n sisäinen Barebones-oletusteema sisältää valmiin tuen ominaisuudelle.

Tuotteen ominaisuuksien arvot on mahdollista asettaa näkymään tuotesivulla tuotesuodattimien Näytä tuoteominaisuutena tuotesivulla -asetuksen avulla.

Lisää seuraava merkkaus tuotteen sivupohjassa kohtaan, jossa haluat näyttää tuoteominaisuudet:

{ProductFeatures(
  helper: {{
    {ProductAttributeValues(
      before: {{ <p class="ProductAttribute-{ProductAttributeId}"> }},
      after: {{ </p> }}
    )}
  }}
)}

Alla esimerkin osat selitettynä:

  • Tuotteen ominaisuudet sisältävä lista laaditaan {ProductFeatures}-tagilla. Jokaisen ominaisuuden esitysmuoto määritellään helper-attribuutissa.
  • {ProductAttributeValues} tulostaa oletusarvoisesti ominaisuuden arvot pilkuilla eroteltuna listana.

    Voit myös itse määrittää erotinmerkin käyttämällä separator-attribuuttia tai määrittää jokaisen arvon merkkauksen helper-attribuutin avulla.

  • {ProductAttributeId} tagilla lisätään jokaisen ominaisuuden kohdalle ominaisuuden tunniste, joka määritellään hallintatyökalussa. Tietoa voidaan käyttää esimerkiksi CSS-tyylien tai skriptien laadintaan.