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
/*<![CDATA[*/
ul.mainNav1, ul.mainNav2, ul.mainNav3 {text-align: left;
list-style-type: none; font-weight: bold;}
/*]]>*/
</style>
es reicht der Wert:
/*<![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
trägt, heißt in einem anderen Layout vielleicht
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.
Neben unseren erfolgreichen JIMDO-Seminaren finden Sie bei uns nun auch MAILCHIMP Starter-Seminare. Hier finden Sie alle Termine und Preise in der Übersicht ...
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:
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:
/*<![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.