Mit dem $wsNavigation Modul können Sie den aktuellen Navigationspfad (Breadcrumb) des Kunden im Shop auslesen und anzeigen. Der Breadcrumb zeigt dem Kunden, wo er sich in der Kategoriestruktur befindet, und ermöglicht eine einfache Navigation zu übergeordneten Kategorien.

Inhaltsverzeichnis

1 Modulübersicht
2 Templates
3 Variablen
- 3.1 $wsNavigation.path
  - 3.1.1 $wsNavigation.path[$i].type
  - 3.1.2 $wsNavigation.path[$i].object
4 Methoden
5 Aktionen
6 Beispiele
- 6.1 Beispiel für die Anzeige des Breadcrumbs
- 6.2 Beispiel für Verlinkungen erzeugen
7 Weiterführende Links

Modulübersicht

Beispiel / Ausschnitt über $wsNavigation

{{= $wsNavigation | json }}

JSON-Ausgabe

{
  "path": [
    {
      "type": "category",
      "object": {
        "id": "...",
        "name": "...",
        "descr": "...",
        "active": "...",
        "hidden": false,
        "productsCount": 0,
        "custom": { },
        "timestampCreatedAt": "...",
        "timestampUpdatedAt": "...",
        "productAssignmentType": "...",
        "productRules": "..."
      }
    }
  ]
}

Variablen in der Übersicht

Variable	Typ	Beschreibung

Variable	Typ	Beschreibung
`path`	array	Pfad im Kategoriebaum, der angibt, wohin man im Shop navigiert hat.
`[$i].type`	string	Typ der entsprechenden Position im Pfad.
`[$i].object`	map	Kategorie-bzw. Produkt-Map.

Hinweis: Die Eigenschaften von object hängen vom type ab:

Bei type category stehen alle Eigenschaften aus $wsCategories zur Verfügung.
Bei type product stehen alle Eigenschaften aus $wsProducts zur Verfügung.
Nur das letzte Element im Pfand kann vom Typ product sein.

Templates

Der Breadcrumb kann in jedem bleibigen Template integriert werden.

Variablen

$wsNavigation.path

Liste der Navigationselemente (Breadcrumb) von der Startseite bis zur aktuellen Position.

Pfad: {{= $wsNavigation.path | json }}

$wsNavigation.path[$i].type

Gibt den Typ der Position im Pfad aus: "category" oder "product".

Typ: {{= $wsNavigation.path[0].type }}

$wsNavigation.path[$i].object

Gibt die Kategorie- bzw. Produkt-Map aus. Bei Kategorien entspricht dieser der Category-Map, bei Produkten der Product-Map. So kann auf Eigenschaften wie name, id oder custom zugegriffen werden.

Name: {{= $wsNavigation.path[0].object.name }}

Methoden

Für $wsNavigation stehen keine Methoden zur Verfügung.

Aktionen

Für $wsNavigation stehen keine Aktionen zur Verfügung.

Beispiele

Beispiel für die Anzeige des Breadcrumbs

In diesem Beispiel wird mittels des $wsNavigation Moduls die aktuelle Position des Shop-Kunden in der Menüstruktur der gerade besuchten Seite angezeigt.

{{ foreach $part in $wsNavigation.path }}
    {{ var $url = "" }}
    {{ if $part.type == "product" }}
        {{ $url = $wsViews.url("Product", {productId: $part.object.id}) }}
    {{ else }}
        {{ $url = $wsViews.url("Category", {id: $part.object.id}) }}
    {{ /if }}
   <span itemprop="title">{{= $part.object.name }}</span>
{{ /foreach }

Beispiel für Verlinkungen erzeugen

In diesem Beispiel wird gezeigt wie das letzte Element eines Breadcrumbs mit oder ohne Verlinkung erzeugt wird.

{{ foreach $part in $wsNavigation.path }}
    {{ var $url = "" }}
    ...
    {{ var $last = $part is $wsNavigation.path|last }}
   {{ if not $last }}<a href="{{= $url }}" itemprop="url">{{/if}}
      <span itemprop="title">{{= $part.object.name }}</span>
   {{ if not $last }}</a>{{/if}}
{{ /foreach }}

$wsNavigation