PHP ile Sub Menü Nasıl Yapılır?
Web programlama dillerinden biri olan ve diğer dillere göre internet üzerinde en fazla kullanılan PHP dili ile bugün sizlere dinamik menü yapımı konusunda bazı alternatif yollar sunacağım. Drop menü yani alt menü özelliği ile artık siteniz daha dinamik bir hale gelmiş olacak ve yönetici panelinden sitenize menü adı ve menü linki oluşturarak bunları yayınlayabilirsiniz. İlk etapta dinamik menü oluşturabilmek için veri tabanına ihtiyaç vardır, menü linkleriyle menü isimlerini veri tabanlarından direk olarak çekmemiz gerekmektedir. Peki, PHP ile sub menü nasıl yapılır?
İlk olarak mevcut olan bir adet veritabanımıza aşağıdaki SQL sorgularınızı aktarınız. SQL sorgusunu başarılı bir şekilde aktardıktan sonra bir sonraki adıma geçiniz, SQL sorgusunu aktarırken herhangi bir hata alırsanız bu durumu bana alt kısımdan bildirmeniz durumunda kısa sürede sizlere başka alternatif yollar sunabilirim.
SQL Sorgusu
CREATE TABLE IF NOT EXISTS `menu_main` ( `menu_id` int(11) NOT NULL AUTO_INCREMENT, `menu_name` varchar(50) NOT NULL, `menu_link` varchar(50) NOT NULL, PRIMARY KEY (`menu_id`) ) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ; CREATE TABLE IF NOT EXISTS `menu_sub` ( `sub_id` int(11) NOT NULL AUTO_INCREMENT, `menu_id` int(20) NOT NULL, `sub_name` varchar(200) NOT NULL, `sub_link` varchar(200) NOT NULL, PRIMARY KEY (`sub_id`) ) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ; CREATE TABLE IF NOT EXISTS `menu_main` ( `menu_id` int(11) NOT NULL AUTO_INCREMENT, `menu_name` varchar(50) NOT NULL, `menu_link` varchar(50) NOT NULL, PRIMARY KEY (`menu_id`) ) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ; CREATE TABLE IF NOT EXISTS `menu_sub` ( `sub_id` int(11) NOT NULL AUTO_INCREMENT, `menu_id` int(20) NOT NULL, `sub_name` varchar(200) NOT NULL, `sub_link` varchar(200) NOT NULL, PRIMARY KEY (`sub_id`) ) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ;Bu sorguda sadece menu_main ve menu_sub adında 2 tane tablo oluşturulmaktadır. Gelelim şimdi menülerin listeleneceği sayfaya.
<?php $dbcon = new MySQLi("localhost","root","","menu_dinamik"); ?> <!DOCTYPE html> <html lang="tr-TR"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>PHP İle Dinamik Menu Yapımı</title> <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script> <link rel="stylesheet" type="text/css" href="style.css" media="all" /> </head> <body> <div id="head"> <div class="wrap"><br /> <h1>PHP İle Dinamik Menu Yapımı</h1><label><a href="yeni_menu_ekle.php">Yeni menü ekle</a></label> </div> </div> <div class="wrap"> <ul id="nav"> <li><a href="#">Anasayfa</a></li> <?php $res=$dbcon->query("SELECT * FROM menu_main"); while($row=$res->fetch_array()) { ?> <li><a href="<?php echo $row['menu_link']; ?>"><?php echo $row['menu_name']; ?></a> <?php $res_pro=$dbcon->query("SELECT * FROM menu_sub WHERE menu_id=".$row['menu_id']); ?> <ul> <?php while($pro_row=$res_pro->fetch_array()) { ?><li><a href="<?php echo $pro_row['sub_link']; ?>"><?php echo $pro_row['sub_name']; ?></a></li><?php } ?> </ul> </li> <?php } ?> </ul> </div> <script type="text/javascript"> $(document).ready(function() { $('#nav li').hover(function() { $('ul', this).slideDown('fast'); }, function() { $('ul', this).slideUp('fast'); }); }); </script> </body> </html>Üst kısımdaki kodları barındıran bir sayfa oluşturup veri tabanında mevcut olan ekli üst menü ile alt menüleri listeleyebilirsiniz. Son olarak ise menü ekleme sayfasına giderek veri tabanına alt veya üst menü ekleme işlemlerini yapabilirsiniz.
<?php $dbcon = new MySQLi("localhost","root","","menu_dinamik"); if(isset($_POST['yeni_ust_menuekle'])) { $menu_name = $_POST['menu_name']; $menu_link = $_POST['mn_link']; $sql=$dbcon->query("INSERT INTO menu_main(menu_name,menu_link) VALUES('$menu_name','$menu_link')"); } if(isset($_POST['yeni_altmenuyu_ust_menuye_ekle'])) { $parent = $_POST['parent']; $proname = $_POST['sub_menu_name']; $menu_link = $_POST['sub_menu_link']; $sql=$dbcon->query("INSERT INTO menu_sub(menu_id,sub_name,sub_link) VALUES('$parent','$proname','$menu_link')"); } ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>PHP İle Dinamik Menu Yapımı</title> <link rel="stylesheet" type="text/css" href="style.css" media="all" /> </head> <body> <div id="head"> <div class="wrap"><br /> <h1>PHP İle Dinamik Menu Yapımı</h1> </div> </div> <center> <pre> <form method="post"> <input type="text" placeholder="Menü adı" name="menu name" /><br /> <input type="text" placeholder="Menü URL adresi" name="mn_link" /><br /> <button type="submit" name="yeni_ust_menuekle">Yeni üst menüyü ekle</button> </form> </pre> <br /> <pre> <form method="post"> <select name="parent"> <option selected="selected">-Üst menü seçiniz-</option> <?php $res=$dbcon->query("SELECT * FROM menu_main"); while($row=$res->fetch_array()) { ?> <option value="<?php echo $row['menu_id']; ?>"><?php echo $row['menu_name']; ?></option> <?php } ?> </select><br /> <input type="text" placeholder="Alt menü adı" name="sub_menu_name" /><br /> <input type="text" placeholder="Alt menü URL adresi" name="sub_menu_link" /><br /> <button type="submit" name="yeni_altmenuyu_ust_menuye_ekle">Yeni alt menüyü üst menüye ekle</button> </form> </pre> <a href="menu_listele.php">< anasayfaya geri dön</a> </center> </body> </html>Bu şekilde sizlerde artık dinamik menü yapımını başarılı bir şekilde tamamlayabilirsiniz, ayarlarınızı kendinize göre düzenleyerek ve CSS ayarlarınızı kendinize göre editleyerek gereken ayarları tamamlamanız durumunda sizlerde dinamik menü ile sitenizin daha dinamik olmasını sağlayabilirsiniz. PHP ile sub menü yapımını bu şekilde sizlere basitçe özetlemiş olduk.
Dosyaları İndir
PHP ile sub menü yapımında kullanmış olduğumuz bu dosyaları bilgisayarınıza indirip gereken düzenlemeleri daha rahat yapabilmek için php-ile-dinamik-menu adresine giderek gereken dosyaları indirebilirsiniz.
Yorumlar
