Kategorieansicht bei Klick auf Hauptkategorie li class="p50 "

[reddwarf]

Hallo,

ich ändere gerade die komplette Menüführung im Shop.
Für jeden Druckerhersteller habe ich deshalb das Menü in Farb- SW-Laser und Tinten unterteilt.
Ausserdem hab ich die Option, dass Unterkategorien angezeigt werden, angeschaltet.
Diese werden nun leider mit einem unnötigem Umbruch dargestellt.
Ich hätte die drei Unterkategorien gern nebeneinander.
Dazu habe ich mit dem Parameter li class="50 " rumgespielt.
Aber egal, welchen Wert ich für width angebe, die dritte Kategorie wird immer nach unten verschoben.
Die drei Unterkategorien nebeneinander wären besser.
Jemand eine Idee?

Gruss Mario

 

[Thomas_S]

AW: Kategorieansicht bei Klick auf Hauptkategorie li class="p50 "

Das bekommst du allein mit Änderungen in den css Dateien nicht hin, dazu müssen die CSS Klassen anders "verteilt" werden und das klappt nur über Änderungen am Template.

 

[reddwarf]

AW: Kategorieansicht bei Klick auf Hauptkategorie li class="p50 "

Hallo,

danke für den Tip.
Hast du vielleicht noch einen Tip, wo ich da ansetzen muss?
Zwei Kategorien stellt der Shop nebeneinander dar, die Dritte rutscht immer nach unten, egal wie schmal ich die Container mache.

 

[Thomas_S]

AW: Kategorieansicht bei Klick auf Hauptkategorie li class="p50 "

Du hast Shopversion 3.15, da kenn ich die Templatestruktur nicht. In Version 3.16 müsste in der Datei suche_header.tpl die Ausgabe der Unterkategorien angepasst werden. Der Bereich der geändert werden müsste fängt bei Version 3.16 mit

{if $oUnterKategorien_arr|@count > 0 && $Einstellungen.navigationsfilter.artikeluebersicht_bild_anzeigen != "N"}

an.

Sollte das in 3.15 auch so sein, poste doch mal das komplette if also von {if $oUnterkategorien_arr ....} bis zum dazugehörigen {/if}.

 

[reddwarf]

AW: Kategorieansicht bei Klick auf Hauptkategorie li class="p50 "

{if $oUnterKategorien_arr|@count > 0 && $Einstellungen.navigationsfilter.artikeluebersicht_bild_anzeigen != "N"} <ul class="category_subcategories hlist">
{foreach name=unterkats from=$oUnterKategorien_arr item=Unterkat}
<li class="p50 {if $smarty.foreach.unterkats.index%2==0 && $smarty.foreach.unterkats.index>0}clear{/if}">
<div class="category_wrapper clearall child {if $smarty.foreach.unterkats.index%2==0}first{else}last{/if}">
<ul class="category_item">
<li class="img">
{if $Einstellungen.navigationsfilter.artikeluebersicht_bild_anzeigen == "B" || $Einstellungen.navigationsfilter.artikeluebersicht_bild_anzeigen == "BT"}
<a href="{$Unterkat->cURL}"><img alt="{$Unterkat->cName}" src="{$Unterkat->cBildURL}" /></a>
{/if}
</li>
<li class="desc">
{if $Einstellungen.navigationsfilter.artikeluebersicht_bild_anzeigen == "Y" || $Einstellungen.navigationsfilter.artikeluebersicht_bild_anzeigen == "BT"}
<h2><a href="{$Unterkat->cURL}">{$Unterkat->cName}</a></h2>
{/if}
{if $Einstellungen.navigationsfilter.unterkategorien_beschreibung_anzeigen == "Y"}
<p class="item_desc">{$Unterkat->cBeschreibung|strip_tags|truncate:45}</p>
{/if}
{if $Einstellungen.navigationsfilter.unterkategorien_lvl2_anzeigen == "Y"}
{if isset($Unterkat->Unterkategorien) && $Unterkat->Unterkategorien|@count > 0}
{foreach from=$Unterkat->Unterkategorien item=UnterUnterKat}
<p>&bull; <a href="{$UnterUnterKat->cURL}">{$UnterUnterKat->cName}</a></p>
{/foreach}
{/if}
{/if}
</li>
</ul>
</div>
</li>
{/foreach}
</ul>
{/if}

Das ist der Code aus der suche_header.tpl.

Ich habe auch schon ein wenig rumgespielt und rausgefunden, was den Umbruch verursacht.
Die einzelnen Kategorieboxen kriegen list.p50 zugewiesen. Die letzte aber list.p50 clear. Im clear steht clear: both. Wenn ich das deaktiviere, rutscht die Box nach oben. Dann würde nur noch ein Padding fehlen.

 

[reddwarf]

AW: Kategorieansicht bei Klick auf Hauptkategorie li class="p50 "

<li class="p50 {if $smarty.foreach.unterkats.index%2==0 && $smarty.foreach.unterkats.index>0}clear{/if}">

Die könnte man ändern. Wenn ich eine eigene clear Funktion definiere, bzw. das clear einfach raus nehme.

 

[reddwarf]

AW: Kategorieansicht bei Klick auf Hauptkategorie li class="p50 "

<li class="p50 {if $smarty.foreach.unterkats.index%2==0 && $smarty.foreach.unterkats.index>0}clear{/if}">

geändert in

<li class="p50 {if $smarty.foreach.unterkats.index%3==0 && $smarty.foreach.unterkats.index>0}clear{/if}">

Dann noch .p50 auf 33% width.
Dann fehlt nur noch das Padding zwischen zweiter und dritter Kategorie.

 

[Thomas_S]

AW: Kategorieansicht bei Klick auf Hauptkategorie li class="p50 "

An der Stelle hat sich also nichts getan in 3.16 🙂

Du musst nur die ersten 2 Zeilen im foreach anpassen:

<li class="p33{if $smarty.foreach.unterkats.index%3==0 && $smarty.foreach.unterkats.index>0} clear{/if}">
<div class="category_wrapper clearall child{if $smarty.foreach.unterkats.index%3==0} first{elseif $smarty.foreach.unterkats.index%3==2} last{/if}">

Außerdem solltest du in den CSS Dateien die Klasse p33 auf 33.3333% ändern.

Edit: hast es ja schon fast alleine hinbekommen 😉

 

[reddwarf]

AW: Kategorieansicht bei Klick auf Hauptkategorie li class="p50 "

Jep, hab ich wohl 🙂
Aber nur fast. Der Abstand zwischen Black und Tinte ist noch kleiner als der Abstand der ersten beiden Boxen.
Ne Idee?

 

[Thomas_S]

AW: Kategorieansicht bei Klick auf Hauptkategorie li class="p50 "

Ja, die Klassen first und last sind an der falschen Stelle, sprich am falschen div

 

[reddwarf]

AW: Kategorieansicht bei Klick auf Hauptkategorie li class="p50 "

.category_wrapper.child {
margin: 5px;
}
.category_wrapper.child.last {
margin: 5px;
}

so geht es.
Danke!
Schönen Restfeiertag!