ul容器周围添加div

ul容器周围添加div

本文介绍了如何在wordpress ul容器周围添加div的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

 < ul class =sub-menu>> ; 

如何在它周围包装一个简单的div?



最好是通过functions.php来完成它的一种方式,但jquery也可以。

解决方案

虽然用jQuery来包装你的子菜单很容易,但为此目的使用jQuery并不是一个好习惯。把它放在functions.php中:

  class Child_Wrap extends Walker_Nav_Menu 
{
function start_lvl(& $输出,$ depth = 0,$ args = array())
{
$ indent = str_repeat(\t,$ depth);
$ output。=\\\
$ indent< div class = \custom-sub \>< ul class = \sub-menu \> \\\
;
}
函数end_lvl(& $ output,$ depth = 0,$ args = array())
{
$ indent = str_repeat(\t,$深度);
$ output。=$ indent< / ul>< / div> \\\
;




$ b我假设你的菜单是在你的标题,所以去header.php(或任何文件正在利用wp_nav_menu函数),并寻找任何开始wp_nav_menu。

因为我不有任何代码可以看到,我只能猜测它使用的参数(如果有的话)。如果它看起来像括号中的wp_nav_menu()没有任何内容,则将其更改为以下内容:

  wp_nav_menu( array('walker'=> new Child_Wrap()))

否则,请编辑您的问题您的菜单正在使用的代码,以便我可以进一步帮助您。


Wordpress outputs my child menus inside this ul tag...

<ul class="sub-menu">

how can I wrap a simple div around it?

Preferably a way to do it through functions.php, but jquery can work too.

解决方案

While it would be EASY to use something like jQuery to wrap your child menus, it is NOT good practice to use jQuery for this purpose. Place this in functions.php:

class Child_Wrap extends Walker_Nav_Menu
{
    function start_lvl(&$output, $depth = 0, $args = array())
    {
        $indent = str_repeat("\t", $depth);
        $output .= "\n$indent<div class=\"custom-sub\"><ul class=\"sub-menu\">\n";
    }
    function end_lvl(&$output, $depth = 0, $args = array())
    {
        $indent = str_repeat("\t", $depth);
        $output .= "$indent</ul></div>\n";
    }
}

I'm assuming that your menu is being generated in your header, so go to header.php (or whatever file is utilizing the wp_nav_menu function) and look for anything that starts with "wp_nav_menu".

Since I don't have any code to see, I can only guess the arguments that it's using (if any). If it looks EXACTLY like "wp_nav_menu()" with nothing in between the parenthesis, then change it to the following:

wp_nav_menu(array('walker' => new Child_Wrap()))

Otherwise, please edit your question with the code that your menu is using so I can help you further.

这篇关于如何在wordpress ul容器周围添加div的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-10 23:06