Navigationszeile horizontal

[busyfolks]

Hallo Redaxo-User,

ich habe es nun endlich (mit kills Unterstützung) geschafft, mein Template zum Laufen zu bekommen.

Allerdings hackt es jetzt noch an der Navigation.

Ich möchte, dass die Menüpunkte horizontal angeordnet werden.
Die Unterkategorien sollen dann (wenn es denn welche gibt) einfach eine Zele darunter angezeigt werden. Das alles aber mittig zentriert.

Kann mir jemand sagen, wie ich das mache ?
Oder kann mir jemand einen Code posten ? (das wäre zu schön)

Vielen, vielen Dank schon im vorraus für Eure Hilfe....

[Thomas.Blum]

Hej,

das muss in der Ausgabe erscheinen:

Code: Alles auswählen

<div id="navigation">
<ul id="nav">
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
<li><a href="#">Link 4</a></li>
<li><a href="#">Link 5</a></li>
</ul>
</div>

und das in der CSS-Datei

Code: Alles auswählen

#nav li
{
display: inline;
list-style-type: none;
padding-right: 20px;
}

[busyfolks]

Die Sachen, die Du als Ausgabe angegeben hast, integriere ich in das Template, korrekt ?
Und woher bekomme ich die Ziele für die Links ?
Die Inhalte etc werden ja aus den PHPs und dem SQL-Kram generiert.

Ich selbst kann nur HTML in den Grundzügen.........

[Thomas.Blum]

Hej,

Die Sachen, die Du als Ausgabe angegeben hast, integriere ich in das Template, korrekt ?

Jein,

Das Nein du musst die Navigation per PHP schreiben. Schau hiermal im Forum dazu nach. Dort sind einige Navigationen bereits beschrieben worden.

Das Ja wenn du deine CSS-Daten im Template hast musst du sie dort mit reinschreiben, ansonsten in deine externe CSS-Datei.

Und woher bekomme ich die Ziele für die Links ?

Über das Script der Navigation

Die Inhalte etc werden ja aus den PHPs und dem SQL-Kram generiert.

Kram? Redaxo basiert auf diesen "Kram"

Ich selbst kann nur HTML in den Grundzügen.........

Sofern du alles selber programieren möchtest, wird entweder Redaxo für dich nicht das richtige CMS sein oder aber du lernst HTML, PHP und MySQL (weniger) oder du beauftragst jemanden damit.

Thomas

[busyfolks]

Es kann doch nicht so schwer sein, die Navi hinzubekommen ohne sich in ein Informatikstudium einschreiben zu müssen.......

Geht irgendetwas von hier ?
http://www.redaxo.de/50-0-cnavigation.html

[Thomas.Blum]

Hej,

Es kann doch nicht so schwer sein, die Navi hinzubekommen ohne sich in ein Informatikstudium einschreiben zu müssen.......

Geht irgendetwas von hier ?
http://www.redaxo.de/50-0-cnavigation.html

Probier doch mal was aus!

http://forum.redaxo.de/search.php

[Markus.Staab]

Hi

Die Navigation hatte ich dir gestern bereits in PHP gecodet.

Du musst nur das CSS anpassen.
Das habe ich aber auch schon mehrfach gesagt

Gruß,
Markus

[busyfolks]

Die Navigation hatte ich dir gestern bereits in PHP gecodet.

Du musst nur das CSS anpassen.
Das habe ich aber auch schon mehrfach gesagt

@kills
Ja ist klar.
Das hast Du auch.
Ich bekomme das Ding aber nicht horizontal. Das habe ich Dir schon gesagt. Ich habe dazu sämtlich Artikel im SelfHTML gelesen.
Weiter hats mich aber nicht gebracht.
Da Du die betreffende Url ja hast, könntest Du auch sehr gut sehen, dass ich auch schon einiges an Formatierungen vorgenommen habe !

[Jan.Kristinus]

hi,

schreib das mal zusaetzlich ans ende deines stylesheets:

Code: Alles auswählen

.navigation li {
display:inline;
margin-right:20px;
}

.subnavigation li {
display:inline;
margin-right:20px;
}

am rande: das ist kein redaxo problem, sondern ein allgemeines css problem. mit redaxo kannst du navigation jeder art erstellen und es gibt verschiedene wege zum ziel. ich hoffe dir ist trotzdem ein wenig geholfen

gruss

jan

[busyfolks]

So..........
Fazit, horizontale NAvi schein ja kompliziert und für mich nciht umsetzbar zu sein.
Ich habe also mein Layout total umgestrickt.

Die Navi soll nun wie gehabt unterinander sein.
Allerdings sollen die Unterkategorien etwas eingrückt unter der dazu gehörigen hauptkategie dargestellt werden.
Das scheint ja serienmäßig so auch nicht zu sein.
Wie löse ich das ?
Das müsste ja eigentlich besser zu lösen sein, oder ?
Weiß vielleicht dazu jemand was ?

[Markus.Staab]

Hi,

du forderst hier im Forum, dass wir für dich unentgeldlich Dinge tun, die wir selbst unseren Kunden mit 150-350€ in Rechnung stellen würden.

Ausserdem solltest du dich Grundsätzlich erstmal mit HTML und CSS auskennen, bevor du versuchst ein CMS zu verwenden.

