div von "inner" in "header" verschieben -welche .tpl ändern?

Ich fange gerade an mich mit den templates zu beschäftigen und wollte gerne das div „my_options“, welches sich in dem div class=„inner“ befindet (mit „Mein Konto“ und „Merkzettel“) in den header verschieben, sodass es die gesamte Breite annehmen kann, anstatt nur der Breite des „inner“ divs. Ich komme bei meiner suche in den tpl dateien nicht weiter… in _default/index/checkout_actions.tpl finde ich zwar „account“ und „note“ und ganz unten: {block name=„frontend_index_checkout_actions_inner“}{/block} in der _default/index/index.tpl finde ich: {* Content section *}

{* Content top container *} {block name=„frontend_index_content_top“}{/block} {* Sidebar left *} {block name=‚frontend_index_content_left‘} {include file=‚frontend/index/left.tpl‘} {/block} {* Main content *} {block name=‚frontend_index_content‘}{/block} {* Sidebar right *} {block name=‚frontend_index_content_right‘}{/block}
 

so… hier ist ja meine Vermutung, dass ich den content_top block aus dem „inner“ div nehmen müsste… ist das richtig? muss ich den block in die header.tpl einfügen? Müsste in der header.tpl kein „inner“ div zu finden sein? Hoffe ihr versteht mein Problem, sonst hätte ich noch einen Screenshot dazu…

Arbeite dich mal in die benutzten CSS Dateien ein, dort kannst du einiges hin und her schieben. Gruß Zwilla

[quote]Ich fange gerade an mich mit den templates zu beschäftigen und wollte gerne das div „my_options“, welches sich in dem div class=„inner“ befindet (mit „Mein Konto“ und „Merkzettel“) in den header verschieben,[…][/quote] Mahlzeit, du meinst wohl „über“ den headder verschieben, oder? Weil der Bereich in dem das Logo, Suchfeld, Warenkorb und Shopnavigation (Mein Konto, Merkzettel etc) standardmäßig zu finden ist ist bereits der headder :wink: Oder ich habe etwas falsch verstanden das kann auch sein :smiley: Die machen das in dem „Schnelleinstieg Template Tutorial 4.0“ Hier Dort schreiben sie: [quote] Shopnavigation neu gestalten Da wir die Shopnavigation über den Header positionieren möchten, müssen wir uns eine „index.tpl“ im Verzeichnis „frontend/index/“ anlegen. In der „index.tpl“ fügen wir danach folgendes Snippets ein: [/quote] [code] {extends file=‚parent:frontend/index/index.tpl‘} {* Remove the checkout actions here… *} {block name=‚frontend_index_checkout_actions‘}{/block} {* …and move them above the header container *} {block name=„frontend_index_no_script_message“ prepend}

{* We are using the new action plugin to support esi *} {action module=widgets controller=checkout action=info}

{/block}[/code] Wenn ich dich nicht falsch verstanden habe dann müsste dir das weiterhelfen. Viel Erfolg :slight_smile:

zwischen {block name=‚frontend_index_navigation‘}und header also einfügen so?

{* Shop header *} {block name=‚frontend_index_navigation‘} ----------------------- {block name=„frontend_index_no_script_message“ prepend}

{* We are using the new action plugin to support esi *} {action module=widgets controller=checkout action=info}

{/block} ---------------

