Anpassung Classic Theme 1.7

[henner2605]

Wie angedroht eine weitere Frage.
Es gibt hierzu Videos, Geschriebens und was weiß ich nicht alles, also steinigt mich bitte nicht für die Frage. Mit den Templates komme ich nicht klar.
Ich habe aktuell Probleme mit meinem Theme Classic über Presta Builder angepasst - separater Post.
Meine alternative Lösung wäre das Classic-Theme im "Original" zu verwenden und nur die Schriften und Farben anzupassen, würde mir reichen. Den Rest würde ich dann über Creative Elements anpassen.

Es gibt aber einen Punkt der mir beim Classic gar nicht gefällt. Und zwar auf der Produktseite der Bereich mit der Beschreibung.
Wäre bitte jemand so freundlich und kann mir sagen was ich wo und wie anpassen muss damit die Beschreibung über die volle Breite angezeigt wird und nicht nur auf der Hälfte der Seite? Allein über CSS habe ich es nicht hin bekommen.

Der oder die Helfende darf sich schon jetzt ganz doll gedrückt fühlen 😉

 

[henner2605]

Geht doch über CSS.

Dann fang ich schon mal an ein "neues" Template zu bauen.

[henner2605]

Guten Morgen,

ich muss doch fragen. Folgendes habe ich hier im Forum gefunden und in meine custom.css eingefügt. Auf großen Bildschirmen >767 Pixel wird die Beschreibung jetzt korrekt angezeigt, wie ich wollte. <767 Pixel verschwindet jetzt die Hälfte des Inhalts. Was ist denn jetzt daran falsch?
PS Cache gelöscht, Browser Cache gelöscht? Ja, hab ich.

@media (max-width:767px) {
 .tabs {margin-left: 0px;} 
} 
.tabs {
 box-shadow:2px 2px 8px 0 rgba(0,0,0,.2);
 margin-top:2rem;
 background:#fff;
 padding:1.25rem 1.875rem;
	 margin-left: -100%;
}

Link zur Beispielseite: http://hp2021.doeka-kassel.de/pulverfeuerloescher/bs-serie-pulverauflade-feuerloscher

Edited November 17, 2021 by henner2605
Link eingefügt (see edit history)

[rictools]

Dafür mußt du offenbar das negative margin-left herausnehmen weil auch ohne deine Änderung bei dieser Auflösung der linke Rand links angezeigt wird.

Was mir auffällt ist, daß die Box das Produktbild teilweise überdeckt und vielleicht auch weitere Inhalte wie den Bestellbutton (sofern es da einen gibt ...).

[pullidea-dev]

 

4 hours ago, henner2605 said:

 

 

.tabs {
 box-shadow:2px 2px 8px 0 rgba(0,0,0,.2);
 margin-top:2rem;
 background:#fff;
 padding:1.25rem 1.875rem;
 margin-left: -100%;
}

@media screen and (max-width: 767px) {
 .tabs {margin-left:0;} 
} 

Edited November 17, 2021 by raudsepp (see edit history)

[henner2605]

@raudsepp
Vielen Dank, jetzt passt es. Den Fehler sehe ich aber nicht wirklich. Die Reihenfolge der Anweisung, das "px", zu viele Leerzeichen?

@rictools
Dir auch vielen Dank. Das verdeckte Bild ist dann wohl die nächste Baustelle. Ich arbeite mit Firefox, da sieht die Seite okay aus. Mit Chrome und Edge leider bei mir dann auch nicht mehr.
Dazu kommt, es ist bei Firefox nicht bei allen Produkten, sondern scheinbar "nur" bei denen die ich mit Creative Elements erstellt habe - also fast alle. Die mit Standardeditor erstellten Beschreibungen verdecken auch in FF das Bild.
Ach menno, das macht doch alles gar keinen Spaß mehr 😞

[SliderFlash]

vor 20 Stunden schrieb henner2605:

Meine alternative Lösung wäre das Classic-Theme im "Original" zu verwenden

Du must zuerst "Child-Theme" erstellen, Classic Theme wird immer überschrieben.

[henner2605]

1 minute ago, SliderFlash said:

Du must zuerst "Child-Theme" erstellen, Classic Theme wird immer überschrieben.

Ich glaube im Original kann man gar nichts ändern? Zumindest hatten meine Versuche keinen Erfolg. Hab dann das kpl. Theme kopiert und die theme.yml bearbeitet. So ähnlich wie Child-Theme erstellen.

[SliderFlash]

suche in suchmachienen nach , prestashop child theme, gibt genug themen Anleitungen und videos dazu.

Edited November 17, 2021 by SliderFlash (see edit history)

[pullidea-dev]

55 minutes ago, henner2605 said:

@raudsepp
Thank you, now it fits. But I don't really see the mistake. The order of the instruction, the "px", too many spaces?

Sorry, aber ich verstehe nicht was du meinst.

[henner2605]

I would have liked to know where my mistake was, as I don't really see the differences.
But it's okay, the main thing is that it works. 👍

[rictools]

vor 43 Minuten schrieb henner2605:

