Produktlisting erweitern um Hersteller

Hallo, ich versuche gerade im Product Listing über dem Artikelnamen auch den Hersteller Namen anzuzeigen und die Produktbeschreibung im Listing zu entfernen. Das mit der Produktbeschreibung hat ja geklappt im box.minimal.tpl, aber den Hersteller hinzuzufügen bekomme ich einfach nicht hin.

Hat jemand einen Tipp für mich?

Servus,

in dem u.a. Beispiel habe ich das in der Datei „frontend/listing/product-box/box-basic.tpl“ gemacht.
Hier kannst Du den folgenden Block wie folgt erweitern:

`{* Product name *}
{block name='frontend_listing_box_article_name'}
                <a href="{url controller='listing' action='manufacturer' sSupplier=$sArticle.supplierID}"
               target="{$sArticle.target}"
               class="content--link link--supplier"
               title="{$sArticle.supplierName|escape}">
                {$sArticle.supplierName|escape}
            </a>      
            
    {$smarty.block.parent}        
{/block}`

Liebe Grüße

Heiko

Hallo Heiko,

vielen Dank das funktioniert super. Wenn ich noch eine Frage stellen darf (bin ganz neu in der Thematik).
Auf der Seite zeigt er mir jetzt natürlich den Hersteller unformatiert links an, durch das hinzufügen der class=„content–link link–supplier“ müsste ich doch eigentlich festlegen können wie der Hersteller dargestellt wird.
Ich habe das jetzt in der less Datei versucht, aber es ändert sich nichts. Kannst Du mir sagen wo ich da genau eingreifen müsste um das Format zu ändern?

Danke und Grüße

Holger

Hallo Holger,

frage einfach, dafür ist das Forum ja da ;-).

In der Less-Datei bist Du schon richtig.
Ich gehe mal davon aus, dass die Less-Datei richtig eingebunden ist.
Bei der all.less-Datei würde das automatisch passieren.

Wenn Du folgendes in der Less-Datei schreibst, dann sollte es funktionieren:

.product--box {
    .content--link {
       &.link--supplier {
             font-size:14px;
       }
    }
}

Die Klasse .product–box habe ich als erstes geschrieben, da sich die Anpassung sonst auch auf die Detailseite auswirken würde, wenn Du den Hersteller dort auch stehen hast.

Falls das nicht funktioniert, dann kannst Du auch gerne mal den Code posten oder den Link zu der Seite, falls die schon online ist, dann schaue ich es mir mal an.

Gruß

Heiko

Hallo Heiko,

irgendwie hänge ich gerade, entweder ich bin der ganz falschen Datei oder ich mache etwas falsch.
Ich poste hier mal die product.box-minimal-.less rein, in der müsste das doch eigentlich angepasst werden?
all. less

@import „_modules/global“;
@import „_modules/header“;
@import „_modules/main-navigation“;
@import „_modules/product-box“;
@import „_modules/product-boxemotion“;
@import „_modules/product-boxbasic“;
@import „_modules/product-boxminimal“;
@import „_modules/product-boximage“;
@import „_modules/product-boxlist“;
@import „_modules/detail“;
@import „_modules/blog“;
@import „_modules/cart“;
@import „_modules/footer“;
@import „_modules/listing“;
@import „_modules/sidebar“;

@font-face {
font-family: ‚museo_sans_rounded100‘;
src: url(’_fonts/MuseoSansW01-Rounded100.eot’); /* IE9 Compat Modes /
src: url(’_fonts/MuseoSansW01-Rounded100.eot?#iefix’) format(‚embedded-opentype‘), /
IE6-IE8 /
url(’_fonts/MuseoSansW01-Rounded100.woff2’) format(‚woff2‘), /
Super Modern Browsers /
url(’_fonts/MuseoSansW01-Rounded100.woff’) format(‚woff‘), /
Pretty Modern Browsers /
url(’_fonts/MuseoSansW01-Rounded100.ttf’) format(‚truetype‘), /
Safari, Android, iOS /
url(’_fonts/MuseoSansW01-Rounded100.svg#svgFontName’) format(‚svg‘); /
Legacy iOS */
}

