Web sitesi yaparken sıkça lazım olan kodlardan biri menü kodlarıdır. Sınırsız alt menü yapısındaki bir menü kodunu bulmak, bulduktan sonra da düzenlemek çok büyük bir problemdir.
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>Kategori Listeleme – MENÜ</title>
<style type=”text/css” media=”screen”>
#menu {
width: 184px;
background: #eee;
}
#menu ul {
list-style: none;
margin: 0;
padding: 0;
color: #FFFFFF;
background-color: #0066FF;
}
#menu a, #menu h2 {
font: bold 11px/16px arial, helvetica, sans-serif;
display: block;
margin: 0;
padding: 2px 3px;
}
#menu h2 {
color: #fff;
background: #000;
text-transform: uppercase;
}
#menu a {
color: #FFFFFF;
text-decoration: none;
background-color: #efefef;
background-image: url(images/menu/m_li.gif);
background-repeat: no-repeat;
padding-left: 10px;
}
#menu a:hover {
color: #000000;
background-color: #fff;
}
#menu li {
position: relative;
color: #FFFFFF;
background-color: #0066FF;
background-image: url(images/menu/m_li.gif);
background-repeat: no-repeat;
}
<!–Benim alt sayfayı açan class yapım–>
#menu a.ok {
position: relative;
color: #FFFFFF;
background-image: url(images/menu/m_li_sub.gif);
background-repeat: no-repeat;
}
#menu ul ul ul {
position: absolute;
top: 0;
left: 100%;
width: 100%;
color: #FFFFFF;
background-color: #0066FF;
}
div#menu ul ul ul,
div#menu ul ul li:hover ul ul
{
display: none;
background-image: url(images/menu/m_li.gif);
background-repeat: no-repeat;
}
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{display: block;}
</style>
<!–[if IE]>
<style type=”text/css” media=”screen”>
#menu ul li {float: left; width: 100%;}
</style>
<![endif]–>
<!–[if lt IE 7]>
<style type=”text/css” media=”screen”>
body {
behavior: url(csshover.htc);
font-size: 100%;
}
#menu ul li {float: left; width: 100%;}
#menu ul li a {height: 1%;}
#menu a, #menu h2 {
font: bold 0.7em/1.4em arial, helvetica, sans-serif;
}
</style>
<![endif]–>
</head>
<body>
<?php
include(“ayarlar.php”); // veritabanına bağlan
echo”<div id=\”menu\”>”;
/*
TARIK TURAN
2010
BURADA YAPILAN SINIRSIZ KATEGORİLER VERİTABANINI
KATİD —– KAT-BASLIK—-USTKAT-İD
YAPISANA SAHİP BİR VERİTABANINDAN VERİLERİ ALIP DİKEY BİR DROPDOWN MENÜYE KOYUYOR …
*/
//////////////////////////////////// TARIK TURAN alt kategori sayma fonksiyonu
$query = mysql_query(“SELECT * FROM kategoriler”);
$toplamkayit=mysql_num_rows($query);
global $toplamkayit1;
$toplamkayit1=0;
function altkatsay($gelenid)
{
$toplamkayit1=0;
$sql = mysql_query(“SELECT * FROM kategoriler WHERE altkat_id=’$gelenid'”);
$toplamkayit1=mysql_num_rows($sql);
if (isset($toplamkayit1))
{
return $toplamkayit1;
}
else
{
$toplamkayit1=0;
}
return $toplamkayit1;
}
//////////////////////////////////// TARIK TURAN alt kategori sayma fonksiyonu sonu
//get all rows
$query = mysql_query(“SELECT * FROM kategoriler”);
while ( $row = mysql_fetch_assoc($query) )
{
$menu_array[$row[‘kat_id’]] = array(‘id’ => $row[‘kat_id’],’baslik’ => $row[‘kat_baslik’],’altid’ => $row[‘altkat_id’]);
}
//recursive function that prints categories as a nested html unorderd list
function generate_menu($parent)
{
$has_childs = false;
//this prevents printing ‘ul’ if we don’t have subcategories for this category
global $menu_array;
//use global array variable instead of a local variable to lower stack memory requierment
foreach($menu_array as $key => $value)
{
if ($value[‘altid’] == $parent)
{
//if this is the first child print ‘<ul>’
if ($has_childs === false)
{
//don’t print ‘<ul>’ multiple times
$has_childs = true;
echo “\n<ul>\n”;
}
$topla=altkatsay($key); // Gelen sayfanın alt sayfalarının olup olmadığına bakılıyor…
// ilgili kategorinin altsayfaları varsa topla>0 ve anasayfa ($key=1) dışındaki değerlere class=ok (css e benim eklediğim alt menülerin olduğunu gösteren oklu arkaplan ekleniyor ve link yapısı liste elemanın içine ekleniyor.)
if (isset($topla) && ($topla>0) && ($key<>1))
{echo “<li><a href=\”index.php?kid=” . $value[‘id’] . “\” class=\”ok\”>” . $value[‘baslik’] . “</a>”;}
else
{echo “<li><a href=\”index.php?kid=” . $value[‘id’] . “\”>” . $value[‘baslik’] . “</a>”;}
generate_menu($key);
//call function again to generate nested list for subcategories belonging to this category
echo “</li>\n”;
}
}
if ($has_childs === true){ echo “</ul>\n”;}
}
//generate menu starting with parent categories (that have a 0 parent)
generate_menu(0); // fonksiyon çağrılıyor…
mysql_close(“$baglantim”); // DB bağlantısı kesildi.
//echo”$cikti”;
echo”</div>”;
echo”</body></html>”;
?>
Kaynak: Sınırsız kategori için CSS ile Recursive menü