如何在移动大小的宽度中将单词Menu添加到wordpress 2014主题

时间:2014-04-07 04:46:08

标签: wordpress

我的wordpress正在运行2014主题。我希望我可以为那些不知道线条是菜单的人添加单词菜单旁边的单词菜单。此行显示的菜单仅显示网站大小缩小到移动网站的大小。该网站是dreamgardens.tlchatt.com。我已经在网上搜索了一下。我设法将自己的标题图像添加到主题中。看起来这将是一项简单的任务。通过改变style.css,我能够以两种不同的方式使按钮周围的区域更大。  看起来移动菜单的更改基于此Javascript发生。

( function( $ ) {
var body    = $( 'body' ),
    _window = $( window );

// Enable menu toggle for small screens.
( function() {
    var nav = $( '#primary-navigation' ), button, menu;
    if ( ! nav ) {
        return;
    }

    button = nav.find( '.menu-toggle' );
    if ( ! button ) {
        return;
    }

我希望移动菜单的右侧有文字菜单,就像这个网站http://chattanoogagb.kokofitclub.com/一样。我不太了解此代码,以便找到移动重新调整代码的位置,并将其更改为包含文本菜单。

上面的Java Script和PHP引用了这个style.css条目

.menu-toggle {
cursor: pointer;
font-size: 0;
height: 48px;
margin: 0;
overflow: hidden;
position: absolute;
top: 0;
right: 0;
text-align: center;
width: 48px;
}

.menu-toggle:before {
color: #fff;
content: "\f419";
margin-top: 16px;
}

\ f419似乎是指具有此代码的样式表genericons.css。

.genericon-menu:before {            content: '\f419'; }

我想知道是否有一个简单的aditional代码行,我可以在某处插入单词" Menu"移动切换菜单按钮附近的某个地方。某种潜台词或某种东西会很好。

2 个答案:

答案 0 :(得分:0)

这可能不是最优雅的方式,但你需要更改以下行1000-1004

 .menu-toggle:before {
    color: #fff;
    content: "\f419";
    margin-top: 16px;
}

到这个

.menu-toggle:before {
    color: #fff;
    content: "MENU";
    font-weight: bold;
    font-size: 12px;
    margin-top: 16px;
}

请记住,这适用于您的孩子主题'style.css。不要直接编辑二十四个主题。

答案 1 :(得分:-1)

根据您的网站,它没有响应 - 所以我假设您没有媒体查询?我会以任何方式使用插件库中的“响应选择菜单”。设置为768px,你应该都很好。让我知道你怎么样:)