TEMPLATE: Bootstrap4 für Shop 2.x - freies responsive Template

[uptrender]

Hallo Mike,
probiere mal folgendes, das sollte funktionieren.

Ändere in den Dateien
templates/bootstrap4/module/includes/product_listing_include.html
templates/bootstrap4/module/includes/product_info_include.html
diese Zeilen

Code: PHP  [Auswählen]

                <a class="card-body h-100 pb-2 text-center" href="{$module_data.PRODUCTS_LINK}">
                {if $smarty.const.BS4_FLAG_SPECIAL_SHOW == 'true' && $module_data.PRODUCTS_PRICE_SAVE_PERCENT != ''}<div class="ribbon bg-danger text-white shadow-sm">{#BS4_special#}</div>
                {elseif $smarty.const.BS4_FLAG_TOP_SHOW == 'true' && $module_data.PRODUCTS_STARTPAGE == '1'}<div class="ribbon bg-primary text-white shadow-sm">{#BS4_top#}</div>
                {elseif $smarty.const.BS4_FLAG_NEW_SHOW == 'true' && $module_data.PRODUCTS_OLDNEW == '1'}<div class="ribbon bg-success text-white shadow-sm">{#BS4_new#}</div>{/if}
                        <div class="lb_image mb-2">
                                {if $module_data.PRODUCTS_IMAGE != ''}
                                <img class="img-fluid unveil" src="{$tpl_path}css/images/loading.gif" data-src="{$module_data.PRODUCTS_IMAGE}" alt="{$module_data.PRODUCTS_NAME|onlytext}" />
                                <noscript><img class="img-fluid" src="{$module_data.PRODUCTS_IMAGE}" alt="{$module_data.PRODUCTS_NAME|onlytext}" /></noscript>
                                {else}
                                &nbsp;
                                {/if}
                        </div>
                        <h2 class="lb_title lead text-secondary mb-1">{$module_data.PRODUCTS_NAME}</h2>
                </a>

in

Code: PHP  [Auswählen]

                                <a class="card-body h-100 pb-2 text-center" href="{$module_data.PRODUCTS_LINK}">
                        {if $smarty.const.BS4_FLAG_SPECIAL_SHOW == 'true' && $module_data.PRODUCTS_PRICE_SAVE_PERCENT != ''}<div class="ribbon bg-danger text-white shadow-sm">{#BS4_special#}</div>
                        {elseif $smarty.const.BS4_FLAG_TOP_SHOW == 'true' && $module_data.PRODUCTS_STARTPAGE == '1'}<div class="ribbon bg-primary text-white shadow-sm">{#BS4_top#}</div>
                        {elseif $smarty.const.BS4_FLAG_NEW_SHOW == 'true' && $module_data.PRODUCTS_OLDNEW == '1'}<div class="ribbon bg-success text-white shadow-sm">{#BS4_new#}</div>{/if}
                                        <div class="lb_image">
                                                {if $module_data.PRODUCTS_IMAGE != ''}
                                                <img class="img-fluid unveil" src="{$tpl_path}css/images/loading.gif" data-src="{$module_data.PRODUCTS_IMAGE}" alt="{$module_data.PRODUCTS_NAME|onlytext}" />
                                                <noscript><img class="img-fluid" src="{$module_data.PRODUCTS_IMAGE}" alt="{$module_data.PRODUCTS_NAME|onlytext}" /></noscript>
                                                {else}
                                                &nbsp;
                                                {/if}
                                        </div>
                                </a>
                                <a class="card-body p-2 text-center" href="{$module_data.PRODUCTS_LINK}">
                                        <h2 class="lb_title lead text-secondary mb-1">{$module_data.PRODUCTS_NAME}</h2>
                                </a>

Gruß Karl

P.S.: Für den Top-Artikel- und Bestseller-Slider müssten die Dateien module/new_products_default.html und boxes/box_best_sellers.html sinngemäß angepasst werden.

Hallo Karl,

das klappt super mit dem Titel! Können die Bilder auch auf "bottom" gesetzt oder gar vertikal zentriert werden?

Danke,

Mike

[Karl1]

Hallo Mike,
ändere mal die Klassen in diesen beiden Zeilen so ab

Code: PHP  [Auswählen]

...
<a class="card-body h-100 pb-2 text-center d-flex align-items-center" href="{$module_data.PRODUCTS_LINK}">
...
<div class="lb_image w-100">
...

Gruß Karl

[Scubi]

Hallo Karl,

auf der Seite product_info_v1.html wird bei den Vorschaubildern der alt und title mitgegeben.

Auf allen anderen Seiten wird title nicht mitgegeben. Ist das Absicht?

Ich habe schon versucht die product_listing_info.html anzupassen, aber wie immer klappt es bei mir nicht.

Kannst Du helfen?

Gruß Alois

[Karl1]

Hallo Alois,
ein valider <img>-Tag muss "src" und "alt" enthalten.

Auf den Produktdetailseiten wird zusätzlich der Artikelname als Titel angegeben.
Klickt man auf "Bild vergrößern" wird dieser Titel als Überschrift in die Popup-Box (Modalbox) übernommen.
Der Titel wird nur dafür benutzt.

Gruß Karl

[uptrender]

Hallo Mike,
ändere mal die Klassen in diesen beiden Zeilen so ab

Code: PHP  [Auswählen]

...
<a class="card-body h-100 pb-2 text-center d-flex align-items-center" href="{$module_data.PRODUCTS_LINK}">
...
<div class="lb_image w-100">
...

Gruß Karl

Hallo Karl,

vielen Dank, das klappt in allen Browsern und Viewports. Nebenbei: das Template ist weltklasse!

Gruß

Mike

[Karl1]

Hallo Zusammen,
anbei ein neues Paket, mit den letzten Änderungen.

@Hanspeter:
Deinen Vorschlag habe ich schon gelesen, hab auch versucht mich etwas in Github einzulesen. Anleitungen für destop.github waren nicht sehr hilfreich.
Ich hab momentan ein Projekt das mich beschäftigt und zeitnah fertig werden muss.
Auf meiner ToDo-Liste steht als nächstes das Ajax-Menü, damit die Pagespeed-Werte besser werden.
Vielleicht schaffe ich es im Anschluss ein Repository einzurichten.

Gruß Karl

[EDIT Tomcraft 19.09.2019: Template in Beitrag 1 aktualisiert.]

[HaldOn]

Hallo Karl,

vielen Dank für deine unermüdliche Arbeit und das teilen!

[Timm]

[...]
Auf meiner ToDo-Liste steht als nächstes das Ajax-Menü, damit die Pagespeed-Werte besser werden.
[...]

Freut euch schonmal drauf. Ist sehr nice und auf meiner Seite schon im Einsatz, wenn das jemand vorher sehen möchte.

Danke dafür an Karl und Hanspeter!

Gruß Timm

[hh040]

Also ich bräuchte einmal eure Hilfe.

Ich muss ein Logo in den footer einbauen jedoch finde ich die footer Datei nicht.

[Andre Kern]

Hallo zusammen,

falls jemand den Slider mit der Einstellung "Gesamte Bildschrmbreite" (hier fehlt ein i  ) betreiben möchte und dieser nur auf der Startseite erscheinen soll, gelingt das mit folgender Änderung in der index.html:

Ersetze folgenden Code

Code: PHP  [Auswählen]

{* BEGINN Slider Karusell gesamte Breite *}
        {if ($smarty.const.BS4_CAROUSEL_SHOW == 'screen' || $smarty.const.BS4_CAROUSEL_SHOW == 'shop') && isset($SLIDER)}
                {include file="`$smarty.const.CURRENT_TEMPLATE`/module/includes/slider.html"}
        {/if}
 

mit folgendem

Code: PHP  [Auswählen]

{* BEGINN Slider Karusell gesamte Breite *}
{if isset($home) && $home == true}
        {if ($smarty.const.BS4_CAROUSEL_SHOW == 'screen' || $smarty.const.BS4_CAROUSEL_SHOW == 'shop') && isset($SLIDER)}
                {include file="`$smarty.const.CURRENT_TEMPLATE`/module/includes/slider.html"}
        {/if}
{/if}
 

Ansonsten erscheint er auf jeder Unterseite.

LG

[Karl1]

Hallo ApK,
danke für den Hinweis, das "i" wird beim nächsten Update dabei sein.

Im Code der index.html muss nichts geändert werden, weil dein Vorschlag schon seit längerer Zeit eingearbeitet ist.
Vermutlich arbeitest du mit einer "sehr" alten Version.

Gruß Karl

[Andre Kern]

Ui, sowas aber auch. Dann muss ich mal schauen, was sich noch so geändert hat 
Danke für den Hinweis.

LG
Andre

[Timm]

Damit es nicht untergeht.

Wir würden das so gerne mal nachstellen können... solange das nicht geht, können wir es nicht validieren !

Standardinstallation Shopversion 2.0.4.2 rev 11374 mit Template Bootstrap4 für Shop 2.x, PHP 7.1
Hinweis: Logging der DSGVO als Admin funktionierte nur mit Template tpl_modified

bei solchen Meldungen würde ich dann sogar sagen, dass es ein Templatefehler ist.

Gruss Gerhard

[Karl1]

Hallo Timm,
danke, dass du mich auf den Beitrag aufmerksam gemacht hast.

Das genannte DSGVO-Modul habe ich mir installiert und mit den verschiedensten Benutzerkonstellationen getestet.
Ich kann den beschriebenen Fehler nicht nachvollziehen.

Meiner Meinung nach braucht man dieses Modul nicht.
Fachanwälte vertreten die Meinung, dass ein Hinweis auf die Datenschutzerklärung mit Verlinkung völlig ausreichend ist.
Sofern im Adminbereich "Anzeige Widerrufsrecht?" auf "Ja" steht wird bei Bootstrap4 im Checkout ein entsprechender Hinweis mit Verlinkung angezeigt.
[ Für Gäste sind keine Dateianhänge sichtbar ]

Gruß Karl

[sb_cbo-do]

Hallo,

ich wollte mal fragen, ob für dieses Template eine Erweiterung für die Cookie Banner Einwilligung in Bearbeitung ist?

Ich schaffe es einfach nicht die "ANLEITUNG: Cookie Banner mit Einwilligung für Google Analytics, Matomo & Facebook" mit diesem Template umzusetzen.

Gruß,

Sven