Anfängerfrage: CSS-Template für Typolight "umbasteln". Bin nicht so sicher...

[niggoo]

Hallo, ich bin ein ziemlicher Newbie was Typolight angeht, wollte aber endlich mal ein Layout für meine Homepage bekommen.
Daher habe ich mir das Screencast auf der Typolight-Webseite angeguckt, bin aber nicht sicher, wo da <?php echo this->header; ?> reinsoll.
Könnt ihr mir bitte helfen?

Hier der Quelltext:

<?php echo $this->doctype; ?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>">
<head>
<base href="<?php echo $this->base; ?>"></base>
<title><?php echo $this->pageTitle; ?> - <?php echo $this->mainTitle; ?></title>
<meta http-equiv="Content-Type" content="text/html; charset=<?php echo $this->charset; ?>" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta name="description" content="<?php echo $this->description; ?>" />
<meta name="keywords" content="<?php echo $this->keywords; ?>" />
<?php echo $this->robots; ?>
<?php echo $this->stylesheets; ?>
<script type="text/javascript" src="plugins/mootools/mootools-core.js"></script>
<script type="text/javascript" src="plugins/mootools/mootools-more.js"></script>
<?php echo $this->head; ?>
    <meta name="description" content="..." />
    <meta name="keywords" content="..." />
    
    <link rel="index" href="./" title="Home" />
    <link rel="stylesheet" media="screen,projection" type="text/css" href="tl_files/CrystalX/css/main.css" />
    <link rel="stylesheet" media="print" type="text/css" href="tl_files/CrystalX/css/print.css" />
    <link rel="stylesheet" media="aural" type="text/css" href="tl_files/CrystalX/css/aural.css" />
</head>

<body id="www-url-cz">

<!-- Main -->
<div id="main" class="box">

    <!-- Header -->
    <div id="header">

        <!-- Logotyp -->
        <h1 id="logo"><a href="./" title="CrystalX [Go to homepage]">Crystal<strong>X</strong><span></span></a></h1>
        <hr class="noscreen" />          

        

       

    </div> <!-- /header -->

     <!-- Main menu (tabs) -->
     <div id="tabs" class="noprint">

            <h3 class="noscreen">Navigation</h3>
            <ul class="box">
                <li><a href="#">Home<span class="tab-l"></span><span class="tab-r"></span></a></li>
                <li id="active"><a href="#">Weblog<span class="tab-l"></span><span class="tab-r"></span></a></li> <!-- Active -->
                <li><a href="#">About Me<span class="tab-l"></span><span class="tab-r"></span></a></li>
                <li><a href="#">Photos<span class="tab-l"></span><span class="tab-r"></span></a></li>
                <li><a href="#">Portfolio<span class="tab-l"></span><span class="tab-r"></span></a></li>
                <li><a href="#">Contact<span class="tab-l"></span><span class="tab-r"></span></a></li>
                <li><a href="#">Links<span class="tab-l"></span><span class="tab-r"></span></a></li>
            </ul>

        <hr class="noscreen" />
     </div> <!-- /tabs -->

    <!-- Page (2 columns) -->
    <div id="page" class="box">
    <div id="page-in" class="box">

        <div id="strip" class="box noprint">

            <!-- RSS feeds -->
            <p id="rss"><strong>RSS:</strong> <a href="#">articles</a> / <a href="#">comments</a></p>
            <hr class="noscreen" />

            <!-- Breadcrumbs -->
            <p id="breadcrumbs">You are here: <a href="#">Home</a> &gt; <a href="#">Category</a> &gt;  <strong>Page</strong></p>
            <hr class="noscreen" />
            
        </div> <!-- /strip -->

        <!-- Content -->
        <div id="content">

            <?php echo this->main; ?>
            
        </div> <!-- /content -->

        <!-- Right column -->
        <div id="col" class="noprint">
            <?php echo this->right; ?>
        </div> <!-- /col -->

    </div> <!-- /page-in -->
    </div> <!-- /page -->

    <!-- Footer -->
    <div id="footer">
        <?php echo this->footer; ?>
        
        <p id="createdby">created by <a href="http://www.nuvio.cz">Nuvio | Webdesign</a> <!-- DON�T REMOVE, PLEASE! --></p>
        <p id="copyright">&copy; 2007 <a href="mailto:my@mail.com">My Name</a></p>
    </div> <!-- /footer -->

</div> <!-- /main -->

</body>
</html>

Sind die anderen Änderungen richtig?
Danke im voraus...
LG niggoo

[MacKP]

Nein, irgendwie ist das noch nicht wirklich richtig... das Menü sollte TYPOlight für dich erstellen und so...
Hier kannst du dich noch ein wenig besser Informieren: http://https://contao.org/projects/t...eitentemplates

Zusätzlich bitte auch die Suche benutzen... das sind wir schon einige Male durchgegangen...

Und um zu schauen wie ein aktuelles Seitentemplate auszusehen hat, schau dir die fe_page.tpl in /system/modules/frontend/templates an.

Viele Grüße

[tinoo]

Hallo

Eigentlich ist es gar nicht notwendig, ein eigenes Template zu erstellen! Ausser du arbeitest an etwas wirklich ordinärem, welches sich nicht mit "Bordmitteln" bewerkstelligen lässt. Aber das glaub ich wohl eher nicht... Was mitunter daran liegt, dass Typolight sehr leistungs- und anpassungsfähig ist!

Ich empfehle dir: Installiere einen lokalen Webserver wie z.B. XAMPP (http://www.apachefriends.org/xampp-windows.html), installiere darin eine neue Kopie von Typolight und lade die Vorlage "music-academy" ODER gehe via Projektseite zur Online-Demo und studiere dort die Vorlage. Will heissen: Sobald du die benötigten Module erstellt und das Seitenlayout definiert hast, sollten die ersten Inhalte angezeigt werden können. Dann kannst du beginnen, die Ausgabe mit den Stylesheets gemäss deinem Geschmack zu verschönern...