Question

我目前正在使用WordPress网站。除了我的导航，一切都很好。我不想使用WordPress使用的标准文本和基于CSS的导航，但是插入我自己的导航图形图像（PNG文件，如果需要可以更改文件类型）。

有没有人知道WordPress的任何插件允许您在导航中使用图像而不是文本？

此致纳德

Answer 1

你想拥有自己的css文件吗？如果它是你可以用这个来对wordpress说使用你自己的css文件：

wp_enqueue_style( $handle, $src, $deps, $ver, $media );

示例：

<?php

    /*
     * This example will work with WordPress 2.7
     */

    /*
     * register with hook 'wp_print_styles'
     */
    add_action('wp_print_styles', 'add_my_stylesheet');

    /*
     * Enqueue style-file, if it exists.
     */

    function add_my_stylesheet() {
        $myStyleUrl = plugins_url('style.css', __FILE__); // Respects SSL, Style.css is relative to the current file
        $myStyleFile = WP_PLUGIN_DIR . '/myPlugin/style.css';
        if ( file_exists($myStyleFile) ) {
            wp_register_style('myStyleSheets', $myStyleUrl);
            wp_enqueue_style( 'myStyleSheets');
        }
    }

?>

Answer 2

更改导航栏的输出需要设置wp_navmenu（）函数输出的样式。你可以用firebug看到那个输出。这看起来像是：

<li id="menu-item-689" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-689">
    <a href="#">Categories</a>
</li>

使用背景图像定位id或类，并可选择隐藏菜单文本。建议的方法是使用子主题中的style.css文件。根本不要弄乱父母的文件。只需在新的style.css文件中导入它们即可。检查making child themes上的代码。

尝试这样的事情：

#menu-item-689{
    background-image: url('whatever.img');
    margin: -999em;
    font-size: 0;
}

不要使用display:none，因为您希望屏幕阅读器阅读它。另一种方法是将整个列表的定位设置为绝对值并设置left: -999em。

WordPress导航与图像

2 个答案: