Produktliste, Listitem_Grid.tpl, List.tpl

Hallo Zusammen

Ich versuche gerade in der Produktliste drei <li> in einer box darzustellen. Eine solche Lösung gibt es bereits in Oxid, nur kriege ich es nicht hin, dass ganze in listitem_grid.tpl darzustellen.

        [{if $oView->hasVisibleSubCats()}]
            [{assign var="iSubCategoriesCount" value=0}]
            [{oxscript include="js/widgets/oxequalizer.js" priority=10 }]
            [{oxscript add="$(function(){oxEqualizer.equalHeight($( '.subcatList li .content' ));});"}]
            <ul class="subcatList clear">
                <li>
                [{foreach from=$oView->getSubCatList() item=category name=MoreSubCat}]
                    [{ if $category->getContentCats() }]
                        [{foreach from=$category->getContentCats() item=ocont name=MoreCms}]
                            [{assign var="iSubCategoriesCount" value=$iSubCategoriesCount+1}]
                            <div class="box">
                            <h3>
                                <a id="moreSubCms_[{$smarty.foreach.MoreSubCat.iteration}]_[{$smarty.foreach.MoreCms.iteration}]" href="[{$ocont->getLink()}]">[{ $ocont->oxcontents__oxtitle->value }]</a>
                            </h3>
                            <ul class="content"></ul>
                            </div>
                        [{/foreach}]
                    [{/if }]
                    [{if $iSubCategoriesCount%4 == 0}]
                 </li>
				 <li>
                    [{/if}]
                    [{if $category->getIsVisible()}]
                        [{assign var="iSubCategoriesCount" value=$iSubCategoriesCount+1}]
                        [{assign var="iconUrl" value=$category->getIconUrl()}]
                            <div class="box">
                                <h3>
                                    <a id="moreSubCat_[{$smarty.foreach.MoreSubCat.iteration}]" href="[{ $category->getLink() }]">
                                        [{$category->oxcategories__oxtitle->value }][{ if $oView->showCategoryArticlesCount() && ($category->getNrOfArticles() > 0) }] ([{ $category->getNrOfArticles() }])[{/if}]
                                    </a>
                                </h3>
                                [{if $category->getHasVisibleSubCats()}]
                                    <ul class="content">
                                        [{if $iconUrl}]
                                            <li class="subcatPic">
                                                <a href="[{ $category->getLink() }]">
                                                    <img src="[{$category->getIconUrl() }]" alt="[{ $category->oxcategories__oxtitle->value }]">
                                                </a>
                                            </li>
                                        [{/if}]
                                        [{foreach from=$category->getSubCats() item=subcategory}]
                                            [{if $subcategory->getIsVisible() }]
                                                [{ foreach from=$subcategory->getContentCats() item=ocont name=MoreCms}]
                                                    <li>
                                                        <a href="[{$ocont->getLink()}]"><strong>[{ $ocont->oxcontents__oxtitle->value }]</strong></a>
                                                    </li>
                                                [{/foreach }]
                                                <li>
                                                    <a href="[{ $subcategory->getLink() }]">
                                                        <strong>[{ $subcategory->oxcategories__oxtitle->value }]</strong>[{ if $oView->showCategoryArticlesCount() && ($subcategory->getNrOfArticles() > 0) }] ([{ $subcategory->getNrOfArticles() }])[{/if}]
                                                    </a>
                                                </li>
                                             [{/if}]
                                        [{/foreach}]
                                    </ul>
                                [{else}]
                                    <div class="content catPicOnly">
                                        <div class="subcatPic">
                                        [{if $iconUrl}]
                                            <a href="[{ $category->getLink() }]">
                                                <img src="[{$category->getIconUrl() }]" alt="[{ $category->oxcategories__oxtitle->value }]">
                                            </a>
                                         [{/if}]
                                        </div>
                                    </div>
                                [{/if}]
                            </div>
                    [{/if}]
                [{if $iSubCategoriesCount%4 == 0}]
                </li>
                <li>
                [{/if}]
                [{/foreach}]
                </li>
            </ul>
        [{/if}]	

list.tpl (hier versuche ich aus dem obigen block infos zu holen wie man das macht, scheitere jedoch)

[{if $products|@count gt 0}]
    <ul class="[{$type}]View clear" id="[{$listId}]">

        [{assign var="currency" value=$oView->getActCurrency() }]
        [{foreach from=$products item=_product name=productlist}]
            [{assign var="_sTestId" value=$listId|cat:"_"|cat:$smarty.foreach.productlist.iteration}]
            <li class="productData">
                [{oxid_include_widget cl="oxwArticleBox" _parent=$oView->getClassName() nocookie=1 _navurlparams=$oViewConf->getNavUrlParams() iLinkType=$_product->getLinkType() _object=$_product anid=$_product->getId() sWidgetType=product sListType=listitem_$type iIndex=$_sTestId blDisableToCart=$blDisableToCart isVatIncluded=$oView->isVatIncluded() showMainLink=$showMainLink recommid=$recommid owishid=$owishid toBasketFunction=$toBasketFunction removeFunction=$removeFunction altproduct=$altproduct inlist=$_product->isInList() skipESIforUser=1}]       			 
			</li>
            [{if ($type eq "infogrid" AND ($smarty.foreach.productlist.last) AND ($smarty.foreach.productlist.iteration % 2 != 0 )) }]
                <li class="productData"></li>
            [{/if}]
        [{/foreach}]

    </ul>
[{/if}]

Ich hoffe, dass mir jemand helfen kann.

oxid ce 4.8.1

Beste Grüsse
Avni

Ich möchte dasselbe erreichen wie hier:

http://www.strenesse.com/Women/Jacken-Maentel/

