MODUL: Aktive Kategorie hervorheben

[sgei]

Hallo liebe Gemeinde,

ich habe soeben das Modul von gunnART für modified eCommerce Shopsoftware angepasst.

Was steckt dahinter:

- die aktive Kategorie (wirklich nur die aktive!!!) kann besonders hervorgehoben werden (über CSS)
- leere Kategorien können versteckt werden
- es kann bestimmt werden, bis zu welcher Ebene der Kategoriebaum standardmäßig ausgeklappt sein soll

Hier ist die Einbauanleitung:

Anleitung zum Einbau der ShowCategory für modified eCommerce Shopsoftware

- die Änderungen beruhen auf dem Modul "gunnart_ShowCategoryMulti_01" von gunnART: xt:Commerce - geteilte Kategorien-Navigation
- als Basis für den Umbau habe ich mich auf den modified eCommerce Shopsoftware Shop in Version 1.03RC bezogen

Anleitung:
---------

1. Sichert zuerst folgende Dateien:

- xtc5/stylesheet.css
- xtc5/source/boxes.php
- xtc5/source/boxes/cateories.php
- xtc5/boxes/box_categories.html

2. Kopiert folgende Dateien auf den Server (alte überschreiben):

- xtc5/source/boxes/categories.php      (überschreiben)
- xtc5/source/inc/gunnart_Categories_inc.php   (neu)
- xtc5/boxes/box_categories.html      (überschreiben)

3. Erweiterung der Datei boxes.php im Verzeichnis xtc5/source/boxes.php

In der Datei: add_this_to_boxes.php.txt ist beschrieben was ihr in der boxes.php ergänzen sollt:

// Cache erzwingen? - erst auf "true" setzen, wenn alles fuktioniert

Code: PHP  [Auswählen]

define('FORCE_CACHE',false);

4. Erweiterung der stylesheet.css

Für jede Kategorieebene muss nach:

Code: CSS  [Auswählen]

ul#categorymenu li.level1 a:hover {
...
}

folgendes ergänzt werden:

Code: CSS  [Auswählen]

ul#categorymenu li.level1 a.Current {
        background-color: #ffcc00;
        color:#333;
}

Die Class a.Current bestimmt das Aussehen der gerade aktiven Kategorie bzw. Unterkategorie

In der Datei Änderungen_der_stylesheet_css.txt (im Zip) habe ich den ganzen Kategorieblock
aus der Original-styleheet.css (Version 1.03RC) bereits erweitert.

Wenn Ihr eine noch unveränderte Version modified eCommerce Shopsoftware 1.03RC installiert habt, könnt Ihr die Datei
_stylesheet.css einfach auf den Server kopieren und die originale Ersetzen (vorher natürlich
den "_" Unterstrich entfernen.

5. Konfiguration:

Die Konfiguration erfolgt in der Datei xtc5/source/boxes/categories.php

Code: PHP  [Auswählen]

$Konfiguration = array(
        'MinLevel'      => 2,
        'MaxLevel'      => 4,
        'HideEmpty'     => true,
        'ShowCounts'    => false,
        'CatNaviID'     => 'categorymenu'
);

- 'MinLevel': So viele Hierarchie-Stufen sind standardmäßig ausgeklappt
- 'MaxLevel': Tiefer als das lässt sich die Kategorien-Navi nicht ausklappen, bei false lässt sie sich “bis zum Ende” ausklappen
- 'HideEmpty': Leere Kategorien verstecken? Ja/Nein?
- 'ShowCounts': Anzahl der enthaltenen Produkte anzeigen? Ja/Nein?
Achtung! Das, was man im Admin-Bereich von wegen “Produkte zählen” festlegen kann, hat hier keinen Einfluss. Damit man bei einer Zweigeteilten Navi eben unabhängig voneinenander entscheiden kann, wo gezählt werden soll und wo nicht)
- 'CatNaviID': Die CSS-ID, welche die zurückgegebene Navi-Liste haben soll.

Das Thema "Aktive Kategorien hervorheben" wurde schon in folgenden Themen bearbeitet:

• ANLEITUNG: Aktive Kategorie hervorheben
• Aktive Kategorie hervorheben

Viel Spaß beim Probieren und frohe Weihnachten!

Steffen

[ Für Gäste sind keine Dateianhänge sichtbar ]



Linkback: https://www.modified-shop.org/forum/index.php?topic=3096.0

[Tomcraft]

Hi Steffen, da hast du dir aber Mühe gemacht!

Vielen Dank für's Teilen mit der Community. Ich hab das mal in die Modulecke verschoben.

Grüße

Torsten

[guensi]

Yep, da verneige ich mich doch mal, ein tolles Stück Arbeit und perfekt dokumentiert. Das hatte ich auch noch auf meiner persönlichen Roadmap, aber nach Sichtung der "Urfassung" hab ich das mal ganz hinten angestellt.

Ein fettes Lob und ein dickes Danke für diese Lösung.

[baustelle]

Ich sag auch schon mal DANKESCHÖN für das sehr nützliche Weihnachtsgeschenk, obwohl ich es erst nächstes Jahr beim Umstieg verwenden werde.

