[CWG32813]

I have my menu setup correctly and it looks great in desktop view. In responsive, because I have so many subpages, the menu gets cut off at the height of the page content so i can not access subpages lower in the list. Is there any way to make the responsive menu only containing only the page you are on and it’s subpages?

If that cant be done, how would I change the menu to a standard select box?

If that cant be done, how can I just make sure all of the items will display?

test site here: “http://alpha.chrispyg.com” – please excuse the crappy test images as I await new photography. :-p

[CWG32813]

To reproduce the issue, select products->stamped products, make sure your browser is less that 600px wide, click the menu and try to scroll to the bottom of the menu.

[Sakin]

@CWG32813: You cannot do that. It’s designed like that. It will show all the menus. But when I check in your site from my iPhone, it was easy to navigate.

If you like to change to select box then you can add the following CSS in “Appearance => Theme Options => Custom CSS” box.

@media screen and (max-width: 767px) {
.sb-holder { display: none; }
.tinynav { display: block !important; width: 100%; }
}

[CWG32813]

hmm. That is an ok solution, implemented now, but anyway to make it a bit more stylistically integrated. Open to suggestions.

[CWG32813]

The problem with the responsive menu was that it cut off the pages at the bottom of the list, the best solution would be making sure that the list does not get cut off.
As an aside, can i suggest that the custom css not get just pumped into the html? I think this text should be saved to an external css document, otherwise, it makes the markup really poor. I worked around that by adding a link in the header to a custom-styles.css file.

[CWG32813]

Can you look at the site here alpha.chrispyg.com and tell me how (on iphone) that I can get all of the sub-pages to display in the menu? It cuts off half-way through the list. If I cant do that, how can I show only the top-level pages when in responsive mode

[Sakin]

@CWG32813: Can you try adding in the following CSS in “Appearance => Theme Options => Custom CSS” box.
.site { overflow: auto; }

This will make the menu overflow to fit in the screen. So, you can scroll down and see all the menu items.

[CWG32813]

That did work thank you. I added .site { overflow: auto; } and it now reflects all items.

[nadaadehn]

HI,
is it possible to make the submenu in a div and not a select list.
any help will be appreciated.

[Sakin]

@nadaadehn: Please post in your site URL.

[nadaadehn]

http://ka-collection.com/index1.php

thank you

[Sakin]

@nadaadehn: If you don’t like select box in responsive menu and want it like in your desktop view. Then you can build child then and then copy catchbox_scripts_method() function and delete the following code

//Responsive Menu
wp_register_script('catchbox-menu', get_template_directory_uri() . '/js/catchbox-menu.min.js', array('jquery'), '1.1.0', true);
wp_register_script('catchbox-allmenu', get_template_directory_uri() . '/js/catchbox-allmenu-min.js', array('jquery'), '201301503', true);

//Check is secondayand footer menu is enable or not
$options = catchbox_get_theme_options();
if ( !empty ($options ['enable_menus'] ) ) :
    wp_enqueue_script( 'catchbox-allmenu' );
else :
    wp_enqueue_script( 'catchbox-menu' );
endif;

Then add the following css in your child theme style.css file or in “Appearance => Theme Options => Custom CSS” box.

@media screen and (max-width: 960px) {
	#branding ul.menu {
		display: block;
	}
}

[nadaadehn]

Thank you very much for your help.now the menu is showing as normal.
what i wanted is an icon and once clicked the menu will open in a div below it.

http://ka-collection.com/index1.php/

what i want is http://ka-collection.com/wp-content/uploads/2014/03/Untitled-11.jpg

[Sakin]

@nadaadehn: Hum for that you need to add extra jquery script and custom css. This might required you to hire a customizer to work for you.

I have created child theme which replace the old menu with new one. Install this child theme https://www.dropbox.com/s/t69xxjiihvy4qxr/catch-box-child-menu.zip

[nadaadehn]

how much this will cost me?

[Sakin]

@nadaadehn: First try download the child theme that I gave you and install it. Then you will see your selectbox menu in div like in your screenshot.
If you want to hire customizer then request for quote at http://catchthemes.com/hire-customizer/

[nadaadehn]

Thank you very much.
was unable to download from the link.
can you please share on my dropbox [email protected]

[Sakin]

@nadaadehn: Strange. I am able to download it from link. Anyway, I have shared with your email in your dropbox.

[Author]

Posts