Hallo Zusammen,
ich hab da mal wieder eine Frage und hoffe ihr könnt mir helfen:
Ich habe ein horizontales Menü gebaut und es auf meine HTML Seite eingebaut. Jetzt ist es so, dass es eine zweite Ebene hat, wie bei spiegel.de! Wenn ich nun auf einen Link in der 1.Ebene klicke und sich dann die entsprechende 2 Ebene öffnen soll, geht das nur, wenn ich eine 2te HTML Seite habe. Ich habe also für jeden Link in der ersten Ebene eine eigene HTML Seite. Dadurch verändert sich dann die Optik des Menüs, wie bei Spiegel.de (nur als Beispiel, so in etwa müsst Ihr euch mein Menü vorstellen). Nur wie bekomme ich es hin, jetzt alle Seiten in Typo3, sprich ich arbeite mit Templavoila, einzubinden? Eigentlich kann ich ja nur eine index.htm(l) einbinden, oder?
Ich will ja trotzdem irgendwie meinen MainContent-Bereich definieren.
Danke und Gruß
Dirk
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Thread verschoben aus: TypoScript » Menüs
Nur wie bekomme ich es hin, jetzt alle Seiten in Typo3, sprich ich arbeite mit Templavoila, einzubinden?
In diesem Sinne darfst Du "mehrere HTML-Seiten" nicht mit TYPO3 verwechseln. TYPO3 arbeitet mit Templates - im Fall mit TemplaVoila mit mapping. Die verschiedenen, durchklickbaren Seiten werden im Hintergrund aufbereitet. Wichtig ist, dass Du dein Template strukturell so aufbaust, dass es die dynamischen Aspekte abdeckt. Bezogen auf deine "harten" HTML-Seiten - nimm die HTML-Seite als Template-Basis, die alle Anforderungen/Bereiche erfüllt.
Wie erwähnt, z.B. die Navigation unterteilen. Gab dazu erst gerade einen Thread:
» 
#25103
Wie man mit TemplaVoila arbeitet, findest Du in den Dokumentationen auf typo3.org.
Futuristic Template Building
» http://typo3.org/documentation/document-library/tutorials/doc_tut_ftb1/current/
Ich will ja trotzdem irgendwie meinen MainContent-Bereich definieren.
Was das mit deiner Navigationsfrage zu tun hat..? Der Contentbereich bekommt ja seinen eigenen Bereich 😉 . Ich denke die verlinkte Doku mit Erklärung/Screenshots ist deine nächste Lektüre.
grüsse
Danke erstmal!
Müsste es dann nicht möglich sein, die HTML Datei in der sich das Menü befindet per iframe in das Template einzubinden? Oder bin ich jetzt total verkehrt?
Gruß
Dirk
Eigentlich wird der Bereich, in dem sich das Menü befinden, beispielsweise ein <DIV> gemappt. Damit ist es dann in Deinem DataObject und Du kannst ein Typoscript Menü angeben, dass dann innerhalb des DIVs dargestellt werden soll.
Du willst doch das Menü von Typo3 erzeugen lassen, damit es Deine Seitenstruktur, sprich die im Backend angelegten Seiten wiederspiegelt oder?
nicht wirklich!
Das scheint mir sehr kompliziert mit Typo3 und vom Design her nicht unbedingt einfach. Am liebsten würde ich ein Menü einbinden, welches ich in einer html seite erstellt habe, basierend auf CSS.
Hier das MENÜ als html Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
#maintab{
padding: 3px 0;
margin-left: 0;
margin-bottom: 0;
font: 12px Arial;
list-style-type: none;
}
#maintab li{
display: inline;
margin: 0;
}
#maintab li a{
text-decoration: none;
padding: 2px 5px;
margin-right: 3px;
border: 1px solid #FFFFFF;
color: white;
background: #999999;
}
#maintab li a:hover{
color: navy;
background: #FFFFFF;
}
#maintab li.selected a{ /*selected main tab style */
background-color: #FFFFFF;
color: #000000;
border-color: #FFFFFF;
}
#tabcontent{ /*2nd level content wrapper*/
border: 1px solid #FFFFFF;
background-color: #FFFFFF;
font: 11px Arial;
height: 100% /*IE7 beta2 fix*/
}
#tabcontent ul{
padding: 0;
margin: 0;
list-style-type: none;
display: none;
}
#tabcontent ul li{
display: inline;
}
#tabcontent ul.selected{ /*selected 2nd level content*/
display: block;
}
#tabcontent ul li a{
border-right: 1px solid #CC4444;
color: navy;
padding: 2px 5px;
display: block;
float: left;
text-decoration: none;
}
#tabcontent ul li a:hover{
background-color: #FFFFFF;
color: #CC3333;
}
.clearfix:after{ /*Clear floats hack: http://positioniseverything.net/easyclearing.html*/
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix{
display: inline-table;
}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
</style>
</head>
<body>
<p> </p>
<table width="800" border="0" align="center">
<tr>
<td height="21"> </td>
</tr>
<tr>
<td bgcolor="#CC3333"> <p> </p>
<p> </p>
<p>
<ul id="maintab">
<li class="selected"><a href="">Nachrichten</a> </li>
<li><a href="nav2.htm">Berater Finden</a></li>
<li><a href="nav3.htm">Artikel</a></li>
<li><a href="nav4.htm">Forum</a></li>
<li><a href="">Für Berater</a></li>
</ul>
<div id="tabcontent" class="clearfix">
<!--Sub Content #1 -->
<ul class="selected">
<li><a href="http://www.dynamicdrive.com">Home</a></li>
<li><a href="http://www.dynamicdrive.com/new.htm">New</a></li>
<li><a href="http://www.dynamicdrive.com/revised.htm">Revised</a></li>
</ul>
<!--Sub Content #2 -->
<ul>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C1/">Horizontal
CSS Menus</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C2/">Vertical
CSS Menus</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C4/">Image
Effects</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C6/">Form
Effects</a></li>
</ul>
</div></td>
</tr>
</table>
<table width="800" border="0" align="center">
<tr>
<td> </td>
</tr>
</table>
<table width="800" height="500" border="0" align="center" bordercolor="#CC4444">
<tr>
<td>
<table width="200" height="100%" border="0" align="right">
<tr>
<td> </td>
</tr>
</table>
<p> </p><p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p></td>
</tr>
</table>
<table width="800" border="0" align="center">
<tr>
<td> </td>
</tr>
</table>
<p> </p>
<p> </p>
<p> </p></body>
</html>
Diesen Header würde ich am liebsten komplett in Typo3 übernehemen, nur wie?
Danke Dirk
Warum willst du das denn tun?
Genau dafür ist doch Typo3 da!
Versuche dich mal ein wenig mit TMENU usw. auseinanderzusetzen. Glaub mir, wenn du die erste funktionierende Navigation hast, und siehst, wie sich ein neuer Menüpunkt automatisch im Frontend herstellen läßt, indem du einfach im Backend eine neue Seite anlegst, willst du nie wieder auf Typo3 verzichten.
Bei deinem Ansatz müsstest du jedesmal deine externe eingebundene Seite überarbeiten, wenn du eine neue Seite im Typo3-Backend anlegst.
Das ist doch Schnonsens... 🙂
Das geht alles mit TypoScript...
Eine Typo3-TS-Navi:
Bild: inanimate.de/…/navi.png