THE MOLITOR on "How to add the word MENU to the hamburger lines"

THE MOLITOR — Tue, 25 Jul 2017 10:59:50 +0000

I see you also posted here: http://www.themolitor.com/forums/topic/increase-page-height

Let's continue chatting about this topic over there.

Best,

Christopher

samgosper on "How to add the word MENU to the hamburger lines"

samgosper — Wed, 19 Jul 2017 21:41:30 +0000

oh ok haha.

Christopher one question- I wish to extend the front page height so fit various banners that can click through to different film pages. The issue is the page by default only scrolls so far. What do I need to edit to extend the length of the page so all banners can display without falling into the footer? thanks!

THE MOLITOR on "How to add the word MENU to the hamburger lines"

THE MOLITOR — Wed, 19 Jul 2017 09:23:36 +0000

Hi there,

Adding the word "MENU" is actually a theme option now (v 1.0.5 - Jan 2017). Navigate to the Customize page and in "site identity" is a checkbox for "Display 'MENU' Text Link".

Best,

Christopher

samgosper on "How to add the word MENU to the hamburger lines"

samgosper — Tue, 18 Jul 2017 21:32:28 +0000

Hey guys,

Just thought I would update all how to place the word MENU next to the lines that open up the menu. I found out how to do this myself and have had so many people contact me about it.

Open up Theme Header (header.php) in WP editor, find MENU CONTROL.

Here is the code:

<div id="menu-control"><p style="margin-left:-80px;margin-top:2px;">MENU</p><SPAN></span></div>

Where MENU is in capitals, is what the word shall be next to the lines.

Its been a while so I can't remember if this alone will place it perfectly next to the lines, if it's not in line just change the margins until you get it right.

You MAY have to also open up the css style sheet and go to MAIN NAVIGATION STUFF, there's a bunch of menu control options there to control font size etc, so here is a copy paste of my settings there as well:

#menu-control {
color: #fff;
font-size: 27px;
position: absolute;
right: 20px;
top: 35px;
z-index: 101;
cursor: pointer;
display: block;
height: 10px;
width: 30px;
border-top: 10px solid #fff;

display: block;

border: none;
height: 50px;
top: 10px;
outline:10px solid transparent;
}
#menu-control span {
height: 2px;
width: 30px;
display: block;
position: absolute;
top: 50%;
left:0%;
background: #fff;
margin-top: -1px;

-webkit-transition: background 0 0.3s;
transition: background 0 0.3s;
}
#menu-control span::before,
#menu-control span::after {
content: '';
position: absolute;
left: 0;
height: 2px;
width: 100%;
background: #fff;
display:
-webkit-transition:bottom 0.30s linear,top 0.30s linear;
-moz-transition:bottom 0.30s linear,top 0.30s linear;
-o-transition:bottom 0.30s linear,top 0.30s linear;
transition:bottom 0.30s linear,top 0.30s linear; ;

-webkit-transition-duration: 0.3s, 0.3s;
-moz-transition-duration: 0.3s, 0.3s;
transition-duration: 0.3s, 0.3s;

-webkit-transition-delay: 0.3s, 0;
-moz-transition-delay: 0.3s, 0;
transition-delay: 0.3s, 0;
}
#menu-control span::before {
top: -8px;
-webkit-transition-property: top, -webkit-transform;
-moz-transition-property: top, -moz-transform;
transition-property: top, transform;
}
#menu-control span::after {
bottom: -8px;
-webkit-transition-property: bottom, -webkit-transform;
-moz-transition-property: bottom, -moz-transform;
transition-property: bottom, transform;

I for one love having the word Menu next to the hamburger lines, many people just are not drawn to it otherwise.

THE MOLITOR FORUMS » Topic: How to add the word MENU to the hamburger lines

THE MOLITOR on "How to add the word MENU to the hamburger lines"

samgosper on "How to add the word MENU to the hamburger lines"

THE MOLITOR on "How to add the word MENU to the hamburger lines"

samgosper on "How to add the word MENU to the hamburger lines"