Hallo zusammen, ich bin noch relativ unerfahren was HTML & CSS angeht und komme daher leider bei meinem Anliegen selbst nicht weiter. Aktuell habe ich in jeder Kategorie das individuell angepasste HTML hochgeladen und jeweils via LINK auf die entsprechenden Kategorien verlinkt. Am liebsten hätte ich es jedoch allgemeingültig angepasst, so das ich nicht für jede Kategorie ein eigenes HTML-Dok hochladen muss. Und zwar würde ich gerne die "categorie_listing.html" so anpassen, dass die einzelnen Kategorien mit dem folgenden Code dargestellt werden: Code: <style type="text/css"> @import url(https://fonts.googleapis.com/css?family=Open+Sans:400,600;); .categorie { background-color: #000; display: inline-block; font-family: 'Open Sans', sans-serif; font-size: 16px; margin-top: 15px; margin-bottom: 15px; margin-left:50px; max-width: 315px; min-width: 230px; overflow: hidden; position: relative; text-align: center; width: 100%; } .categorie img { backface-visibility: hidden; max-width: 100%; vertical-align: top; } .categorie figcaption { bottom: 30px; left: 0; position: absolute; z-index: 0; } .categorie figcaption:before { background-color: #ffffff; bottom: -5px; content: ''; left: 0; position: absolute; right: 100%; top: -5px; z-index: -1; } .categorie h3 { background-color: #006633; color: #ffffff; font-size: 0.9em; font-weight: 600; letter-spacing: 1px; margin: 0; padding: 5px 10px; text-transform: uppercase; z-index: 1; } .categorie a { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; } </style> <figure class="categorie"><img alt="Fischfutter kaufen" src="D:\Users\Documents\Gambio\img cat\Unterkategorien\Fischfutter.png" /> <figcaption> <h3>Fischfutter</h3> </figcaption> <a href="https://Fisch/Fisch-Fischfutter/"></a> </figure> " /> Leider habe ich bisher noch nicht die CSS Datei gefunden, in der die verschiedenen Klassen der categorie_listing.html angesprochen werden um dort eventuell die Klassen zu bearbeiten. Hier der Code der Kategorie-Übersicht: Code: <head> <meta charset="utf-8"> <title>Unbenanntes Dokument</title> </head> <body> load_language_text section="categorie_listing"} {block name="module_categorie_listing"} {block name="module_categorie_listing_filter_selection"} {$FILTER_SELECTION} {/block} {block name="module_categorie_listing_description"} {include file="get_usermod:{$tpl_path}snippets/category_description.html" img_alt=$CATEGORIES_ALT_TEXT category_title=$CATEGORIES_HEADING_TITLE category_name=$CATEGORIES_NAME} {/block} {if $module_content} {block name="module_categorie_listing_content"} <div class="subcategories-listing-container"> <ul class="subcategories-listing"> {foreach name=sub_categories item=module_data from=$module_content} {block name="module_categorie_listing_content_item"} <li class="subcategory-item"> {if $SHOW_SUB_CATEGORIES_NAMES == '1' && $module_data.CATEGORIES_NAME != '' || $SHOW_SUB_CATEGORIES_IMAGES == '1' && $module_data.CATEGORIES_IMAGE} <a href="{$module_data.CATEGORIES_LINK}" title="{$module_data.CATEGORIES_ALT_TEXT|default:$module_data.CATEGORIES_NAME|strip_tags}"> {if $SHOW_SUB_CATEGORIES_IMAGES == '1' && $module_data.CATEGORIES_IMAGE} {block name="module_categorie_listing_content_item_image"} <img src="{$module_data.CATEGORIES_IMAGE}" alt="{$module_data.CATEGORIES_ALT_TEXT|default:$module_data.CATEGORIES_NAME}" title="{$module_data.CATEGORIES_ALT_TEXT|default:$module_data.CATEGORIES_NAME}" class="img-responsive" /> {/block} {/if} {if $SHOW_SUB_CATEGORIES_NAMES == '1' && $module_data.CATEGORIES_NAME != ''} {block name="module_categorie_listing_content_item_name"} {$module_data.CATEGORIES_NAME} {/block} {/if} </a> {/if} </li> {/block} {/foreach} </ul> </div> {/block} {/if} {block name="module_categorie_listing_new_products"} {$MODULE_new_products} {/block} {/block} </body> </html> Ich wäre um jede Hilfe bei der Verknüpfung der beiden Dateien überaus dankbar! Doch alleine schon für den Tipp wo ich die CSS Datei mit den Klassen der categorie-Listing Datei finden. Vielen herzlichen Dank im Voraus. Liebe Grüße, Patrizia
Das macht man nicht, weil man das sonst bei jedem Update neu machen müsste. Man kann sich die Classen z.B. in der Chrome- oder FifeFox - Konsole ansehen und die Änderungen dann im Style Editor ins eigene css schreiben. Da muss man keine Datei suchen. Wenn Du eine für alle Kategorien die selbe Datei haben willst, schreibt man nicht für jede Kategorie eine neue Datei, sondern kopiert einmal die originale categorie_listing.html und legt diese Kopie als categorie_listing-USERMOD.html neben die originale Datei. Jetzt passt Du die USERMOD-Datei so an, wie Du sie haben willst. Dann wird die automatisch bei allen Kategorien genommen, die sonst die categorie_listing.html nutzen. Ich würde allerdings nicht mehr so viel Zeit in das Template investieren, sondern eher Zeitnah auf das Theme umsteigen. Das Theme funktioniert anders, deshalb wäre es m.M.n. besser gleich das neue zu lernen, statt jetzt erst das alte und dann irgendwann noch einmal anzufangen.
Hallo Barbara, vielen Dank für deine schnelle Rückmeldung. Wenn ich von Honeygrid (Template) zu (Theme) wechseln - habe ich gravierende Änderungen am Shop zu bedenken oder bleibt "optisch" vorerst alles gleich? Danke für deine Rückmeldung, Patrizia
Das sind 2 verschiedene Systeme, Deine Änderungen am Template sind dann weg. du kannst (bei einer aktuellen Shopversion) aber mal den Style Editor 4 aufrufen und Dir das Theme ansehen, ohne gleich umzuschalten zu müssen. Dazu gehst Du im Admin auf Darstellung -> Template Einstellungen und dann auf den Button "neues Theme bearbeiten" Wenn du dann bei Honeygrid-Theme nicht auf aktivieren, sondern auf den kleinen Preil danaben klickst, findest Du "Bearbeiten" im Dropdown. Das ruft den Style Editor 4 und das Theme auf und Du kannst anfangen Dich damit vertraut zu machen und zu Stylen. Wenn alles passt, brauchst Du nur noch umschalten. Hier ist ein bisschen erklärt, wie im Theme was geht: (Link nur für registrierte Nutzer sichtbar.) Hier: (Link nur für registrierte Nutzer sichtbar.) und bei dem Weiterführenden Link findest Du noch den Grundstein für ein eigenes Child-Theme Das "mytheme mit Blocküberladung" ist eine gute Vorlage, wenn man eigene html-Änderungen hat