【问题标题】:Wordpress insert shortcode into menu itemWordpress 将简码插入菜单项
【发布时间】:2018-07-16 19:37:20
【问题描述】:

我有这样的问题。在 functions.php 我有这样的代码:

function Svg_Path($attr) {
    $a = shortcode_atts(array(
        'path' => 'Some text'
    ), $attr);
    $svg = '<svg class="menu-item-icon"><use xlink:href=' . get_template_directory_uri(). '/img/svg/sprite.svg' . $a["path"] . '></use></svg>';
    return $svg;
}
add_shortcode( 'SvgPath', 'Svg_Path' );

通常我可以在pageBuilder中使用这个

<div>[SvgPath path='#logo__skype']</div>

结果将是显示的 Skype 图标。但是,当我尝试将此简码插入 Appearence>Menu>Link text 时,我将简码作为纯文本获取

Where do I try to input my shortcode

那么你能帮我解决这个问题,这样我就可以从菜单项中的 svg sprite 接收 skype 徽标

【问题讨论】:

    标签: php css wordpress svg shortcode


    【解决方案1】:

    试试下面的代码。该代码将解析您的简码并向您显示简码内容。它只适用于前端。

    add_filter( 'the_title', function( $title, $item_id ) {
        if ( 'nav_menu_item' === get_post_type( $item_id ) ) {
            return do_shortcode( $title );
        }
        return $title;
    }, 10, 2 );
    

    【讨论】:

    • 对不起。我对 PHP 很陌生。但是如何将此代码与我的简码连接起来?
    • 将代码添加到您的functions.php 文件中,一切都会如您所愿。
    • 很高兴听到这个消息:)
    • 自 2020 年起,这会随机导致网站在 WP 尝试构建菜单时崩溃。无法弄清楚到底是什么原因造成的,有时可以正常工作,但有时肯定不行。
    • 也许菜单有很多项目,因为短代码有一个昂贵的数据库调用。您可以尝试缓存菜单。这可能有助于gist.github.com/bjornjohansen/5fa3aa830b7ce7b8244e17cc8924eb64
    【解决方案2】:

    您不能使用更新后的 FontAwesome 来创建它并将其添加到您的菜单中吗?

    https://fontawesome.com/icons/skype?style=brands 可以帮到你。

    【讨论】:

    • 重点是我有一个大菜单,甚至还有几个大菜单。所以每个菜单项都有自己的图标。为了减少请求,我从所有这些 svg 中制作了一个精灵。我可以通过 内联粘贴这个图标。但我不喜欢它在管理菜单中的样子,想使用简码
    • 但您将发出一个请求,即 FontAwesome 库,然后调用菜单部分中的每个项目,例如 。 FontAwesome 会做同样的想法,因为您的精灵无需调用任何短代码。我想说的另一种方法是为每个图标创建类并仅在菜单项中调用该类而不是代码,但 FontAwesome 选项更容易实现。无论哪种方式都可以工作。
    • 谢谢,我会试试的。但是有了这个简码,这对我来说就像是一个痛苦的问题。我今天花了几个小时试图了解哪里出了问题。所以我正在寻找带有简码的解决方案。我将实现 FontAwsome,但我仍然想知道如何使用简码来实现。
    • 对我来说主要的事情是尝试让它成为您添加/更新图标的最简单方法,并且根据我自己的个人经验,使用 FontAwesome 一直是我走的路线。我从未在菜单的管理部分使用过简码,但可以看到它们可能会以与 FontAwesome 相同的方式工作,但这种方式似乎比使用 。让我知道这是怎么回事。
    • 后帮真的解决了我想要的一切。但我也喜欢您的解决方案,将尝试在下一个站点实施它。
    猜你喜欢
    • 2012-07-09
    • 2017-05-13
    • 2015-08-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-09-27
    相关资源
    最近更新 更多