WordPress bileşen panelinde menüleri istediğiniz yere yerleştirebilirsiniz. Fakat menü yöneticisi ile oluşturulan bir menüyü manuel, yani kodla ekrana için aşağıda yazdığım kodu kullanabilirsiniz. Genel olarak header.php dosyasındaki ilgili dynamic_sidebar kodunun çevresine bunu yerleştirebilir kafanıza göre yeniden tasarlayabilirsiniz.
Kısaca koddan bahsetmek gerekirse; wp_get_nav_menu_items ile ilgili menünün tüm elemanlarını çağırıp get_sub_items ile alt menüsünün olup olmadığına bakıyoruz ve farklı bir css ile görüntülüyoruz. Tabi bu alt seçeneklerin de alt menüsü olabilir. Aşağıdaki kod sadece 3 seviye derine iniyor. Tasarım olarak buradaki görünümü kullandım. Siz de aynısını (mega menü deniyor) kullanmak isterseniz css dosyasını dahil etmeyi unutmayın.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 |
function get_sub_items($items, $parent_id) { $ret = array(); foreach ( $items as $item ) if ($item->menu_item_parent == $parent_id) $ret[] = $item; return $ret; } $menu_items = wp_get_nav_menu_items('10'); echo "<ul class='nav'>"; foreach ( $menu_items as $item_l1 ) { if ($item_l1->menu_item_parent == 0) { // Level-1 echo "<li>"; echo "<a href='#'>".$item_l1->title."</a>\n"; echo "<div>"; // Level-2 $sub_1 = get_sub_items($menu_items, $item_l1->ID); if (count($sub_1)) { foreach($sub_1 as $sub1_item ) { // Level-3 $sub_2 = get_sub_items($menu_items, $sub1_item->ID); if (count($sub_2)) { echo "<div class='nav-column'>"; echo "<h3>".$sub1_item->title."</h3>\n"; echo "<ul>"; foreach($sub_2 as $sub2_item ) { echo "<li><a href='".$sub2_item->url."'>".$sub2_item->title."</a></li>\n"; } echo "</ul>"; echo "</div>"; } } } echo "</div>"; echo "</li>"; } } echo "</ul>"; |
