Handheld Menu in Footer Bar

  • hi, i am using Storefront theme with WooCommerce, i want to replace Cart Menu with Handheld menu on Mobile Screens, i am using Hamburger menu.
    i have placed Menu Button inplace of Cart by Using this Code

    		if ( ! function_exists( 'storefront_handheld_footer_bar_cart_link' ) ) {
	/**
	 * The cart callback function for the handheld footer bar
	 *
	 * @since 2.0.0
	 */
	function storefront_handheld_footer_bar_cart_link() {
		?>
			<nav id="site-navigation" class="main-navigation" role="navigation" aria-label="<?php esc_html_e( 'Primary Navigation', 'storefront' ); ?>">
		<button class="menu-toggle" aria-controls="site-navigation" aria-expanded="false"><span><?php echo esc_attr( apply_filters( 'storefront_menu_toggle_text', __( 'Menu', 'storefront' ) ) ); ?></span></button>
			<?php
			wp_nav_menu(
				array(
					'theme_location'	=> 'handheld',
					'container_class'	=> 'handheld-navigation',
					)
			);
			?>
		</nav>		
		<?php
	}
}

    but it is now just showing icons and not any text of menus i suppose this is because it is taking CSS from storefront-handheld-footer-bar , any help will be appreciated.

Viewing 1 replies (of 1 total)

  • Hey,

    This is a pretty big customisation and is beyond what this feature is really designed to handle.

    I’d recommend adding your navigation button using the storefront_handheld_footer_bar_links filter but keep the navigation itself outside of the footer bar to avoid it inheriting the icon styles you mentioned.

    Then just use some js to toggle the visibility of the menu and apply some css to style/position it.

Viewing 1 replies (of 1 total)
  • The topic ‘Handheld Menu in Footer Bar’ is closed to new replies.