@media (max-width:767px) { .tabs {margin-left: 0px;} } .tabs { box-shadow:2px 2px 8px 0 rgba(0,0,0,.2); margin-top:2rem; background:#fff; padding:1.25rem 1.875rem; margin-left: -100%; }

Ich hatte deinen Code nicht richtig gelesen, was du gemacht hast, du hast zunächst für kleine Bildschirme den linken Rand auf 0 gesetzt und danach für alle Auflösungen (und damit AUCH für die kleinen Bildschirme) den Rand auf -100%, damit die erste Anweisung also überschrieben. Wichtig ist hier also die Reihenfolge der Anweisungen, du mußt erst den Wert für alle festlegen und danach den abweichenden Wert für bestimmte Auflösungen (oder bei allen Anweisungen den Auflösungsbereich explizit angeben).

[henner2605]

Da wär ich meinen Lebtag nie drauf gekommen. Da CSS ja an sich nur nur beschreibt wie ein Element aussieht, bin ich davon ausgegangen, das es vollkommen egal ist wo die Anweisung im Code steht.

Ich befürchte nur, ich habe Euch umsonst die Zeit gestohlen. Die Sache mit den verdeckten Bildern bekomme ich nicht so einfach gelöst. Wenn ich Margin-top ändere bekomme ich allein in Firefox 2 verschiedene Ergebnisse, je nach dem ob ich die Beschreibung mit dem Standard-Editor oder mit Creative Elements erstellt habe. In Edge und Chrome siehts noch einmal ganz anders aus. D.h. ich kann gar nicht mehr zurück zum Classic.

Um mich meines Themes zu entledigen müsste ich jetzt wohl den Shop noch einmal ganz von vorn installieren und einrichten und alle Kategorien, Artikel usw. peu á peu vom "alten" in den neuen Shop kopieren. Wenn ich dann an meine Arbeit der letzten Wochen und Monate denke, könnt ich grad anfangen zu heulen. Und außerdem weiß ich ja dann noch nicht einmal welche neuen Probleme ich mir damit einfange, bzw. ob das überhaupt die Probleme löst. 😞

[rictools]

Es ist völlig normal, daß bei unterschiedlichen Anweisungen für das gleiche Element die letzte Anweisung gilt (nicht nur in der gleichen Datei, sondern auch wenn Anweisungen in verschiedenen Dateien stehen gibt es eine Reihenfolge, z. B. überschreiben Anweisungen in der custom.css die in der global.css. Allerdings kann man ältere Anweisungen mit dem Zusatz !important versehen, dann werden diese von "normalen" Anweisungen nicht überschrieben.

Wenn du stirbst können sich deine Erben auch nicht aussuchen, welches deiner Testamente nun gültig ist, es ist das zuletzt verfaßte.

Daß sich CSS-Anweisungen in verschiedenen Browsern unterscheiden ist ungewöhnlich (außer bei exotischeren Anweisungen die nicht von allen Browsern unterstützt werden), meist holt sich ein Browser die Seiten noch aus dem Cache, stellt also nicht die aktuelle Version dar.

Was Creative Elements angeht, damit kenne ich mich nicht aus, aber es kann natürlich sein daß die Seiten dadurch unterschiedlich aufgebaut sind und du für beide Alternativen Lösungen entwickeln mußt (es müßte sich auch ein DIV mit einer Klasse "creative_elements" oder ähnlich finden um Anweisungen nur für diese Alternative gelten zu lassen.

Was ich nicht ganz verstehe, warum gibt es Produkte die mit Creative Elements erstellt worden sind und welche die anders erstellt wurden?

[henner2605]

Das mit dem Testament ist mal ein cooler Vergleich 🙂

Ich habe noch etwas rumgespielt.
Die unterschiedlichen Darstellungen beruhen nicht nur auf den beiden Editoren sondern auch darauf, dass unangemeldete Benutzer bestimmte Module der Seite nicht sehen, z.B. die Preisanzeige fehlt völlig.
Beim Classic Theme sind aber scheinbar die Elemete Bilder, Preis, Mengenpreis usw. scheinbar alle in einer Spalte angeordnet (col-md6 oder so ähnlich). Blende ich nun etwas aus, rutscht entsprechend der nachfolgende Inhalt nach oben. Somit müsste ich die Beschreibung erst einmal aus der Spalte raus bekommen. Ich lag wohl doch nicht ganz falsch als ich im ersten Post sagte, nur mit CSS wird´s nicht gehen und Templates kann ich nicht.

Creative Elements ist ein Tool um die Seite mit hübsch ausschauenden Elementen zu füllen. Die Produktbeschreibung meiner Beispielseite oben bekommt man mit dem Standard-Editor nicht hin, zumindest nicht so einfach. Zwei Spalten, Akkordeons usw. Es arbeitet sich im Prinzip wie früher mit verschachtelten Tabellen.
Darüber hinaus kann man auch weitere Elemnte gestalten, nicht nur Produktseiten. Header, Footer, Start- und Kontaktseite sind auch mit C E erstellt.
Deswegen war ja mein Gedankte Classic zu verwenden und den Rest mit CE zu gestalten und Zack, eigenes Webdesign. Webdesign in Zeiten von Shopsoftware und CMS wie Joomla, Wordpress usw. Sieht eh alles irgendwie gleich aus.

Im Normalfall sollten die Beschreibungen, egal mit welchem Editor, in .tabs platziert werden und gleich aussehen, klappt bei meinem aktuellen Theme auch bestens. Warum in Classic nun nicht? Keine Ahnung.

Meinen Gedanken noch einmal ganz von vorn anzufangen musste ich auch schon wieder verwerfen, da sich Inhalte die mit Creative Elements erstellt wurden nicht auf eine andere Webseite kopieren lassen. Und noch einmal alles ganz von vorn? Nein! Am Wochenende hab ich Zeit, da heule ich leise in mein Kopfkissen 😉