PHP/Wordpress - 向父菜單添加箭頭

是否可以在子菜單（在Wordpress中）的菜單中添加某種類，如「箭頭」或跨度？似乎你可以做到這一點是使用JavaScript，但我想知道是否有PHP解決方案...PHP/Wordpress - 向父菜單添加箭頭

在WP 3.0中，我看到活動菜單上有他們的「父」或「祖先」類，但這隻適用於活動菜單，我也需要它用於非活動菜單

2010-08-24 Alex

你在3.0中使用菜單生成器嗎？或者您是否使用網頁或類別進行導航？請詳細說明您如何獲取菜單並說明您的工作代碼，以便我們能夠更好地爲您提供幫助。 – kevtrout 2010-08-24 18:24:19

我使用內置的自定義菜單 – Alex 2010-08-24 18:40:31

這個功能真的應該在WordPress核心！
無論如何，我看了一下你在另一個答案的評論中發送的菜單模板源，並且發現了一個（非常冒險的）方法來添加帶有子項的菜單項的類。它基本上將默認walker的子類擴展爲默認行爲。這可能是最好的，如果你把它放在你的主題functions.php。下面的代碼：

<?php 
class Arrow_Walker_Nav_Menu extends Walker_Nav_Menu { 
    function display_element($element, &$children_elements, $max_depth, $depth=0, $args, &$output) { 
     $id_field = $this->db_fields['id']; 
     if (!empty($children_elements[$element->$id_field])) { 
      $element->classes[] = 'arrow'; //enter any classname you like here! 
     } 
     Walker_Nav_Menu::display_element($element, $children_elements, $max_depth, $depth, $args, $output); 
    } 
} 
?>

調用它，你需要當你調用在你的主題wp_nav_menu()添加walker說法，就像這樣：

<?php 
wp_nav_menu(array('walker' => new Arrow_Walker_Nav_Menu, [other arguments...])) 
?>

希望對你有用！我只是表面上測試過，但它似乎工作。讓我知道是否有任何邊緣情況下添加類失敗。

來源

2010-08-29 11:40:14

聖潔的廢話它的作品！謝謝：D – Alex 2010-08-29 13:55:49

存在ony失敗的情況：當在參數（fallback_cb）中指定回調函數時，即。當您沒有創建自定義菜單時，wp_nav_menu將從wp_page_menu（）函數中檢索菜單項，該函數使用不同的Walker我認爲 – Alex 2010-08-29 14:26:08

是的 - wp_page_menu使用的walker不允許非常容易地添加類。我會看看，看看我能否在未來幾天內想到一個解決方法，如果我發現任何問題，我會編輯我的答案。 – 2010-09-05 10:27:13

我不知道任何原生的WordPress支持，但您可以輕鬆地使用一些jQuery來做到這一點。

<script type="text/javascript"> 
$("#menu-id ul li:has(ul)").addClass("parent"); 
</script>

來源

2010-08-24 16:38:39 GoalieGuy6

謝謝，我知道這一點。我想知道是否有辦法用PHP來做到這一點。 js方法的問題在於，如果菜單項的寬度可變，則在頁面加載過程中會出現小的「閃爍」 – Alex 2010-08-28 13:26:02

因此，您需要一種方法來修改WP在生成HTML時生成的HTML ，然後？有沒有內置的支持，或者你可以自定義模板？ – Rup 2010-08-28 13:31:05

以及你可以得到整個菜單輸出（一個字符串）並修改它之前它得到迴應，但我不知道我可以改變那裏... 菜單模板在這裏：http：//core.trac .wordpress.org/browser/trunk/wp-includes/nav-menu-template.php – Alex 2010-08-28 13:39:22

簡單而不起眼的方式來添加類的父主菜單是否有子菜單

而且風格

<style type="text/css"> 
     .main-navigation .parent > a, .main-navigation .parent > a:hover { 
      background-image: url("images/arrow.png"); 
      background-position: right center; 
      background-repeat: no-repeat; 
    } 

    </style>

來源

2013-01-28 06:31:08

如果你和我一樣，想添加在您的父菜單項中添加一個HTML箭頭，在Donald Harvey的客戶助理類中添加一條像這樣的線：

$element->title .= '<span class="caret down-caret">&#x25BC;</span>';

你也可以直接將HTML添加到WP管理>菜單頁面中的菜單標籤，但這不是一個好辦法。

我在博客一點關於這個在這裏http://cameronnokes.com/blog/adding-an-icon-to

來源

2013-07-15 00:30:48 ccnokes

我不知道是什麼問題，但我們可以在菜單中通過css這樣添加箭頭：

.menu li > a:after { 
    color: #fff; 
    content: ' ▾'; 
} 

.menu li > a:only-child:after { 
    content: ''; 
}

來源

2014-03-27 06:36:28

只需粘貼這對你的CSS代碼，它會按預期工作。

.nav-menu li > a:after { 
    color: #888; 
    content: ' ▾'; 
} 

.nav-menu li > a:hover:after { 
    color: #444; 
    content: ' ▾'; 
} 

.nav-menu li > a:only-child:after { 
    content: ''; 
}

^{Ps。不要忘記設置頁面UTF-8}

來源

2016-07-30 15:34:34 paulalexandru

PHP/Wordpress - 向父菜單添加箭頭

回答

相關問題