STRIPE RESPONSIVE & andere: Andere Hintergrundfarbe in Fußzeile bei "Extramenü" (wie bei "Sitemap") möglich?

Hallo,

wenn es um die Fußzeile geht, dann kannst du dafür auch eine Hintergrundfarbe einstellen:
Website > Layout > Alle Einstellungen anzeigen > Fußzeile > Hintergrund > Farbe.
Oder meinst du was anderes?

Hallo,

die Zeile die das Extra-Menü, im Layout Stripe-Responsive beinhaltet, ist doch die Fußzeile.
Oder willst du nur die linken Bereich (Ecke mit dem Extra-Menü) mit einer anderen Farbe haben?
Ich verstehe dich noch nicht so ganz...
Ggf. einen Screenshot dazu mal posten.

Hallo,

dazu muss man mit den Stylesheets etwas herumspielen und geht so:

Gehe zunächst mal auf das ZPP-Layout-Verzeichnis.
Normalerweise liegt das unter C:\Users\Username\AppData\Local\Zeta Producer 12.5\Packaging\Layouts, wobei Username für deinen Windowsbenutzer steht.
Achte auch darauf, das im Explorer die versteckten Dateien und Ordner angezeigt werden!!!
Nun gehe auf das Layout das du anpassen möchtest. In deinem Fall Stripe Responsive, ich hab hier jetzt nur mal die Home-Edition und mach das mal mit Layout Album Responsive.
Hier navigierst Du nach C:\Users\Username\AppData\Local\Zeta Producer 12.5\Packaging\Layouts\Album Responsive\assets
Hier gibt es die Datei styles.less, die bei anderen Layouts aber auch styles.css lauten kann.
Diese zunächst mit WordPad öffnen und speichern.
Danach lässt sich die Datei auch mit dem Editor (Notepad) gscheit lesen

Suche nun darin nach #xmenu {

Dort machst Du einen neuen Eintrag (rot markiert):
++++++
#xmenu {
margin: 0;
padding: 0;
overflow: hidden;

background-color: #attribute(Extramenu-BkColor);

a {
margin: 0;
padding: 0 10px 0 0;
font-size: #val(xmenu-font-size);
color: #val(xmenu-hyperlink-inactive-font-color);
text-decoration: #val(xmenu-hyperlink-inactive-decoration);
}
a:hover {
color: #val(xmenu-hyperlink-hover-font-color);
text-decoration: #val(xmenu-hyperlink-hover-decoration);
}
}
#footerinfo {
margin: 0;
padding: 0;
overflow: hidden;

background-color: #attribute(Extramenu-BkColor);
}
++++++
Falls Du die footerinfo auch mit dieser Farbe belegen möchtest dann mach auch noch den grünen Eintrag im #footerinfo {-Bereich.

Achtung, das alles kann im Stripe Responsive deutlich anders aussehen. Html- und CSS-Kenntnisse sind somit Pflicht!!!

Hier siehst du jetzt, das ich einfach neue Attribute als Farbe verwende.
Speicher die Datei und starte ZP.
Unter Erweitert - Attribute erstellst du jetzt das Attribut Extramenu-BkColor mit einem Farbwert.
Dieser kann #FFFFFF oder auch black lauten. Ich hab im Beispiel blue genommen:

Wenn Du jetzt auf Layout gehst siehst Du sofort das Ergebnis:

Layout speichern, damit wird es in Dein Projekt übernommen.
So kannst Du noch mit viel mehr Farben herumsielen.

Falls das noch nicht das gewünschte Ergebnis bringt, dann kann man auch noch an der "default.html" herumspielen:
C:\Users\Username\AppData\Local\Zeta Producer 12.5\Packaging\Layouts\Album Responsive\templates\pages\default.html
Hier kann man einen neuen Bereich mit einem eigenen <div id="Eigen1"> ... </div> erstellen, der wiederum in der Styles-Datei als #Eigen1 {...} hinzugefügt werden muss!