Alles was du vorhast, sind ganz simple CMS konstrukte, die man in jedem Tutorial sehen kann.

Ausserdem ist z.b. eine Horizontale Navigation auf vielen Seiten zu finden, die unter den Referenzen stehen. Dort könntest du schon längst einen Einblick vorgenommen haben.

Gruß,
Markus

[busyfolks]

also.
wie es reinschallt usw...............

Dies ist ein Forum. Korrekt ?
Da stellt man Fragen. Korrekt ?
Habe ich etwas anderes getan ?
NEIN !

Und noch etwas. Ich habe nichts "gefordert".
Ich habe, Du wirst es kaum glauben, GEFRAGT !

Klar, Du hast mir anfänglich geholfen. Danke !
Aber, dass Du dir jetzt den Schuh anziehst und meinst alles, was ich FRAGE lösen zu müssen, ist definitiv nicht mein Problem. Ich habe in keinster Weise Dich speziell gefragt. Wenn Du es weißt und helfen möchtest ist das schön. Da du das nicht möchtest, lass es. Aber mach mich nicht an !

[Jan.Kristinus]

Hallo..

es gibt fuer niemanden einen Grund sich hier so aufzuregen, deswegen bitte ich Euch das unter Euch über PM zu regeln (wenn ihr das regeln wollt)..

Schick doch mal die URL Deiner Navigation hier durch, dann kann man sich das genauer ansehen, ansonsten gibt es leider zu horizontaler oder vertikaler navigation nicht viel zu sagen, da sie sich sehr ähnlich sind. ich hatte dir css code geschrieben. hast du den mal in dein css eingesetzt ? .. mit was fuer einem ergebnis ?

und nun gelassen weitermachen

gruss

jan

[alex2911]

Ich erbarme mich und leg Dir hier meine Navigation hinein. Dabei werden nur die Hauptkategorien und die ersten Unterkategorien der selektierten Hauptkategorie horizontal dargestellt. Für die weiteren Unterkategorien musst Du Dich selbst bemühen:

Code: Alles auswählen

<?php

echo '<div id="header-navig">
<!-- Erste Zeile -->
	<div id="navigation">&nbsp;&nbsp;'; 

$PATH = explode("|",$this->getValue("path").$this->getValue("article_id")."|");
$path1 = $PATH[1];
$path2 = $PATH[2];

//--- Start Root 
foreach (OOCategory::getRootCategories() as $lev1):
if($lev1->isOnline()) {
if($lev1->getId() == $path1) {

 echo "\r" . '				<a class="tabsNavigation" href="'. $lev1->getUrl() .'">'. $lev1->getName() .'</a>'; 
  }  else {
 echo "\r" . '				<a class="tabsNavigation" href="'. $lev1->getUrl() .'">'. $lev1->getName() .'</a>'; 
  }

}
endforeach;

//--- Start Sub1
 
$lev1Size = sizeof($lev1->getChildrenById($path1)); 
if($lev1Size != "0"){
$navigation_variable = '<!-- Zweite Zeile -->
	<div id="navigation_unten">&nbsp;&nbsp;'; 

foreach ($lev1->getChildrenById($path1) as $lev2):
if ($lev2->isOnline()) {
if ($lev2->getId() == $path2) {

 $navigation_variable .= "\r" . '				<a class="tabsNavigation" href="'. $lev2->getUrl() .'">'. $lev2->getName() .'</a>'; 
  }  else {
  $navigation_variable .= "\r" . '				<a class="tabsNavigation" href="'. $lev2->getUrl() .'">'. $lev2->getName() .'</a>'; 
  }
}
endforeach;
 $navigation_variable .= "\r" . '		</div>' . "\r" . '
	</div>' . "\r";  
	}
echo "\r" . '		</div>' . "\r" . $navigation_variable.  '
	</div>' . "\r";
?>

CSS:

Code: Alles auswählen

#header-navig {
	position:absolute;
	background: #E9E7E8;
	left:0px;
	top:49px;
	width:561px;
	height:30px;
	text-align: left;
}

#navigation {
	background: transparent;
	color: black;
	font-size: 11px;
	line-height: 30px;
	font-weight: bold;
	margin: 0px;
	position: relative;
	text-align: left;
	width:561px;
	height:30px;
}

#navigation a{
	background: transparent;
	color: #6B6B6B;
	font-family: Arial, Helvetica, sans-serif;
	padding-left: 5px;
	padding-right: 5px;
	text-decoration: none;
	text-transform: uppercase;
}

#navigation a:hover, #navigation a:active {
	background: transparent;
	color: #6B6B6B;
	text-decoration: underline;
}
#navigation_unten {
	background: transparent;
	color: black;
	font-size: 10px;
	line-height: 15px;
	margin: 0px;
	position: relative;
	text-align: left;
	width:561px;
	height:15px;
	border-top:solid;
	border-width:1px;
}

#navigation_unten a{
	background: transparent;
	color: #6B6B6B;
	font-family: Arial, Helvetica, sans-serif;
	padding-left: 3px;
	padding-right: 3px;
	text-decoration: none;
}

#navigation_unten a:hover, #navigation_unten a:active {
	background: transparent;
	color: #6B6B6B;
	text-decoration: underline;
}

Kaum getestet und ev. nicht ganz valid.