typo3 shop mit tt_products: how to 3. Teil

Der Beispielshop für dieses Tutorial befindet sich hier.

Damit die Combobox für die Länderauswahl angezeigt wird und der Marker ###PERSON_COUNTRY_CODE### im tt_products Template ersetzt wird muss zunächst die Extension Static Info Tables installiert werden. Danach kommt folgender Typoscript Code in die Constants des Extension Templates:

# Damit die Combobox für die Länderauswahl angezeigt wird
plugin.tt_products.useStaticInfoCountry = 1

Wer die Combox auf Deutsch haben möchte, muss noch zusätzlich die Erweiterung Static Info Tables (de) installieren. Um diese deutschen Bezeichnungen in die Datenbank zu bekommen, muss der Installationsprozess vollständig durchgeführt werden. Nach dem Import der Extension muss noch der Menüpunkt UPDATE! des Extension Managers gewählt werden. Dort wird dann auf Import geklickt und erst dann stehen die deutschen Bezeichnungen auch tatsächlich in der Datenbank.Der Menüpunkt UPDATE! im Extension Manager

In meinem Beispiel wird der Versand ausschließlich nach Österreich angeboten. Wer mehrere Länder zur Auswahl hat, kann durch folgenden Typoscript Code in den Constants erreichen, dass das eigene Land (hier Österreich) als Ausgangswert der Combobox gesetzt wird. Durch nachsehen in den Datenbanktabellen von Static Info Tables sind die Ländercodes relativ leicht zu herauszufinden.

# Default Sprache festlegen
plugin.tx_staticinfotables_pi1.languageCode = AT

# Default Land festlegen
plugin.tx_staticinfotables_pi1.countryCode = AUT

# Default Country Zone festlegen
plugin.tx_staticinfotables_pi1.countryZoneCode = AT-3

# Default Währung festlegen
plugin.tx_staticinfotables_pi1.currencyCode = EUR

Als nächstes werden Bezahlungs- und Versandoptionen konfiguriert. Ich habe folgenden Code im Typoscript Setup um meine 3 Bezahlungsmethoden festzulegen:

### Bezahlungsoptionen ###

# Bezahlmethoden zurücksetzen
plugin.tt_products.payment >

# Eigene Bezahlmethoden festlegen
plugin.tt_products.payment {
  # Steuersatz
  TAXpercentage = 20
  
  # Bezahlung mit Rechnung
  10.title = Rechnung
  
  # Barzahlung
  20.title = Barzahlung
  
  # Bezahlung per Nachnahme
  30.title = Nachnahme
}

Entspechend dazu gibt es im HTML Template den Subpart ###MESSAGE_PAYMENT###. Hier können diverse Texte zu den einzelnen Methoden (###MESSAGE_PAYMENT_10###, ###MESSAGE_PAYMENT_20###, usw.) hinterlegt und optional angezeigt werden.

Dew weiteren werden die unterschiedlichen Versandmethoden angelegt. Bei mir sieht das so aus:

### Versandoptionen ###
plugin.tt_products.shipping {
  # Steuersatz
  TAXpercentage = 20
  
  # Titel
  10.title = Versand innerhalb Österreichs
 
  # Welche Länder sind in der Combobox zu sehen?
  # Hier nur Österreich
  10.where.static_countries = cn_iso_2 = 'AT'
 
  # Preis
  10.price = 4.50
  
  # Steuer bereits enthalten?
  10.TAXincluded = 1

  # Auswahl der Zahlungsmethoden Einschränken
  # Barzahlung oder Nachnahme bei Versand nicht möglich
  10.excludePayment = 20, 30
  
  20.title = Selbstabholer
  20.where.static_countries = cn_iso_2 = 'AT'
  20.price = 0
  20.TAXincluded = 1
  # Rechnung und Nachnahme bei Selbstabholer nicht möglich
  20.excludePayment = 10, 30
  
  30.title = Nachnahme innerhalb Österreichs
  30.where.static_countries = cn_iso_2 = 'AT'
  30.price = 8.50
  30.TAXincluded = 1
  # Rechnung und Barzahlung bei Nachnahme nicht möglich
  30.excludePayment = 10, 20
}

Wie hier zu sehen hängen die Bezahlungs- und Versandoptionen zusammen. Für jede Versandoption wird definiert welche Bezahlungsoption möglich ist. Bezahlungsoptionen die nicht verfügbar sind, werden mit der Option "excludePayment" aus der Liste entfernt.

In meinem HTML Template für die Hauptseite gibt es folgenden Marker: ###CONTENT_RIGHT###
Diesen Marker nutze ich um via Typoscript den Kategoriebaum und darunter den Miniwarenkorb einzubauen.

Damit die Kategorien wie erwünscht angezeigt werden, muss zuvor die Option pageAsCategory=0 im Extension Manager bei der Extension tt_products ausgewählt werden:

Der Code für den Kategoriebaum sieht dann so aus:

page.10.marks.CONTENT_RIGHT = COA
page.10.marks.CONTENT_RIGHT { 
  # Kategorienbaum einfügen
  10 < plugin.tt_products
  10.code >
  10.code = LISTCAT
  # Sysfolder mit den Kategorien
  10.pid_list = {$id_shopsyskategorien}
  10.expAll = 1
}

Zusätzlich zu den einzelnen Kategorien wollte ich noch einen Button "alle Produkte" als ersten Punkt in der Kategorieliste anzeigen lassen. Vielleicht gibt es hierfür eine einfachere Lösung, aber ich habe folgenden Condition im Setup stehen:

# Condition damit der "alle Produkte" Button in der Kategorieübersicht funktioniert
[globalVar = TSFE:id = {$id_shopkategorien}]
page.10.marks.CONTENT_RIGHT {
  8 = TEXT
  8 {
    if.isFalse.data = GPvar:tt_products|cat
    wrap = <div id="tx-ttproducts-pi1-listcat-allproducts-off"><ul id="cat1"><li> | </li></ul></div>
    value = Alle Produkte
    typolink.parameter = {$id_shopkategorien} - act -
  }

  9 = TEXT
  9 {
    if.isTrue.data = GPvar:tt_products|cat
    wrap = <div id="tx-ttproducts-pi1-listcat-allproducts-off"><ul id="cat1"><li> | </li></ul></div>
    value = Alle Produkte
    typolink.parameter = {$id_shopkategorien}
  }  
}
[else]
page.10.marks.CONTENT_RIGHT {
  9 = TEXT
  9 {
    wrap = <div id="tx-ttproducts-pi1-listcat-allproducts-off"><ul id="cat1"><li> | </li></ul></div>
    value = Alle Produkte
    typolink.parameter = {$id_shopkategorien}
  }  
}
[global]

Mit dieser Condition erreiche ich, dass der Button "alle Produkte" als oberster Punkt eingefügt wird. Der Button ist aktiv und der Pfeil davor grün falls keine Kategorie ausgewählt wurde und wir uns auf der Seite mit der Kategorieliste befinden. Ansonsten ist der Button passiv und der Pfeil vor dem Text hellgrau.

Darunter kann dann der Miniwarenkorb erscheinen:

page.10.marks.CONTENT_RIGHT {
  20 < plugin.tt_products
  20.code >
  20.code = OVERVIEW
  20.pid_list = {$id_shopsysprodukte}
}

Wer möchte kann die beiden Elemente (Kategoriebaum und Miniwarenkorb) noch mit einem DIV-Tag ummantel und danach für die eigene Webseite stylen.

Im nächsten Beitrag werde ich zeigen wie man Übergeordnete Kategorien anlegt und Produkte und Kategorien manuell ordnen kann.