Achtung:
Bei einer neuen Version oder einem Layout-Update werden die Änderungen in der Style- und html- Datei überschrieben!!!
Also am besten noch ne Kopie bzw. die geänderten Einträge irgendwo abspeichern, damit ein evtl. neues Layout wieder angepasst werden kann.
Ausser ZETA macht das irgendwann mal programmtechnisch in einer neueren Version möglich.

Schönen Abend

dpessen: Kennst du schon dieses "Feature"? http://docs.zeta-producer.com/eigenes-css-einfuegen.html

Sunny: Das was du meinst ist der (um ganz genau zu sein) sogenannte "Afterfooter" Bereich, den man nur durch einen manuellen Eingriff ändern kann.
Das Extramenü ist bestandteil des "normalen Footers".

Also das in deinem Screeshot "Blau markierte" meine ich damit.
Und das "Grau markierte" ist das Extramenü, das seine Farbe über das bekommt, wie ich es oben beschrieben habe.

Das es jetzt schon bei mir recht spät geworden ist, komm ich da jetzt nicht mehr dazu mir das genauer anzusehen.
Und ob ich morgen die Zeit dazu finden werden wird schwer, da ich morgen Nacht in den Urlaub fahre und da noch einiges vorbereiten muss.

Aber ich denke dir kann da bestimmt auch jemand anders weiterhelfen.

Hallo Jochen
Ja wenn ich das Feature gekannt hätte dann hätte ich es auch benutzt
Danke für den Tipp.
Um damit hier jetzt eine Lösung hinzugekommen muss es aber nicht unbedingt ausreichen. Sollte dazu die styledatei und die default.html mal einsehen.

Jochen: Vielen Dank für den Tipp und schönen erholsamen Urlaub.

Sunny: Und hier das Ganze mit der ZP-Eigenen CSS-Methode:
Man erzeugt den CSS-Code wie in der Anleitung, und hier das Zeug für die Farb-Attribute:

Dann, wie gehabt, ein neues Attribut erzeugen, ich nehm jetzt mal zwecks Übersichtlichkeit gelb:

Damit man den Unterschied merkt, hab ich den Fusszeilen-Hintergrund im Layout noch auf grün gesetzt:

Und wenn man nun die Seite erstellt siehts wie folgt aus:

Ohne CSS wäre alles grün. Das ist doch das was du willst, oder?

@ Sunny und dpessen: Dankeschön und bis bald mal wieder

Hallo Sunny,

dachte ich mir schon. Somit bleibt nur die Änderung im Originallayout.

Hierzu folgendes:
Wenn ein Layoutupdate kommt, darfst Du das nicht anwenden, ausser Du merkst Dir die oberen Änderungen der default.html und der styles.less!
Nach dem Update musst Du die zwei Dateien wieder wie oben beschrieben anpassen.

