YAML goes contenido
Verfasst: Di 7. Aug 2007, 00:14
Ich bastle gerade an einer neuen Website (www.lehrstellenboerse.org). Da es sich um ein gemeinnütziges Projekt handelt, wollte ich mal YAML dafür nutzen. Im Grunde war es relativ einfach, bis auf die Tatsache, dass ich gleichzeitig ein zwei- und drei-spaltiges Layout nutzen wollte. Dazu musste ich alles doppelt anlegen. Aber jetzt scheint es zu gehen.
Wie geht man vor?
Schritt 1: YAML herunterladen und in den Ordner /cms/css reinlegen
Schritt 2: Drei Ordner samt Inhalt kopieren (yaml, patches und screen)
Schritt 3: HTML-Layout kopieren, in contenido einbauen und auch nutzen
Schritt 4: Ich nutze basemod.css, content.css & layout_vertical_listnav.css
Schritt 5: Eigene CSS-Anpassungen in style.css speichern
Gruss aus Bayern
LAYOUT:
Wie geht man vor?
Schritt 1: YAML herunterladen und in den Ordner /cms/css reinlegen
Schritt 2: Drei Ordner samt Inhalt kopieren (yaml, patches und screen)
Schritt 3: HTML-Layout kopieren, in contenido einbauen und auch nutzen
Schritt 4: Ich nutze basemod.css, content.css & layout_vertical_listnav.css
Schritt 5: Eigene CSS-Anpassungen in style.css speichern
Gruss aus Bayern
LAYOUT:
Code: Alles auswählen
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Lehrstellenbörse der abakus Initiative für Bildung, Familie und Jugend e.V.</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="keywords" content="Lehrstellenbörse, Ausbildungsplatz, Lehrstellenplatz, Praktikumsplatz, Bobingen, Graben, Großaitingen, Kleinaitingen, Königsbrunn, Landsberg, Lechfeld, Oberottmarshausen, Untermeitingen, Schwabmünchen">
<meta name="robots" content="index,follow" />
<meta name="copyright" content="abakus Initiative für Bildung, Familie und Jugend e.V." />
<meta name="author" content="Susanne Angeli, Rea Dylong, Wolfgang Kundler" />
<meta name="revisit-after" content="7 days" />
<link rel="stylesheet" type="text/css" href="css/layout_vertical_listnav.css" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
<!--[if lte IE 7]>
<link rel="stylesheet" type="text/css" href="css/patches/patch_vertical_listnav.css" />
<link rel="stylesheet" type="text/css" href="css/patches/patch_2col_left_13.css" />
<![endif]-->
</head>
<body>
<a id="top"></a>
<div id="page_margins">
<div id="page">
<!-- HEADER START -->
<div id="header">
<div id="topnav">
<!-- start: skip link navigation -->
<a class="skip" href="#navigation" title="skip link">Skip to the navigation</a><span class="hideme">.</span>
<a class="skip" href="#content" title="skip link">Skip to the content</a><span class="hideme">.</span>
<!-- end: skip link navigation -->
<!-- HILFSNAVIGATION START -->
<container id="50" name="Hilfsnavigation" types="Navigation" mode="fixed" default="Hilfsnavigation">Hilfsnavigation</container>
<!-- HILFSNAVIGATION ENDE-->
</div>
<h1>Lehrstellenbörse</h1>
<span>der abakus Initiative e.V.</span></div>
</div>
<!-- HEADER ENDE -->
<!-- MENUENAVIGATION START #nav -->
<div id="nav">
<a id="navigation" name="navigation"></a>
<div id="nav_main">
<ul>
<li id="current"><a href="http://www.lehrstellenboerse.org" title="Gehe zur Startseite der Lechfelder Lehrstellenbörse">Startseite</a></li>
<li><a href="#" title="">Button 2</a></li>
<li><a href="#" title="">Button 3</a></li>
<li><a href="#" title="">Button 4</a></li>
<li><a href="http://www.lehrstellenboerse.org/abakus-initiative/mitgliedsantrag/" title="Mach mit! Werde Mitglied und unterstütze unsere gemeinnützige Bildungsinitiative">Mach mit!</a></li>
</ul>
</div>
</div>
<!-- MENUENAVIGATION ENDE #nav -->
<!-- CONTENT BEREICH START #main -->
<div id="main">
<!-- LINKE SPALTE START #col1 -->
<div id="col1">
<div id="col1_content" class="clearfix">
<ul id="submenu">
<li id="title">Hauptnavigation</li>
<container id="40" name="Hauptnavigation" types="Navigation" mode="fixed" default="Hauptnavigation">Hauptnavigation</container>
</ul>
<container id="48" name="Login" types="Navigation" default="">Login</container>
<container id="49" name="Newsletter" types="Navigation" default="">Newsletter</container>
<container id="44" name="Suche" types="Navigation" default="">Suche</container>
</div>
</div>
<!-- LINKE SPALTE ENDE #col1 -->
<!-- RECHTE SPALTE START #col2 -->
<div id="col2">
<div id="col2_content" class="clearfix">
<div id="imagecolumn">
<container id="70" name="Teaser_Rechts" types="Content" mode="optional">Teaser (Rechts)</container>
<container id="72" name="Teaser_Rechts" types="Content" mode="optional">Teaser (Rechts)</container>
<container id="74" name="Teaser_Rechts" types="Content" mode="optional">Teaser (Rechts)</container>
</div>
</div>
</div>
<!-- RECHTE SPALTE ENDE #col2 -->
<!-- MITTLERE SPALTE START #col3 -->
<div id="col3">
<div id="col3_content" class="clearfix">
<a id="content" name="content"></a>
<container id="60" name="Navigationspfad" types="Navigation" default="">Navigationspfad</container>
<container id="10" name="Headline" types="Content" default="Headline (HTML)">Headline (HTML)</container>
<container id="12" name="Text" types="Content" default="">Content 1</container>
<container id="15" name="Text" types="Content" default="">Content 2</container>
<container id="22" name="Text" types="Content" default="">Content 3</container>
<container id="24" name="Text" types="Content" default="">Content 4</container>
<container id="26" name="Text" types="Navigation" default="">Content 5</container>
<container id="28" name="Text" types="Navigation" default="">Content 6</container>
<img src="images/grey.gif" width="98%" height="1" border="0" alt="" title="" />
<p><br /><a href="#top"><img src="images/top.gif" width="12" height="12" alt="Nach oben ..." /></a></p>
</div>
<!-- IE column clearing -->
<div id="ie_clearing"> </div>
</div>
<!-- MITTLERE SPALTE ENDE #col3 -->
</div>
<!-- CONTENT BEREICH ENDE #main -->
<!-- FOOTER START -->
<div id="footer">
Dieses Layout basiert auf dem <a href="http://www.yaml.de/">YAML Framework</a>.<br />
<a href="http://www.wallaby.de" title="Webhosting und Webdesign von Susanne Angeli" target="_blank">Webdesign von Susanne Angeli</a><br />
<container id="99" name="BottomNavigation" types="Navigation" mode="fixed" default="BottomNavigation">BottomNavigation</container>
</div>
<!-- FOOTER ENDE -->
</div>
</div>
</body>
</html>