在主菜单下的标题中添加徽标

Posted

技术标签:

【中文标题】在主菜单下的标题中添加徽标【英文标题】:Adding A Logo in Header Under Primary Menu 【发布时间】:2012-12-20 00:53:38 【问题描述】:

感谢您花时间阅读本文。我的标题几乎总结了我遇到的问题。通常我会在这些类型的事情中摸索,但最终会以错误的方式完成,因此我的网站最终会出现问题。我正在努力学习正确的方法来编写所有代码并让它变得干净整洁。

这是我正在使用的 WordPress 模板。这是我的site 的链接。我已经设置了一个子主题,并且喜欢它的大部分内容,除了我想在“menu-primary”下的所有页面上放置一个站点徽标它在标题中调用。在页面的左上角是我的网站标题和我的网站口号或任何你称之为的位置。下面是我的菜单(menu-primary),所有提到的都在标题中。我的模板不允许我在设置或自定义的标题中插入徽标。我想在菜单部分正下方的页面中间插入一个站点徽标。我想我可能应该让它可点击到我的主页或其他东西,并确保它是有效的Xhtml clickable header image?我不确定这是否是一个坏主意,或者没有看到网站标题将链接回主页。在我的所有页面上都有两个指向同一个地方的链接是不是很糟糕?我假设是这样。我猜我真的不需要图片来链接。

有没有人可以帮助我解决这个问题?我感谢所有输入。这个网站在教我基础知识方面非常有帮助。我在这里看到了做我想做的事情的方法,但恐怕它们都不是正确的方法。再次感谢!

这里是header.php

<?php
/**
 * Header Template
 *
 * The header template is generally used on every page of your site. Nearly all other templates call it 
 * somewhere near the top of the file. It is used mostly as an opening wrapper, which is closed with the 
 * footer.php file. It also executes key functions needed by the theme, child themes, and plugins. 
 *
 * @package Save for Web
 * @subpackage Template
 */
?>
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta http-equiv="Content-Type" content="<?php bloginfo( 'html_type' ); ?>; charset=<?php bloginfo( 'charset' ); ?>" />
<title><?php hybrid_document_title(); ?></title>

<link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>" type="text/css" media="all" />
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />

<?php wp_head(); // wp_head ?>

</head>

<body class="<?php hybrid_body_class(); ?>">

    <?php do_atomic( 'open_body' ); // saveforweb_open_body ?>

    <div id="container">

        <?php do_atomic( 'before_header' ); // saveforweb_before_header ?>

        <div id="header">

            <div class="fixed">

                <?php do_atomic( 'open_header' ); // saveforweb_open_header ?>

                <div class="wrap">

                    <div id="branding">
                        <?php hybrid_site_title(); ?>
                        <?php hybrid_site_description(); ?>
                    </div><!-- #branding -->

                    <?php get_template_part( 'menu', 'primary' ); // Loads the menu-primary.php template. ?>

                    <?php get_sidebar( 'header' ); // Loads the sidebar-header.php template. ?>

                    <?php do_atomic( 'header' ); // saveforweb_header ?>

                </div><!-- .wrap -->

                <?php do_atomic( 'close_header' ); // saveforweb_close_header ?>

            </div><!-- .fixed -->

        </div><!-- #header -->

        <?php do_atomic( 'after_header' ); // saveforweb_after_header ?>

        <?php do_atomic( 'before_main' ); // saveforweb_before_main ?>

        <div id="main">

            <div class="wrap">

            <?php do_atomic( 'open_main' ); // saveforweb_open_main ?>

这里是 menu-primary.php:

<?php
/**
 * Primary Menu Template
 *
 * Displays the Primary Menu if it has active menu items.
 *
 * @package Save for Web
 * @subpackage Template
 */

if ( has_nav_menu( 'primary' ) ) : ?>

    <?php do_atomic( 'before_menu_primary' ); // saveforweb_before_menu_primary ?>

    <div id="menu-primary" class="menu-container">

            <?php do_atomic( 'open_menu_primary' ); // saveforweb_open_menu_primary ?>

            <?php wp_nav_menu( array( 'theme_location' => 'primary', 'container_class' => 'menu', 'menu_class' => '', 'menu_id' => 'menu-primary-items', 'fallback_cb' => '' ) ); ?>

            <?php do_atomic( 'close_menu_primary' ); // saveforweb_close_menu_primary ?>

    </div><!-- #menu-primary .menu-container -->

    <?php do_atomic( 'after_menu_primary' ); // saveforweb_after_menu_primary ?>

<?php endif; ?>

【问题讨论】:

如果不知道这个主题是如何组合在一起的,我们很难回答您的问题。您可能需要编辑包含菜单代码的任何模板文件,然后将徽标添加到它的末尾。这应该不难,但我认为除非我们有更多信息,否则我们无法为您提供帮助。 我试图描述如何按照@ChrisHerbert 的建议去做。我想说我不知道​​你还能给我们什么其他信息。我认为你的问题甚至可以更简洁。但是,我们无法确切地告诉您该怎么做,因为我们面前没有模板;这就是问题的本质。 感谢大家的回复!克里斯,什么样的附加信息会有帮助?我进行了编辑并包含了 header.php 希望对您有所帮助。 看起来菜单可能包含在 menu-primary.php 中 【参考方案1】:

为您生成菜单的函数很可能是wp_nav_menu。所以第一步是找出它在模板源代码中的位置。例如,可能在 header.php 中。确保它的参数是“theme_location => 'menu-primary'”,这样你就有了正确的菜单,以防你的模板有多个。

接下来,复制这段代码并粘贴到下面:

<a href="<?php bloginfo( 'url' ); ?>"><img src="<?php bloginfo( 'stylesheet_directory' ); ?>/images/..."  title="" /></a>

您必须调整 src=... 部分,使其与标题图片的 URL 匹配。

【讨论】:

嗨,卡莱!谢谢回复。我编辑了上面的问题并包含了 header.php 和 menu-primary.php。 menu-primary.php 是 wp_nav_menu 所在的位置。我添加了您建议的代码(未在我的编辑中显示),但没有看到任何更改。有任何想法吗?感谢您的时间和耐心。 查看网站的源代码(在浏览器中右键单击,查看源代码),图像应该在哪里。 img 标签在吗? 。

以上是关于在主菜单下的标题中添加徽标的主要内容,如果未能解决你的问题,请参考以下文章

Magento:如何在主导航菜单的下拉菜单中添加活动产品

Wordpress:自定义徽标和菜单/侧边栏切换的问题

菜单项未清除 Bootstrap 导航栏中的徽标

新的 SVG 徽标 - 菜单不起作用 Wordpress

php 标题布局:菜单顶部,徽标居中

css Genesis徽标和标题菜单交换