Es gibt aber noch ne weitere Möglichkeit:
Kopiere das Originallayout aus C:\Users\username\AppData\Local\Zeta Producer 12.5\Packaging\Layouts\Stripe Responsive nach z.B. C:\Users\username\AppData\Local\Zeta Producer 12.5\Packaging\Layouts\StripeResp2
Öffne dort die layout.json und ändere dort ebenfalls den Namen ab wie hier gezeigt:
{
"settings": {
"version": "12.5.6.0",
"isProtected": true,
"name": "StripeResp2",
...

Speichere die Datei und starte ZP.
Öffne nun den Layout-Editor, dann "anderes Layout auswählen" und Du siehst dort dein "eigenes" Layout "StripeResp2".
Wähle es für dein Projekt aus.
Nun brauchst Du dieses nicht mehr updaten, sondern kannst hier immer nur das Original updaten lassen.
Dann bleibt dieses Layout für dein Projekt immer bestehen, ausser bei einem Versionsupdate!!!
Wenn also von 12.5.6.0 ein Update auf z. B. 12.5.8.0 kommt, dann löscht das Setup alle Layouts im oben angezeigten Verzeichnis und bildet diese neu nach.
Also auch hier dein Neues Layout StripeResp2 sicherheitshalber mal wegsichern und nach einem solchen Update wieder ins Verzeichnis hineinkopieren!

Gruß dpessen

Hallo,

der letzte Tipp von dpessen leuchtet mir nicht ein. Es gibt doch seit Version 12.5 einen gut Dokumentierten und offiziellen Weg ein Layout zu kopieren um es z.B. anzupassen.

Ein kopiertes Layout ist vollkommen unabhängig und kann und wird von uns nicht mehr aktualisiert. Das bedeutet aber auch, dass Fehlerbehebungen, die wir im Original-Layout beheben in Ihrer Kopie nicht behoben werden.

Es sollte wirklich niemand das Zeta Producer Installationsverzeichnis verändern. Die folgen sind unabsehbar und der Support wird für uns extrem erschwert.

Hallo Herr Seiz,

wusste ich so nicht. Mir ist das obern beschriebene Szenario bei eigenem "Learning by Doing" aufgefallen und hab es mal so angewendet, sorry.

Aber auch OK, dann für das oben beschriebene Beispiel die "offizielle" Variante:
Da es laut Doku bei einem neuen eigenen Layout nur ein "Minimal-Layout" gibt muss mann hier noch das "Stripe Responsive" kopieren, da führt kein Weg dran vorbei!
Also doch noch etwas Handarbeit, aber dann sollte es ZETA auch genügen:

- Extras / Entwickler / Neues Layout erstellen
- Name "StripeResp2", Speichern in "Web-Projekt
- Layoutordner anzeigen
- Alle Dateien löschen
- Dann Kopieren aller Dateien und Verzeichnisse unterhalb von:
C:\Users\username\AppData\Local\Zeta Producer 12.5\Packaging\Layouts\Stripe Responsive\
nach
C:\Users\username\Documents\Zeta Producer 12.5\projects\projektname\layouts\StripeResp2\

- Nun noch die layout.json von C:\Users\username\Documents\Zeta Producer 12.5\projects\projektname\layouts\StripeResp2\ auf den Namen anpassen:
{
"settings": {
"version": "12.5.6.0",
"isProtected": true,
"name": "StripeResp2",
...

- speichern
- ZP starten
- Projekt über "Erweitert / Erstellen / Alle Seiten erstellen" lassen, dann läuft es mit dem neuen "eigenen" Layout "StripeResp2", das ebenso im Layout-Editor sichtbar ist!

Für Sunny: Nun noch Deine Änderungen von oben halt über den Projektordner: C:\\Users\username\Documents\Zeta Producer 12.5\projects\projektname\layouts\StripeResp2\ durchführen.

Gruß dpessen

Hallo an Alle,

hab mich geirrt, man kann auch das ausgewählte Original-Layout über Entwickler / Layout kopieren mit eigenem Namen versehen, welches dann ins eigene Web-Projekt kopiert wird.
Mit diesem kann man dann ungehindert alles ändern, ohne das es Einfluss auf Updates und Original-Layout nimmt.

Das sollte es nun gewesen sein.

Hallo dpessen,

das sollte keine Kritik sein. Wie sind ja immer sehr Froh, wenn nicht nur wir hier Tipps geben, sondern auch andere. Daher Vielen Dank für Ihre Teilnahme! Ich wollte nur richtigstellen, wie der offizielle Weg ist…

Hallo Herr Seiz,

hab ich schon richtig verstanden.
Soll ja auch den Forenbenutzern keine Steine in den Weg legen.
Und natürlich auch im Interesse von ZETA sein.

Sollte mich vielleicht mal vorher durch ihre ganze Dokumentation arbeiten
Aber Sie kennen das bestimmt auch: Zuerst probieren und dann suchen und nachlesen