[oik] plugins.com

WordPress plugins and themes

  • Home
  • About
    • lazy shortcodes
    • smart shortcodes
    • oik base plugin
      • oik – donate
      • oik PayPal buttons
      • oik installation
      • oik Button Shortcode button
      • oik changelog
      • oik FAQ
      • oik plugins on SVN
      • oik plugins on GitHub
  • Plugins
    • oik base plugin
    • FREE oik plugins
    • WordPress plugins
    • Premium oik plugins
    • Bespoke oik plugins
  • Shortcodes
    • Shortcode examples
  • Blocks
    • Block examples
  • APIs
    • ALL action and filter hooks
  • Blog
  • #
  • &
  • A
  • B
  • C
  • D
  • E
  • F
  • G
  • H
  • I
  • J
  • L
  • M
  • N
  • O
  • P
  • Q
  • R
  • S
  • T
  • U
  • V
  • W
  • [

How to fix an unresponsive Menu button in child themes of TwentyTwelve

Recently we noticed that the Menu button in child themes of TwentyTwelve was not behaving correctly; it was not expanding when you clicked on it. We tracked it down to a change in the parent theme, between version 1.4 and 1.5. New versions of oik2012, oik20120 and other bespoke themes built as child themes of TwentyTwelve will be made available in due course. In the mean time, here’s a brief explanation and some notes about our planned fix.

The problem

The TwentyTwelve theme has a responsive menu that reduces to a single Menu button when the window width is narrower than 600 pixels. Pressing the Menu button should reveal the menu, in a vertical list.

1. oik20120 – menu greater than 600 pixels

2. oik20120 – menu less than 600 pixels

3. oik20120 – menu button pressed

With version 1.5, any clicking or pressing on the Menu button is ignored. The menu items do not get displayed. The problem is not restricted to mobile devices – you can recreate the problem with a window width less than 600 pixels.

Fix

The fix requires a change to the header.php file in the child theme. Replace

<h3 class="menu-toggle"><?php _e( 'Menu', 'twentytwelve' ); ?></h3>
 
with

<button class="menu-toggle"><?php _e( 'Menu', 'twentytwelve' ); ?></button>
 
Note: This fix will work when the Menu has already been broken due to TwentyTwelve having been upgraded.

Compatibility fix for oik child themes

Q. But what if you deliver a fix to your theme but TwentyTwelve is still at v1.4? A. The fix will cause the problem to occur until TwentyTwelve is upgraded. The solution for oik plugins’ child themes is to use a function that will test the current version of TwentyTwelve, and behave accordingly. In functions.php we add the following function

You appear to be a bot. Output may be restricted


function oik20120_menu_toggle() {
  $installed_theme = wp_get_theme( "twentytwelve" );
  if ( $installed_theme->exists() ) {
    $version =  $installed_theme->get('Version');
    if ( version_compare( $version, 1.5, 'ge' ) ) {
    ?>
      <button class="menu-toggle"><?php _e( 'Menu', 'twentytwelve' ); ?></button>
    <?php } else { ?>    
      <h3 class="menu-toggle"><?php _e( 'Menu', 'twentytwelve' ); ?></h3>
    <?php
    }
  }
}
&#91;/bw_api&#93;
and change <code>header.php</code> to use this function
[bw_api]
<?php oik20120_menu_toggle(); ?>
 

oik plugins fix

A version of the above fix will be developed, tested and delivered for the following themes:
  • oik2012
  • oik20120 – Twenty Twelve child theme
  • bespoke themes based on TwentyTwelve

See also

  • wordpress.stackexchange.com/questions/165587/twentytwelve-child-theme-mobile-menu-not-working/166490#166490
  • WordPress TRAC #28824
  • wordpress.org/support/topic/menu-not-opening-on-smartphones?replies=3

Published: October 27, 2014 | Last updated: December 4, 2020

Filed Under: News, oik2012, oik20120, themes

Information

Component:

Recent plugin updates

oik v4.7.2 oik v4.7.2 includes a fix to the logic to render blocks for Content and Excerpts in the bw_pages shortcode. ...
oik v4.7.1 Upgrade to oik v4.7.1 for bw_pages rendering blocks for Content and Excerpts, and support for post_name attribute for shortcode which query posts ...
oik-shortcodes v1.41.1 Upgrade to oik-shortcodes v1.41.1 for a couple of minor changes. ...
oik-bob-bing-wide v2.2.2 Upgrade to oik-bob-bing-wide v2.2.2 for improvements to bw_dash examples and fixes to some SVG icon's visibility. ...
oik-bwtrace v3.3.1 Upgrade to oik-bwtrace v3.3.1 to measure plugin load times and ad hoc action timing points. ...

Plugins

  • All Plugins
  • oik base plugin
  • FREE oik plugins
  • WordPress plugins
  • Premium oik plugins

Themes

  • FREE themes
  • Bespoke themes
  • Premium themes

Blocks

  • All Blocks
  • Block examples
  • About Blocks

Shortcodes

  • All Shortcodes
  • Shortcode examples
  • About Shortcodes

Reference

  • About APIs
  • All APIs
  • All Classes
  • All Files
  • All Hooks

Support

  • Contact
  • Cookies policy
  • Get API key
  • Privacy
  • Request support
  • Sitemap
  • Stay informed
  • Terms and Conditions
oik-plugins
Email: [email protected]

Weight shipping plugins

Find out which cart weight shipping plugin you need for your WooCommerce site.
Which cart weight based plugin do I need?

Site:  www.oik-plugins.com
© Copyright oik-plugins 2011-2022. All rights reserved.


Website designed and developed by Herb Miller of Bobbing Wide
Proudly powered by WordPress and oik-plugins