Replacing Twenty Twelve mobile device menu button with a single link (2 posts)

  1. jakubsnm21
    Posted 2 years ago #

    I've tried for hours but can't quite figure out how to just replace (on mobile devices only) the menu button with a simple link leading to one of my pages...

  2. paulwpxp
    Font hero
    Posted 2 years ago #

    Create a child theme

    It's important that you move on only if you got a child theme setup and activated properly.

    Make a copy of header.php from parent theme and put in child theme's folder, then add the link you want just below the h3 with menu-toggle class.

    Notice the <a class="myownlink">..</a> and its position.

    <nav id="site-navigation" class="main-navigation" role="navigation">
    	<h3 class="menu-toggle">..</h3>
    	<a class="myownlink">..</a>
    	<a class="assistive-text">..</a>
    	<?php wp_nav_menu(); ?>

    And then put this in your child theme's style.css

    .menu-toggle {display: none;}
    .myownlink {display:inline-block;font-size:16px;line-height:2;font-weight:bold;}
    @media screen and (min-width: 600px) {
    	.myownlink {display:none;}

Topic Closed

This topic has been closed to new replies.

About this Topic