Eigenen, zusätzlichen Header einfügen

[antobarto]

Hallo PS-Community,

ich habe eine CMS-Seite mit dem System "CMS Made Simple" erstellt. Über das Navigationmenü ist auch der Prestashop als externer Link zu einer Subdomain erreichbar.

Damit der Shop visuell  mit der Homepage harmoniert und NutzerInnen zwischen Shop und CMS-Content navigieren können, habe ich im PS-Template header.tpl ganz oben ein eigenes, zusätzliches Header-Element eingefügt. Der zusätzliche Header wird inklusive der "original" CMS-Navigation der Homepage über ein kleines selbstgebasteltes Plugin eingefügt.

Das funktioniert auch ganz prima. Der CMS-Header wird korrekt dargestellt, direkt darunter folgt die reguläre Shop-Navigation mit dem Anmeldebutton und dem Warenkorb. Bis hier alles wie gewünscht.

Problem: Der eigentliche Shop-Content mit den Artikeln etc. wird leider teilweise vom Header überdeckt. Ich habe bereits getestet, ein "Distanz-Element" einzufügen, sowie in den custom.css den folgenden Content-Containern die Eigenschaft "position: relative" zuzufügen. Leider ohne Wirkung.

Im Grund genommen möchte ich lediglich erreichen, dass der komplette Prestashop erst unter dem neu hinzugefügten Element beginnt.  Im Anhang eine vereinfachte Darstellung des Problems.

Für einen Tipp wäre ich dankbar.

EDIT: Beim PS-Theme handelt es sich um das Standard-Theme "Classic". PS Version 1.7.7.8.

 

Edited November 2, 2021 by antobarto
Neues Bild, zusätzliche generelle Infos (see edit history)

[antobarto]

Einen kleinen Schritt bin ich weiter.

Ich kann den neuen Header statt in header.tpl in das Basic-Template page.tpl einfügen. In dem Fall wird er dem Content zwar vorangestellt, allerdings nicht bildschirmfüllend, da der Content-Container natürlich einen Rand hat. zudem ist Anmedlung und Warenkorb dann wieder ganz oben über dem Header.  Ist also auch noch nicht die wahre Lösung.

Kann es sein, dass ich einen eigenen Block oder Hook erstellen muss?

Als Notlösung habe ich nun ein leeres Distanz-Div mit ausreichender Höhe ins Template page.tpl eingefügt, was aber leider nicht alle Inhalte abdeckt (zB Warenkorb oder Detail-Arikel ist weiter überdeckt.) . Vielleicht gibt es einen eleganteren Weg, der jeden Content verschiebt.

 

..

Edited November 2, 2021 by antobarto
add info (see edit history)

[rictools]

Am einfachsten wäre es doch wohl einfach mit einem Modul eine Inhaltsbox ganz oben zu erstellen, geht z. B. mit contentbox.org.

[antobarto]

18 hours ago, rictools said:

Am einfachsten wäre es doch wohl einfach mit einem Modul eine Inhaltsbox ganz oben zu erstellen, geht z. B. mit contentbox.org.

Hallo. Danke schonmal für den Tipp. Das geht in eine gute Richtung. BTW: Man möge mir einige Wissenslücken nachsehen, ich arbeite nur alle Jubeljahre mit Prestashop.

Problem ist noch, dass die Contentbox keinen HTML-Code oder Text enthalten soll, sondern lediglich einen Smarty-Tag, was hier leider nicht hinhaut. Siehe Bild.

Vielleicht zur Erklärung: Der zusätzliche Header samt Navigation ist externer HTML-Code und wird über ein kleines Plugin in PS eingefügt, das sich zur Zeit im Ordner themes/classic/plugins befindet:

<?php
function smarty_function_cmsms_menu($params, &$smarty) {
    return trim(file_get_contents('https://meine-cms-homepage/header.html'));
}
?>

