find-templates - Inhalt gestalten

Inhalt gestalten

Seiteninhalt gestalten (Teil 2)

Schritt 1: HTML-Code im Seiteninhalt einfügen:

- auf "Eigene Seiten editieren"
- Seite auswählen, die Du bearbeiten möchtest
- nun im Editor oben links auf "Quellcode" klicken
- Deine Seite ist nun im "HTML-Modus"
- füge folgenden HTML-Code ( siehe rechts) ein

Der Code enthält 4 DIV Felder. Wer mehr benötigt, kann ihn natürlich beliebig erweitern.

<div class="inhalt">
<h3>Überschrift</h3>
Hier fügst du Inhalt ein.
</div>

<div class="inhalt">
<h3>Überschrift</h3>
Hier fügst du Inhalt ein.
</div>

<div class="inhalt">
<h3>Überschrift</h3>
Hier fügst du Inhalt ein.
</div>

<div class="inhalt">
<h3>Überschrift</h3>
Hier fügst du Inhalt ein.
</div>

Schritt 2: CSS-Code für das Aussehen

- links die (verkleinerte) Vorschau
- rechts daneben der dazugehörigen CSS-Code
- Grafik anklicken zum vergrößern

 
.inhalt {
  width: 40%;
  float: left;
  margin: 15px; }

.inhalt h3 {
  font-size: 14px;
  color: #343434;
  margin-bottom: 5px; }


.inhalt {
   width: 40%;
   float: left;
   margin: 10px 10px 10px 10px;
   border: 1px solid #c9c9c9;
   padding: 10px; }

.inhalt h3 {
   font-size: 14px;
   color: #343434;
   margin-bottom: 5px; }


.inhalt {
   width: 40%;
   float: left;
   margin: 15px;
   padding: 5px; }

.inhalt h3 {
   font-size: 14px;
   color: #fff;
   margin: 5px 0px 5px -5px;
   background-color: #555;
   padding: 3px 0px 3px 5px; }


.inhalt {
   width: 40%;
   float: left;
   margin: 15px;
   padding: 0px 10px 10px 10px;
   background-color: #c9c9c9; }

.inhalt h3 {
   font-size: 14px;
   color: #fff;
   margin: 0px -10px 5px -10px;
   background-color: #555;
   padding: 3px 0px 3px 5px; }

Den gewünschten CSS-Code einfügen

- User mit dem Baukasten-Design "CSS" :
- Einfügen im Feld "css ohne style-tags"

- alle anderen Baukasten-Designs (Iceblue / RED / Clean u.s.w.):
- Einfügen im Feld "Text ÜBER Design"
- dort VOR eurem --> </style>

Wenn Du noch keinen CSS-Code eingefügt hast:

- schreibe vor dem CSS-Code: <style type="text/css">  </style>

Jeden weiteren CSS-Code kannst Du dann später immer vor dem --> </style> mit einfügen.