@font-face {
font-family: ‚museo_sans_rounded300‘;
src: url(’_fonts/MuseoSansW01-Rounded300.eot’); /* IE9 Compat Modes /
src: url(’_fonts/MuseoSansW01-Rounded300.eot?#iefix’) format(‚embedded-opentype‘), /
IE6-IE8 /
url(’_fonts/MuseoSansW01-Rounded300.woff2’) format(‚woff2‘), /
Super Modern Browsers /
url(’_fonts/MuseoSansW01-Rounded300.woff’) format(‚woff‘), /
Pretty Modern Browsers /
url(’_fonts/MuseoSansW01-Rounded300.ttf’) format(‚truetype‘), /
Safari, Android, iOS /
url(’_fonts/MuseoSansW01-Rounded300.svg#svgFontName’) format(‚svg‘); /
Legacy iOS */
}

Hallo Heiko,

das hier wäre die all.less die ja aber nur den Font vorgibt und nicht z.B. die Position wie Mittig.

@import „_modules/global“;
@import „_modules/header“;
@import „_modules/main-navigation“;
@import „_modules/product-box“;
@import „_modules/product-boxemotion“;
@import „_modules/product-boxbasic“;
@import „_modules/product-boxminimal“;
@import „_modules/product-boximage“;
@import „_modules/product-boxlist“;
@import „_modules/detail“;
@import „_modules/blog“;
@import „_modules/cart“;
@import „_modules/footer“;
@import „_modules/listing“;
@import „_modules/sidebar“;

@font-face {
font-family: ‚museo_sans_rounded100‘;
src: url(’_fonts/MuseoSansW01-Rounded100.eot’); /* IE9 Compat Modes /
src: url(’_fonts/MuseoSansW01-Rounded100.eot?#iefix’) format(‚embedded-opentype‘), /
IE6-IE8 /
url(’_fonts/MuseoSansW01-Rounded100.woff2’) format(‚woff2‘), /
Super Modern Browsers /
url(’_fonts/MuseoSansW01-Rounded100.woff’) format(‚woff‘), /
Pretty Modern Browsers /
url(’_fonts/MuseoSansW01-Rounded100.ttf’) format(‚truetype‘), /
Safari, Android, iOS /
url(’_fonts/MuseoSansW01-Rounded100.svg#svgFontName’) format(‚svg‘); /
Legacy iOS */
}

@font-face {
font-family: ‚museo_sans_rounded300‘;
src: url(’_fonts/MuseoSansW01-Rounded300.eot’); /* IE9 Compat Modes /
src: url(’_fonts/MuseoSansW01-Rounded300.eot?#iefix’) format(‚embedded-opentype‘), /
IE6-IE8 /
url(’_fonts/MuseoSansW01-Rounded300.woff2’) format(‚woff2‘), /
Super Modern Browsers /
url(’_fonts/MuseoSansW01-Rounded300.woff’) format(‚woff‘), /
Pretty Modern Browsers /
url(’_fonts/MuseoSansW01-Rounded300.ttf’) format(‚truetype‘), /
Safari, Android, iOS /
url(’_fonts/MuseoSansW01-Rounded300.svg#svgFontName’) format(‚svg‘); /
Legacy iOS */
}

Hallo Holger,

Ich weiss jetzt nicht, ob Du dich ganz oben bei dem Dateinamen „product.box-minimal-.less“ nur verschrieben hast, da die Datei nicht in der all.less eingebunden wurde.

In der Datei all.less ist z.B. die less-Datei „product-boxbasic“ eigebunden worden.
Dann gehst Du zur Datei „less/_modules/product-boxbasic.less“. Bitte hier auch noch mal überprüfen, ob die Datei in der Du die Anweisung reinschreibst auch genauso in der Datei all.less steht und sich kein Schreibfehler eingeschlichen hat.

Dann kannst du die o.a. Anweisung dort eingeben (als Anweisung dann text-align:center") und nachdem der Cache gelöscht und das Theme kompiliert wurde sollten die Änderungen sichtbar sein.

Gruß Heiko

1 Like