{* Trusted Shops *} {if {config name=TSID}}
[![{s name=‚WidgetsTrustedLogo‘ namespace=‚frontend/plugins/trusted_shops/logo‘}{/s}]({link file=‚frontend/_resources/images/logo_trusted_shop_top.png‘})

{s name=‚WidgetsTrustedLogoText2‘} Sicher einkaufen
Trusted Shops zertifiziert{/s}

](https://www.trustedshops.com/shop/certificate.php?shop_id={config name=TSID} „{s name=‚WidgetsTrustedLogo‘ namespace=‚frontend/plugins/trusted_shops/logo‘}{/s}“)
{/if} wenn ich dies tue, verschwindet das menü sowie der warenkorb ganz! nachzuverfolgen unter http://vegansnacks.de

Hat keiner eine Idee dazu?

Also erstmal: [quote] Ich komme bei meiner suche in den tpl dateien nicht weiter… in _default/index/checkout_actions.tpl finde ich [/quote] Welches Template verwendest du denn? Was ist im Backend eingestell? Das Default-Template oder ein emotion-Template? -> Bei Shopware ist das Default-Template das alte Template. Das neue mit den verbesserten Funktionsumfang ist das emotion-Template. Dieses solltest du auch benutzen und anpassen. Das Emotion-Template basiert jedoch auf dem Default-Template und überschreibt die Blöcke in der _default/frontend/xxx/*.tpl mit dem was in dem Block in der _emotion/frontend/xxx/*.tpl steht. Dann kommen die emotion-Variationen (z.B. emotion_green) und überschreiben den Inhalt der in einem Block der _emotion/frontend/xyz/*.tpl oder _default/frontend/xyz./*.tpl steht dann, wenn der gleiche Block(name) in emotion_green/frontend/xyz/*.tpl vorhanden ist. Jetzt kommst du und willst da was ändern. Damit da nicht die Übersicht flöten geht und damit Shopware nicht deine Änderungen überschreibt bei einem Update welches eines der Templates auch betrifft gibt es die Ordner _local und _emotion_local im Templates-Ordner. Diese Überschreiben immer in letzter Instanz die Blöcke der vorherigen aktiven Templates und werden bei einem update von Shopware NICHT überschrieben. Alle Änderungen an dem Template die du hier vornimmst sind dann also quasi update-sicher. Der Ordner _local überschreibt das Default-Template und der Ordner _emotion_local das emotion-Template - oft reicht es aus nur den Ordner _emotion_local für Änderungen zu benutzen. Um mit den local-Ordnern arbeiten zu können erstellst du einen Ordner “frontend” in dem jeweiligen Ordner (i.d.R. _emotion_local) und baust da drinnen die Ordner-Struktur nach - natürlich nur die, die du auch tatsächlich ändern willst. Um einen Inhalt eines Blocks komplett zu ändern suchst du dir die Seite heraus die du ändern möchtest - z.B. der Header der bei allen Seiten angezeigt wird liegt in /templates/emotion_green/frontend/index/index.tpl (falls das emotion_green Template verwendet wird) und dort den Block den du ändern möchtest (falls er dort nicht existiert dann wird der Block vom /templates/emotion/index/index.tpl im Frontend angezeigt - falls er dort auch nicht existiert, dann wird der original Block vom default-Template verwendet). Diese Ordner-Struktur baust du nun nach. Die Datei /templates/_emotion_local/frontend/index/index.tpl erst einmal erstellen. Oben in die Datei ganz am Anfang in die erste Zeile kommt: {extends file="parent:frontend/index/index.tpl"} Damit sagst du Shopware, dass diese Datei alles von der Eltern-Datei ausführt, bis auf die Blöcke die du hier drinnen änderst. Um den Inhalt eines Blocks komplett zu ändern wird dieser einfach verwendet: {block name='frontend\_index\_checkout\_actions'}{/block} Jetzt wird der Inhalt dieses Blocks mit nichts ersetzt, weshalb an dieser Stelle kein Checkout mehr angezeigt wird. Mit [code]{block name=‘frontend_index_checkout_actions’}

Hallo

{/block}[/code] wird dann eben “Hallo” ausgegeben. Wenn du den Originalen Block verwenden willst, aber davor oder dahinter noch etwas eigenes anfügen möchtest, dann kann man so etwas wie append oder prepend verwenden: [code]{block name=‘frontend_index_checkout_actions’ append}

Hallo

{/block}[/code] Jetzt bleibt der Checkout angezeigt, nur ein “Hallo” wird noch im Anschluss eingefügt. Jetzt willst du bestimmt auch ein bischen am Styling drehen in den *.css-Dateien. Dazu musst du Datei /templates/_emotion_local/frontend/index/header.tpl anlegen und in die erste Zeile kommt wieder: {extends file="parent:frontend/index/header.tpl"} - nur jetzt eben mit “header.tpl” Der Block “frontend_index_header_css_screen” in der header.tpl regelt die Einbindung der css-Dateien. Diesen erweiterst du jetzt so, dass deine eigene *.css (nennen wir sie eigenesStyling.css) auch mit eingebunden wird: {block name="frontend\_index\_header\_css\_screen" append} <link type="text/css" media="screen, projection" rel="stylesheet" href="%7Blink%20file='frontend/_resources/styles/eigenesStyling.css'%7D">{/block} Diese Datei müssen wir natürlich noch im local-Ordner erstellen. Also erstellen wir die Datei: /templates/_emotion_local/frontend/_resources/styles/eigenesStyling.css. Hier drinnen kannst du nun die css-Styles der Templates überschreiben, ganz wie gewohnt weil es sind ja CASCADING style sheets. Jetzt bist du auf dem Stand an dem du das Template ändern kannst so wie du es willst. http://wiki.shopware.de/Template-Cheats … _1014.html und http://wiki.shopware.de/Schnelleinstieg … l_876.html sollten dir jetzt weiter helfen. PS: mit den Firefox Plugins firebug und firephp und aktiviertem Shopware Debug Plugin (im Backend unter Einstellungen->Plugin Manager->Shopware Erweiterungen kann es aktiviert werden) bekommt man einen guten Eindruck davon (wenn man auf den Konsolen/Console ausdruck kuckt) wo sich die *.tpl denn befindet die man jetzt bearbeiten möchte. Außerdem zeigt einem die Plugin-Kombination auch an welche Variablen in diesem Bereich des Shopware-Frontends im Template zur Verfügung stehen.

1 „Gefällt mir“

Vielen Herzlichen Dank für die Erklärung und Anregungen. Das Template System haben wir vorher nicht verstanden mit der Reihenfolge des Überschreibens. In der design_template mussten wir dazu noch folgendes entfernen: #shopnavi .ajax_basket_container {background-image: url(…/images/backgrounds/bg_ajax_basket.png);} div.step_box ul li.active .icon {background-image: url(…/images/backgrounds/bg_stepnumber-active.png);}