将类添加到 wp_list_pages 中的链接答案

【问题标题】：Add class to link in wp_list_pages将类添加到 wp_list_pages 中的链接
【发布时间】：2013-09-19 23:10:45
【问题描述】：

我正在尝试在 wp_list_pages() 函数中的列表项上创建悬停效果。我正在为 Wordpress 创建一个主题，但似乎无法使悬停效果起作用。我对此很陌生，所以请耐心等待。

我的 CSS 看起来像这样：

a.nav:hover { color: yellow; }

所以对于我的 html 代码，我将“nav”类添加到我的链接中，如下所示：

<ul class="nav">
<li><a class="nav" href="#">HOME</a></li>
</ul>

这可行，它将链接的颜色更改为黄色。到目前为止，一切都很好。但是当我尝试将此 html-code 更改为 php-code 时，该类不存在。

我使用wp_list_pages()函数，像这样：

<ul class="nav">
<?PHP wp_list_pages('title_li=&depth=1&sort_column=menu_order&exclude='); ?>
</ul>

然后结果是：

<ul class="nav">
<li class="page_item page-item-23"><a href="http://example.com/blog/page_id=23">HOME</a></li></ul>

所以我的问题是，如何将nav 类添加到此链接？函数中是否有属性或什么？再说一次，我真的很陌生

【问题讨论】：

ul 和 a 的类 nav 似乎不正确。

标签： php html css wordpress

【解决方案1】：

我认为更改 wp_list_pages 函数的默认类的正确方法是：

// add to functions.php

// add classes to wp_list_pages
function wp_list_pages_filter($output) {
  $output = str_replace('page_item', 'page_item new-class', $output);
  return $output;
}
add_filter('wp_list_pages', 'wp_list_pages_filter');

【讨论】：

【解决方案2】：

看看this。

引用：“将以下行添加到您主题的functions.php模板文件中，它将为wp_list_pages（）生成的每个链接添加一个“tag”的类属性：

add_filter('wp_list_pages', create_function('$t', 'return str_replace("<a ", "<a class=\"tag\" ", $t);'));

【讨论】：

对于那些正在寻找解决方案的人来说，create_function 是deprecated as of PHP 7.2.0。对于使用 PHP >= 5.3.0 的人，相同的文档推荐使用匿名函数。
不需要将其设为内联函数。不妨创建一个正则函数，名称如 add_class_to_wp_list_pages，并称其为 add_filter( 'wp_list_pages', 'add_class_to_wp_list_pages' );

【解决方案3】：

来自wp_list_pages() http://codex.wordpress.org/Function_Reference/wp_list_pages#Markup_and_styling_of_page_items 的 wordpress 文档：

由 wp_list_pages() 生成的所有列表项 (li) 都标有 page_item 类。当显示页面时调用 wp_list_pages() 时，该页面的列表项将被赋予附加类 current_page_item。

这样，您可以做的最简单的事情就是将悬停代码更改为：

li.page_item:hover { color: yellow; }

【讨论】：

其实我已经做到了。你看，我的列表项是块，100x100 像素，颜色从黑色变为黄色。问题是，我的链接在块内，我希望文本也能改变颜色，从白色变为黑色。无论如何，谢谢你的提示；）
@HåvardBrynjulfsen 在这种情况下，只需选择 li.page_item:hover a { /* change link's color here */ }
卡了好几个小时，非常感谢！有效！ ;)
@HåvardBrynjulfsen 没问题 :)