Die verlinkte URL "header.html" ist eine versteckte Seite im CMS, die ausschließlich den Header samt Navigation enthält. Grund ist einfach, dass Änderungen im CMS-Header (Bild oder Menütexte) möglich sind, ohne zusätzliche manuelle Bearbeitung in Prestashop.

 

 

Edited November 3, 2021 by antobarto (see edit history)

[rictools]

Die Frage kann ich jetzt auch nicht beantworten. Änderst du denn die header.html so häufig ab daß es sich lohnt, da lange rumzubasteln ...

[antobarto]

Schwer zu sagen, da ich die Seite und den Shop im Nachhinein wahrscheinlich nicht selbst betreue. Ich wäre aber schon froh, wenn ich nicht jedesmal angerufen werde, nachdem ein Menütext im CMS geändert oder ein neuer Unterpunkt eingefügt wurde.

Ich gestehe allerdings, dass mich auch ein wenig der Ehrgeiz gepackt hat. Es wurmt mich einfach ein bisschen, dass ein so schlichter Wunsch, der fast schon erfüllt ist, am Ende doch so kompliziert zu sein scheint. Im Wesentlichen funktioniert es ja, wenn ich den Smarty-Tag ins Template setze. Nur, dass der Content eben teilweise vom Header überdeckt ist.

 

Edited November 3, 2021 by antobarto (see edit history)

[JBW]

Glaube am einfachsten wäre es ein HTML Box Modul an die Stelle im Header einzufpgen (evtl. Hook ins Template) - dann könnte man das HTML auch bequem im Editor in Prestashop bearbeiten. Aber das hast du ja mit deinem Plugin bereits gelöst.

19 hours ago, antobarto said:

Nur, dass der Content eben teilweise vom Header überdeckt ist.

Das ist doch bestimmt irgendein CSS was absolut positioniert ist.

[antobarto]

1 hour ago, JBW said:

Glaube am einfachsten wäre es ein HTML Box Modul an die Stelle im Header einzufpgen (evtl. Hook ins Template) - dann könnte man das HTML auch bequem im Editor in Prestashop bearbeiten. Aber das hast du ja mit deinem Plugin bereits gelöst.

Das ist doch bestimmt irgendein CSS was absolut positioniert ist.

Danke für die Antwort. Wie gesagt, das Problem mit den Box Modulen ist nicht HTML, sondern Smarty. Laut Recherche funktionieren Smarty-Tags nicht im Content, was ich leider bestätigen kann. Ich muss also bei den Templates bleiben.

Die Idee irgendeiner absoluten Positionierung hatte ich natürlich auch. Aber die theme.css ist nicht nur sehr umfangreich, sondern auch ohne Zeilenumbrüche. Es gibt natürlich etlliche absolute Positionierungen, aber keine der von mir aufgespürten betrifft eindeutig einen Hauptcontainer oder Wrapper.

[JBW]

5 minutes ago, antobarto said:

Aber die theme.css ist nicht nur sehr umfangreich, sondern auch ohne Zeilenumbrüche. Es gibt natürlich etlliche absolute Positionierungen, aber keine der von mir aufgespürten betrifft eindeutig einen Hauptcontainer oder Wrapper.

Schau dir die überlappenden Elemente mal mit der Untersuchen Funktion des Browsers an, sollte sich schon finden lassen. Dann keine Änderungen in theme.css machen sondern die Styles in der custom.css übersteuern

[antobarto]

2 hours ago, JBW said:

Dann keine Änderungen in theme.css machen sondern die Styles in der custom.css übersteuern

Das sowieso. Die theme.css bleibt unberührt.

Auf dem naheliegenden Tipp mit der Browser-Konsole bin ich wieder mal nicht gekommen. Vergess ich ständig. Danke schonmal dafür.

..

[antobarto]

Uuuund: DANKE. Dieser einfache, aber nutzvolle Tipp hat den Übeltäter schnell aufgespürt.

Edited November 4, 2021 by antobarto (see edit history)