所以我对 WP 还很陌生,虽然我对 WP 导航栏有一些经验,但这是相当独特的。我正在尝试在 wp 生成的导航中注入很棒的字体图标。
基本上,当我在 wp 中创建菜单时:<?php wp_nav_menu( array( 'theme_location' => 'header-menu' ) ); ?>
WP 将为我生成:
<div class="menu-main-menu-container">
<ul id="menu-main-menu" class="menu">
<li id="menu-item-15" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-7 current_page_item menu-item-15">
<a href="localhost_link/frontpage" aria-current="page">Home</a>
</li>
<li id="menu-item-14" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-14">
<a href="localhost_link/blog/">Listen</a>
</li>
</ul>
</div>
有没有办法使用 ACF,或者 wp_admin 或其他地方的某些东西能够用 2 个不同的字体真棒图标替换链接文本(特别是上面示例中的“home”和“listen”)?
像这样:
<li id="menu-item-15" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-7 current_page_item menu-item-15">
<a href="localhost_link/frontpage" aria-current="page"><i class="fas fa-play-circle"></i></a>
</li>
<li id="menu-item-14" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-14">
<a href="localhost_link/blog/"><i class="fas fa-play-circle"></i></a>
</li>
请注意:我不能(除非有人有更好的方法)使用fas fa-play-circle
每个链接的类(就像在 wp 管理菜单编辑器中一样),因为这会将其放置在锚点上,这would没问题,除非我已经在使用了:before
位于锚元素上并有 2 种样式:before
伪类不能很好地协同工作。
另外,我想要图标的功能(颜色、悬停等),所以使用 css 背景也是不可行的。
甚至不确定这是否可能,但我希望如此!提前致谢!
您可以使用preg_replace
。简而言之,我们定义一个匹配$search
参数,然后我们将其替换为我们想要的。
在这里我们将搜索>Home<
and >Listen<
.
<?php
/**
* do_action( 'wp_loaded' )
* This hook is fired once WP, all plugins, and the theme are fully loaded and instantiated.
* @link https://developer.wordpress.org/reference/hooks/wp_loaded/
*/
add_action( 'wp_loaded', function() {
function wp_custom_fontawesome_nav( $subject ) {
if( ! is_admin() ) {
$search = [
'/>Home</', // ... >Home< with the brackets, to be sure to target the right Home word
'/>Listen</', // ... etc.
// ... etc.
];
$replace = [
'><i class="fas fa-play-circle"></i><', // ... Our replacement for Home
'><i class="fas fa-drum"></i><', // ... Our replacement for Listen
// ... etc.
];
$subject = preg_replace( $search, $replace, $subject );
return $subject;
};
};
ob_start( 'wp_custom_fontawesome_nav' );
} ); ?>
把它放在你的某个地方function.php
file.
了解更多
-
preg_replace
@ https://www.php.net/manual/en/function.preg-replace.php https://www.php.net/manual/en/function.preg-replace.php
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)