Greets,
Chris

[bakmaz]

Super habe es eingebaut und es läuft ohne Probleme, war in 15 min fertig.

Sag nochmal danke zu diesem schönen Weihnachtsgeschenk.

[Tomcraft]

Steffen, hast du evtl. noch einen Shop, wo wir das in Aktion bewundern können?

Grüße

Torsten

[sgei]

Hallo Torsten,

naja...wenn Du mich so lieb fragst

Also ich erstelle gerade für unseren ortsansässigen Faschingsclub einen kleinen Shop für den Kartenvorverkauf.

Der Shop ist zu finden unter: [Link entfernt auf Wunsch von sgei]

Allerdings ist der Shop noch im Aufbau!!! Also seid mit eurer Kritik nicht so streng.
Ich werde den Shop funktionell und grafisch Anfang Januar 2010 fertigstellen.

Steffen

[EDIT Tomcraft: Link entfernt auf Wunsch von sgei]

[Tomcraft]

Danke, nun hat man auch einen guten Eindruck davon.

Grüße

Torsten

[h-h-h]

Aktive Kategorie hervorheben steckt doch schon in modified eCommerce Shopsoftware halb drin.
xtc_show_category.inc.php

Code: PHP  [Auswählen]

        $categories_string .= $foo[$counter]['name'];

        if ( ($id) && (in_array($counter, $id)) ) {
                        //$categories_string .= '';
        }

Um die aktive Kategorie Fett hervorzuheben
Ersetzen mit:

Code: PHP  [Auswählen]

        if ( ($id) && (in_array($counter, $id)) ) {
                        $categories_string .= '<b>';
        }
        $categories_string .= $foo[$counter]['name'];

        if ( ($id) && (in_array($counter, $id)) ) {
                        $categories_string .= '</b>';
        }

MODUL: Aktive Kategorie hervorheben

Suche:

Code: PHP  [Auswählen]

                $categories_string .= '">';

Ersetze mit:

Code: PHP  [Auswählen]

                if ( ($id) && (in_array($counter, $id)) ) {$categories_string .= '" class="current'; }
                $categories_string .= '">';

Und schon lässt sich das Ganze mit der CSS-Klasse .current gestalten.

Gruß h-h-h

[kostnermo]

Hallo h-h-h,

ich hab das mal probiert. Ich bekomme es aber irgendwie nicht richtig per CSS angepasst, obwohl das Feld passt.
Einer der wenigen CSS Befehle die funktionieren ist "border", ich möchte aber gerne die Hintergrundfarbe ändern.
Hast du da einen Tipp für mich?

Grüße

Patrick

[h-h-h]

Hallo Patrick,
könnte ich einen Link zum testen bekommen?
Hast Du die neuen Definitionen auch am Ende der Stylesheet gemacht, damit die nicht überschrieben werden.

Gruß

h-h-h

[kostnermo]

Den Link hast du bekommen.
Habs jetzt mal am Ende der Stylesheet getestet mit Firebug, da tut sich bei mir jedoch auch nichts.
Bestimmt stell ich mich einfach blöd an.

Grüße

Patrick

[downset]

Bei mir funktioniert es wohl aber ich glaube da ist ein Denkfehler drin. Sobald ich die Kategorie wähle erscheint der Current Link -> OK

Wenn ich aber dann in dieser Kategorie ein Produkt als Detailansicht wähle verschwindet der Current Status, was ja nicht gewollt sein kann.

Gruß

Jens

[SupaRoyal]

Ist es auch möglich, dass nur die aktive Unterkategorie als aktiv markiert wird?
Also ohne, dass die Oberkategorie auch aktiv markiert ist?

Beispiel: (aktiv: fett / nicht aktiv: normal)

Kategorie 1
Kategorie 2
 - Kategorie 2a
 - Kategorie 2b
Kategorie 3

[justdoit]

Um nur die aktive Unterkategorie als aktiv zu markieren, habe ich die if-Bedingung weiter eingeschränkt.

Statt:

Code: PHP  [Auswählen]

if ( ($id) && (in_array($counter, $id)) ) {$categories_string .= '" class="current'; }

steht nun da:

Code: PHP  [Auswählen]

if ( $counter == $id[count($id)-1] ) {$categories_string .= '" class="current'; }

Damit wird die Klasse wirklich nur auf den aktuell ausgewählten Menüpunkt angewandt.

Im CSS setze ich nun  z.B. rechts eine rote Linie:

Code: CSS  [Auswählen]

ul#categorymenu li a.current {
        border-right: 3px solid red;
}

Oder um in jedem Menülevel noch die Hintergrundfarbe anzupassen, muss für jedes Level noch eine Ergänzung vorgenommen werden:

Code: CSS  [Auswählen]

ul#categorymenu li.level1 .current {
        background-color: #b0a090;
}
/* usw. bis */
ul#categorymenu li.level6 .current {
        background-color: #807060;
}

Mit gefällt das Menü allerdings besser, wenn dadurch der aktuelle Menüpunkt gekennzeichnet ist. Deswegen ja auch diese Lösung.