Question

我正在使用Bigfoot主题http://themes.thehappybit.com/themes/bigfoot/而我正试图弄清楚如何在我的网页桌面版本的切换触发器旁边添加“MENU”。我认为这对桌面访问者来说有点混乱就像现在一样。我在哪里管理这个？非常感谢任何指导！

以下是我正在寻找/尝试完成的内容的参考：http://themes.thehappybit.com/themes/rockford/

标题php＆amp;切换php

<!doctype html>
<html <?php language_attributes(); ?> <?php thb_html_class(); ?>>
<head>
    <?php thb_head_meta(); ?>

    <title><?php thb_title(); ?></title>

    <?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>

    <?php thb_body_start(); ?>

    <div id="page">

        <?php thb_header_before(); ?>

        <header id="header">
            <?php thb_header_start(); ?>

            <div class="header-container">

                <div class="wrapper">
                    <?php
                        $logo = thb_get_option('main_logo');
                        $logo_2x = thb_get_option('main_logo_retina');

                        if( !empty($logo['id']) && !empty($logo_2x['id']) ) : ?>
                        <?php $logo_metadata = wp_get_attachment_metadata($logo['id']); ?>
                        <style>
                            @media all and (-webkit-min-device-pixel-ratio: 1.5) {
                                #logo {
                                    background-image: url('<?php echo thb_image_get_size($logo_2x['id'], 'full'); ?>');
                                    background-size: <?php echo $logo_metadata['width']; ?>px, <?php echo $logo_metadata['height']; ?>px;
                                }

                                #logo img { visibility: hidden; }
                            }
                        </style>

                        <?php endif;
                    ?>
                    <h1 id="logo">
                        <a href="<?php echo home_url(); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>">
                            <?php if( isset($logo['id']) && $logo['id'] != '' ) : ?>
                                <img src="<?php echo thb_image_get_size($logo['id'], 'full'); ?>" alt="">
                            <?php else : ?>
                                <?php bloginfo( 'name' ); ?>
                            <?php endif; ?>
                        </a>
                    </h1>

                    <?php thb_nav_before(); ?>

                    <a href="#" id="nav-trigger">m</a>

                    <div class="nav-wrapper">
                        <nav id="main-nav" class="main-navigation primary">
                            <?php thb_nav_start(); ?>

                            <?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>

                            <?php thb_nav_end(); ?>
                        </nav>

                        <nav id="mobile-nav" class="main-navigation primary">
                            <?php thb_nav_start(); ?>

                            <?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>

                            <?php thb_nav_end(); ?>
                        </nav>
                    </div>
                    <?php thb_nav_after(); ?>
                </div>
            </div>

            <div class="wrapper">

切换php

<div class="thb-shortcode thb-toggle <?php echo implode(' ', $class); ?>">
<h1 class="thb-toggle-trigger">
    <?php echo $title; ?>
</h1>

<div class="thb-toggle-content">
    <?php echo thb_text_format($content, true); ?>
</div>

Answer 1

尝试这样的事情：

<a href="#" id="nav-trigger">
    <span style="font-family: Arial;">MENU</span> m
</a>

您遇到的问题是menüicon不是内联或背景图像，而是字体字符。 a-tag使用一种字体，m代表这个menuicon。因此，将另一个元素放在a-tag中并给它另一个font-family应该可以解决问题。

在切换旁边添加“MENU”（文本）？

1 个答案: