Neuigkeiten
  • Die modified eCommerce Shopsoftware ist kostenlos, aber nicht umsonst.
    Spenden
  • Damit wir die modified eCommerce Shopsoftware auch zukünftig kostenlos anbieten können:
    Spenden
  • Thema: Topartikel anpassen

    morgenstern

    • Fördermitglied
    • Beiträge: 169
    • Geschlecht:
    Topartikel anpassen
    am: 13. Februar 2020, 09:58:50
    Hallo Gemeinde,

    ich würde gern die Topartikel auf der Startseite anpassen. Jetzt ist es so, bei 4 Artikeln bleibt es stehen, und bei über 4 Artikeln ist es eine Art Laufband.

    Ich möchte 8 oder 12 Artikel  zwei- bzw. drei-reihig übereinander legen, ohne Laufband.
    Und es muss natürlich Responsive sein.

    Weis vielleicht jemand wie das geht?

    Viele Grüße
    Sylvio

    www.schweisstechnik-morgenstern.de

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

    morgenstern

    • Fördermitglied
    • Beiträge: 169
    • Geschlecht:
    Re: Topartikel anpassen
    Antwort #1 am: 13. Februar 2020, 10:11:51
    Also da wo steht:  Unsere Empfehlungen

    Sylvio

    hpzeller

    • Experte
    • Beiträge: 3.396
    • Geschlecht:
    Re: Topartikel anpassen
    Antwort #2 am: 13. Februar 2020, 22:35:58
    Hallo Sylvio,

    du verwendest ein Kauftemplate welches mit dem veralteten Bootstrap2 HTML-Framework programmiert wurde, da ist Hilfe nicht einfach, aber versuchen wir es mal, gibt es in deinem Template die Datei templates/bs24_elon/module/new_products_default.html, wenn ja, poste hier ihren kompletten Inhalt.

    Gruss
    Hanspeter

    morgenstern

    • Fördermitglied
    • Beiträge: 169
    • Geschlecht:
    Re: Topartikel anpassen
    Antwort #3 am: 14. Februar 2020, 07:45:48
    Hallo Hanspeter,

    hier der Code von der Datei:

    Code: PHP  [Auswählen]
    {config_load file="$language/lang_$language.conf" section="new_products"}
    {config_load file="$language/lang_$language.conf" section="index"}
    {config_load file="lang_`$language`.custom"}
    <h2 class="home-new">{if #heading_text_top# != ''}{#heading_text_top#}{else}{#heading_text#}{/if}</h2>
    <div id="topartikel" class="row-fluid bottom-buffer owl-carousel">{foreach name=aussen item=module_data from=$module_content}
    <div class="item">
    <div class="boxstart same-height">
    <div class="well well-small">
    <h2 class="text-center artikelbox"><a href="{$module_data.PRODUCTS_LINK}">{$module_data.PRODUCTS_NAME}</a></h2>
    {if $module_data.PRODUCTS_IMAGE!=''}<div class="row-fluid"><div class="span12 bild"><a href="{$module_data.PRODUCTS_LINK}"><img class="center-block" src="{$module_data.PRODUCTS_IMAGE}" alt="{$module_data.PRODUCTS_NAME}" /></a></div></div>{/if}
     
    <div class="text-center details2">
    <p class="price">{$module_data.PRODUCTS_PRICE|replace:'Jetzt nur ':''|replace:'Now only':''|replace:'<br />':''}</p>
     
    <p>{$module_data.PRODUCTS_BUTTON_DETAILS}</p>
    </div>
    </div>
    </div>
    </div>
     
     
    {/foreach}
    </div>

    Ich möchte einfach mal ausprobieren, wie es dann aussieht. Man könnte auf der Startseite evtl. mehr Produkte zeigen als jetzt.

    Viele Grüße  Sylvio

    ApK

    • Fördermitglied
    • Beiträge: 421
    Re: Topartikel anpassen
    Antwort #4 am: 14. Februar 2020, 08:04:35
    Huhu,

    schau mal in /templates/DEINTEMPLATE/module/includes/product_listing_include.html. Der Inhalt müsste das sein, was Du nach Wunsch weitestgehend adaptieren kannst.

    Den Code für die Row-Ansicht brauchst  du nicht zu übernehmen.

    Natürlich vorher die Datei sichern.

    Diesen Teil aber stehen lassen:
    Code: PHP  [Auswählen]
    {config_load file="$language/lang_$language.conf" section="new_products"}
    {config_load file="$language/lang_$language.conf" section="index"}
    {config_load file="lang_`$language`.custom"}

    LG

    karsta.de

    • Experte
    • Beiträge: 1.935
    Re: Topartikel anpassen
    Antwort #5 am: 14. Februar 2020, 10:11:12
    Hallo Sylvio,

    Schreib mal in die Dartei
    templates/bs24_elon/module/new_products_default.html

    Code: PHP  [Auswählen]
    {config_load file="$language/lang_$language.conf" section="new_products"}
    {config_load file="$language/lang_$language.conf" section="index"}
    {config_load file="lang_`$language`.custom"}
    <h2 class="home-new">{if #heading_text_top# != ''}{#heading_text_top#}{else}{#heading_text#}{/if}</h2>

    {include file="module/includes/product_listing_include.html"}
     

    BG Karsta

    hpzeller

    • Experte
    • Beiträge: 3.396
    • Geschlecht:
    Re: Topartikel anpassen
    Antwort #6 am: 14. Februar 2020, 10:26:25
    Hallo Sylvio,

    du kannst das was Karsta dir gepostet hat machen, alternativ kannst du den Inhalt der Datei templates/bs24_elon/module/new_products_default.html testweise auch mit folgendem Code ersetzen.

    Code: PHP  [Auswählen]
    {config_load file="$language/lang_$language.conf" section="new_products"}
    {config_load file="$language/lang_$language.conf" section="index"}
    {config_load file="lang_`$language`.custom"}
    <h2 class="home-new">{if #heading_text_top# != ''}{#heading_text_top#}{else}{#heading_text#}{/if}</h2>
    <div class="row-fluid bottom-buffer">{foreach name=aussen item=module_data from=$module_content}
    <div class="span4 box2 text-center" style="height: 275px;">
    <div class="boxstart same-height">
    <div class="well well-small">
    <h2 class="text-center artikelbox"><a href="{$module_data.PRODUCTS_LINK}">{$module_data.PRODUCTS_NAME}</a></h2>
    {if $module_data.PRODUCTS_IMAGE!=''}<div class="row-fluid"><div class="span12 bild"><a href="{$module_data.PRODUCTS_LINK}"><img class="center-block" src="{$module_data.PRODUCTS_IMAGE}" alt="{$module_data.PRODUCTS_NAME}" /></a></div></div>{/if}
     
    <div class="text-center details2">
    <p class="price">{$module_data.PRODUCTS_PRICE|replace:'Jetzt nur ':''|replace:'Now only':''|replace:'<br />':''}</p>
     
    <p>{$module_data.PRODUCTS_BUTTON_DETAILS}</p>
    </div>
    </div>
    </div>
    </div>
    {/foreach}
    </div>

    PS:
    In deinem Shop fehlt der Cookiebanner, ist der nicht mittlerweile Pflicht?

    Gruss
    Hanspeter

    morgenstern

    • Fördermitglied
    • Beiträge: 169
    • Geschlecht:
    Re: Topartikel anpassen
    Antwort #7 am: 14. Februar 2020, 10:54:44
    Hallo Hanspeter,

    vielen lieben Dank, es funktioniert.  Auch auf dem Smartphone.
    Auch an Karste vielen Dank für den Tipp.

    Bekommt man evtl. am PC vier Produkte nebeneinander?  Dann hat mein bei 8 Artikeln eine gerade Zahl, und es sieht sowohl am PC als auch auf dem Smartphone gleichmäßig aus.

    Viele Grüße Sylvio

    awids

    • Experte
    • Beiträge: 2.677
    • Geschlecht:
    Re: Topartikel anpassen
    Antwort #8 am: 14. Februar 2020, 11:25:37
    Ändere doch einfach die Klasse span4 in span3:

    Vorher:

    Code: PHP  [Auswählen]
    <div class="span4 box2 text-center" style="height: 275px;">

    Nachher:

    Code: PHP  [Auswählen]
    <div class="span3 box2 text-center" style="height: 275px;">

    Dann musst du natürlich noch einige CSS-Regeln ändern, damit nicht die 3. Box auf ein margin-right verzichtet, sondern erst die 4. Box.

    morgenstern

    • Fördermitglied
    • Beiträge: 169
    • Geschlecht:
    Re: Topartikel anpassen
    Antwort #9 am: 14. Februar 2020, 12:13:37
    Vielen Dank für die Hilfe.
    Sylvio

    morgenstern

    • Fördermitglied
    • Beiträge: 169
    • Geschlecht:
    Re: Topartikel anpassen
    Antwort #10 am: 16. Februar 2020, 10:33:29
    Hallo Hanspeter,

    auf dem Mac Book sind die Bilder etwas verschoben, sowohl bei Mac Safari als auch bei Mac Chrome.
    Siehe Screenshot im Anhang.
    Findest Du dafür noch eine Lösung?

    Danke und einen schönen Sonntag
    Sylvio

    awids

    • Experte
    • Beiträge: 2.677
    • Geschlecht:
    Re: Topartikel anpassen
    Antwort #11 am: 16. Februar 2020, 10:39:59
    Wer lesen kann, ist klar im Vorteil.  :datz:

    Dann musst du natürlich noch einige CSS-Regeln ändern, damit nicht die 3. Box auf ein margin-right verzichtet, sondern erst die 4. Box.

    morgenstern

    • Fördermitglied
    • Beiträge: 169
    • Geschlecht:
    Re: Topartikel anpassen
    Antwort #12 am: 16. Februar 2020, 10:54:15
    Hallo awids,

    das Problem ist, dass ich kein ausgebildeter Programmierer bin, sondern das Programmieren hier als interessantes Hobby betrachte, macht ja auch Spaß. Die Grundlagen dafür habe ich vor 20 Jahren im Studium mal gelernt, aber eben nicht mehr. Für gelegentliche Anpassungen einer Homepage, findet man nur schwer eine Firma, die wollen immer die großen Aufträge erteilt haben, mit anschließendem Servicevertrag. Zumindest hier bei uns. Das lohnt sich aber nicht, da wir über den Shop höchsten 5 Prozent unseres Umsatzes machen, 95 Prozent klassisch im Ladengeschäft.
    Was müsste ich jetzt bei den CSS-Regeln noch ändern?  
    Danke für Deine Hilfe.
    Viele Grüße, Sylvio

    awids

    • Experte
    • Beiträge: 2.677
    • Geschlecht:
    Re: Topartikel anpassen
    Antwort #13 am: 16. Februar 2020, 11:04:25
    Ich bin nicht Hanspeter, aber verbuchen wir das mal unter einem Missverständnis oder einer Verwechslung.

    Was müsste ich jetzt bei den CSS-Regeln noch ändern?

    Das hätte deine Frage sein sollen, nachdem ich dir die Tage schon mal geschrieben habe, dass es da noch was zu erledigen gäbe.

    In deiner stylesheet.css steht z. B. in Zeile 880 dies hier:

    Code: CSS  [Auswählen]
    .box2:nth-child(3n+1) {
        margin-left: 0px;
    }

    Das müsstest du nun wie folgt abändern (Desktop-Auflösung) :

    Code: CSS  [Auswählen]
    .box2:nth-child(4n+1) {
        margin-left: 0px;
    }

    Ähnliche Regeln müsste es auch für andere Auflösungen geben, die entsprechend angepasst werden müssen.

    morgenstern

    • Fördermitglied
    • Beiträge: 169
    • Geschlecht:
    Re: Topartikel anpassen
    Antwort #14 am: 16. Februar 2020, 11:16:01
    Danke für Deine Hilfe.
    Die Anrede mit Hanspeter war ein versehen, Entschuldigung.

    Gruß, Sylvio
    1 Antworten
    1281 Aufrufe
    20. Juli 2015, 18:13:41 von Roberto75
    13 Antworten
    13034 Aufrufe
    30. August 2010, 13:49:08 von GTB
    3 Antworten
    1218 Aufrufe
    17. Mai 2013, 13:40:29 von donaldax
    6 Antworten
    1798 Aufrufe
    25. September 2013, 18:48:45 von astaller
    anything