hat jemand schon mal sowas umgesetzt?

Weiss den niemand wie man nach 4 Produkten so einen Bogenstrich macht?

[QUOTE=avnikaba;137206]Weiss den niemand wie man nach 4 Produkten so einen Bogenstrich macht?[/QUOTE]

Sorry, ich meine nicht Bogenstrich sondern border-bottom… :slight_smile:

     [{ if $product-&gt; ?.....? 3 }]
    	   [{foreach from=$products item=_product name=productlist}]
       		   [{assign var="_sTestId" value=$listId|cat:"_"|cat:$smarty.foreach.productlist.iteration}]
       		    &lt;li class="productData"&gt;
                [{oxid_include_widget cl="oxwArticleBox" _parent=$oView-&gt;getClassName() nocookie=1 _navurlparams=$oViewConf-&gt;getNavUrlParams() iLinkType=$_product-&gt;getLinkType() _object=$_product anid=$_product-&gt;getId() sWidgetType=product sListType=listitem_$type iIndex=$_sTestId blDisableToCart=$blDisableToCart isVatIncluded=$oView-&gt;isVatIncluded() showMainLink=$showMainLink recommid=$recommid owishid=$owishid toBasketFunction=$toBasketFunction removeFunction=$removeFunction altproduct=$altproduct inlist=$_product-&gt;isInList() skipESIforUser=1}]       			 
  		    &lt;/li&gt;
  	
        	 [{if ($type eq "infogrid" AND ($smarty.foreach.productlist.last) AND ($smarty.foreach.productlist.iteration % 2 != 0 )) }]
                &lt;li class="productData"&gt;&lt;/li&gt;
        	 [{/if}]
    	  [{/foreach}]
     [{else}]
      &lt;div class="listline"&gt;  &lt;/div&gt;
     [{/if}]

Kann denn keiner Helfen?

Vielen Dank und beste Grüsse
Avni

Die Lösung ist in deinem letzten Codeblock eh schon angedeutet: in der Schleife mit dem modulo-operator % abfragen, ob die gewünschte anzahl Listenelemente erreicht ist. Wenn ja, wird ein Strich eingefügt z.B. in der Form, daß du dem aktuellen LI-element eine zusätzliche Klasse gibst.

Du würdest also in der Schleife etwa so eine Abfrage einbauen:

[{if ($smarty.foreach.productlist.iteration % 3) == 0 }]
<li class=“productData mitTrennlinie”></li>
[{else}]
<li class=“productData”></li>
[{/if}]

In dem Beispiel würde jedes dritte LI-element zusätzlich mit der Klasse “mitTrennlinie” versehen, der du dann im CSS beispielsweise ein border-bottom zuweisen könntest.

Hallo m431342,

Vielen Dank für deine Hilfe.

Ich möchte erreichen, dass nach drei Produkten unter allen so ein border-bottom erscheint. so wie hier: http://www.strenesse.com/Women/Jacken-Maentel/

bei strenesse kommt nämlich:

li
li
li
border über den ganzen content
li
li
li
border …
li
li
li
border…
etc.

das möchte ich ebenfalls erreichen.

Beste Grüsse
Avni

Ja, das geht doch problemlos mit dem aufgezeigten Lösungsweg. Anstatt einer anderen Klasse setzt du halt ein komplett anderes Element ein.

Zu beachten wäre aber, daß ein UL-element nichts anderes als LI-elemente direkt enthalten darf, d.h. zwischen LI-elementen sollte kein anderes eingefügt werden, sonst ist das HTML fehlerhaft.

Du kannst aber innerhalb eines LI-elements ein anderes einfügen, also so:
li
li trennelement
li
usw.

Als Trennelement kannst du jedes Blockelement nehmen und mit CSS wie gewünscht darstellen.

Das sind aber alles ganz grundlegende Dinge…

Im übrigen verwendet der angegeben Shop kein UL sondern DIVs. Das solltest du auch machen, denn das UL/LI ist eher für regelmäßige Listen gedacht.

so in etwa. bin ich auf dem richtigen weg?

[{if $products|@count gt 0}]
<div class=“[{$type}]View clear” id=“[{$listId}]”>
[{assign var=“currency” value=$oView->getActCurrency() }]
[{foreach from=$products item=_product name=productlist}]
[{assign var=“sTestId" value=$listId|cat:"”|cat:$smarty.foreach.productlist.iteration}]
<li class=“productData”>
[{oxid_include_widget cl=“oxwArticleBox” _parent=$oView->getClassName() nocookie=1 _navurlparams=$oViewConf->getNavUrlParams() iLinkType=$_product->getLinkType() _object=$_product anid=$product->getId() sWidgetType=product sListType=listitem$type iIndex=$_sTestId blDisableToCart=$blDisableToCart isVatIncluded=$oView->isVatIncluded() showMainLink=$showMainLink recommid=$recommid owishid=$owishid toBasketFunction=$toBasketFunction removeFunction=$removeFunction altproduct=$altproduct inlist=$_product->isInList() skipESIforUser=1}]
</li>
[{if ($type eq “infogrid” AND ($smarty.foreach.productlist.last) AND ($smarty.foreach.productlist.iteration % 2 != 0 )) }]
<li class=“productData”></li>
[{/if
}]
[{if ($smarty.foreach.productlist.iteration % 3) == 0 }]
<div class=“listline”></div>
[{else}]
<div class=“productData0”></div>
[{/if}]
[{/foreach}]
</div>
[{/if}]

<style type=“text/css”>
.listline {
border-top: 1px solid #AAAAAA;
clear: both;
float: left;
padding-bottom: 20px;
width: 100%;
}
</style>