Einige Grundregeln für diese Arbeitsmethode


Hier sind einige wichtige Grundregeln für diese Arbeitsmethode die Sie berücksichtigen können:

 

1. Gruppieren von Einträgen

Sie können Einträge im Head untereinander aufführen:schöner noch und weniger Code: Sie fassen die Einträge zusammen:das gilt insbesondere und noch kürzer, wenn beide Einträge (oder mehr) das selbe Merkmal (hier die „background-color“) fixieren. Hier kommt das Komma zum Einsatz:

 

2. Ergänzung von Einträgen

Manche Einträge sind im Original-CSS bereits für Ihre Wünsche korrekt definiert, benötigen aber nur eine Ergänzung. In diesem Fall reicht es nur den ergänzenden Wert im Head zu hinterlegen:

 

unnötig wäre folgender Eintrag im Head

 

<style type="text/css">
/*<![CDATA[*/
ul.mainNav1, ul.mainNav2, ul.mainNav3 {text-align: left;
list-style-type: none; font-weight: bold;}
/*]]>*/
</style>

 

es reicht der Wert:

 

<style type="text/css">
/*<![CDATA[*/
ul.mainNav1, ul.mainNav2, ul.mainNav3 {font-weight: bold;}
/*]]>*/
</style>


da dieser Wert („font-weight“) vorher noch nicht definiert wurde.

 

3. DIV-Bezeichnungen und Layout-Wechsel
Was im Layout „Rome“ bei JIMDO eben noch den Namen

div#cc-tp-nav-top


trägt, heißt in einem anderen Layout vielleicht

div.cc-nav-action-wrapper

 

obwohl es dieselbe Funktion hat. Andere DIVs heißen vielleicht immer gleich wie z.B. der Warenkorb, Bestandteile der Navigation usw.

 

Bei JIMDO wird aus vielen Gründen und auch historisch bedingt in den Layouts (derzeit noch) eine uneinheitliche Benamung vieler Layout- Elemente verwendet was für den User weder Vor- noch Nachteile hat.

 

Als Coder kann man hier Verwirrung stiften. Wichtig dabei ist zu erkennen, dass man bei einem Layout-Wechsel überprüfen muss, ob vielleicht hinterlegte CSS-Einträge im Head in die Gestaltung des neu ausgesuchten Layouts „hineinfunken“.

 

Ein Layoutwechsel bedeutet demnach auch immer eine Überprüfung der im Head hinterlegten Einträge, damit der JIMDO-Support solche selbst verursachten Fehler hinterher nicht ausbaden muss.

 

Wenn Sie die Headeinträge für ein bestimmtes Layout vorrübergehend nicht mehr benötigen, speichern Sie den kompletten Headeintrag unter Einstellungen > Head bearbeiten für eine spätere Verwendung in einer TXT-Datei unter der Nummer des Layouts einfach ab. Dann löschen Sie (nur) diese Layout-relevanten Bestandteile aus dem Head, speichern und schalten auf das neue Layout um.

 

4. Ausblenden und Austausch von Grafiken

Manche JIMDO Layouts verwenden zentral gehostete Grafiken als Bestandteil des Designs. Das betrifft häufig Schattenelemente, abgerundete Bereiche oder kreative Elemente der festen Layouts: Sie haben die Möglichkeit diese Aufrufe mit eigenen Grafiken zu übersteuern, oder die hinterlegten Grafiken auszublenden.

5. Integration von fehlenden DIVs

Man kann nur DIVs und IDs ändern, die auch tatsächlich im HTML Ihres JIMDO-Layouts hinterlegt sind. Wenn Sie bestehende (feste) JIMDO-Layouts mit dieser Methode bearbeiten werden Sie feststellen, dass es immer wieder einmal den Wunsch nach Elementen gibt, die im HTML (an welches Sie ja nicht wirklich herankommen) nicht definiert wurden.

 

Hierfür können Sie hervorragend das Element „Widget/HTML“ verwenden, mit dem Sie einfach ein neues DIV definieren. Und zwar in der Sidebar, wenn Sie das Element auf jeder Seite benötigen oder im Content wenn Sie es nur auf bestimmten einzelnen Seiten verwenden möchten.

 

Als Beispiel: Sie hätten gerne im Kopf Ihrer Seite (sichtbar auf jeder Seite) ein Element, das auf Ihre bestehenden Betriebsferien hinweist. Erstellen Sie dazu mit dem Element „Widget/HTML“ in der Sidebar folgenden Eintrag:

 

<div id="zeiten">
Achtung: Betriebsferien!!!
</div>

Den Inhalt dieses Feldes (Text) haben Sie bereits in diesem Eintrag hinterlegt.

 

 

Wenn der Eintrag so gespeichert wird, macht er da rechts in der Sidebar (verwendet wird im Beispiel das Layout Amsterdam) einen recht unspektakulären Eindruck:

 

 

6. Also werden wir das von uns begründete DIV #zeiten im nächsten Schritt per CSS formatieren und diesen Eintrag im Head hinterlegen.

Zum Beispiel so:

 

<style type="text/css">
/*<![CDATA[*/
#zeiten {position: fixed; top: 30px; margin-left: -100px;
font-size: 22px; color: rgb(255, 255, 255); background-color:
rgb(228, 12, 27); padding: 10px; width: 300px; font-weight:
normal;}
/*]]>*/
</style>

 

Mit dieser Definition weisen wir dem DIV nicht nur einen auffälligen, sondern auch stabil positionierten Platz innerhalb der Webseite zu:

 

 

Die Sidebar ist damit - obwohl sie den HTML-Aufruf für #zeiten enthält damit auch frei für andere Inhalte.

 

Die Position des HTML-Elements in Sidebar oder Content sollte nach Möglichkeit stabil sein (zu oberst), da die hiermit verbundenen Elemente - wenn sie nicht auf position:fixed stehen auf den Seiten je nach weiterem Content umherwandern.