How to close mobile menu by default?

Support
#1

Hi There,

Referring to this post: https://theme.co/apex/forum/t/mobile-menu-open-should-be-closed/67248?u=lypa

I set up a staging site and ran all the updates. And the mobile header is still open, pls take a look here:

https://www.morga.ch/staging/

What can I do to close it again by default like it was before?

Kind Regards,
Lydia

#2

Hi Lydia,

Thank you for giving access to the staging website. I checked the website and went to WordPress Dashboard > Appearance > Themes and changed the theme from the Child Theme to the original one.

Now the mobile menu is working correctly. There is some customization that you have done on your Child Theme that causes the problem and you need to check your code.

Thank you :slight_smile:.

#3

Hi Christopher

Thank you for your response. We need to keep the Child Theme, since it carries our Recipe Database and other custom functionalities. So I switched the site back to the child theme. I can not remember changing anything on the menu code. Would you mind giving me a hint where this should be and where I can switch that menu-opening off? Thank you.

Best Regards,
lypa

#4

Hello Lypa,

I have logged in and resolved your issue. You are using a legacy child theme. Your _nav-primary.php file contains this code which is no longer apply with the latest version:

<?php

// =============================================================================
// VIEWS/GLOBAL/_NAV-PRIMARY.PHP
// -----------------------------------------------------------------------------
// Outputs the primary nav.
// =============================================================================

?>

<a href="#" class="x-btn-navbar collapsed" data-toggle="collapse" data-target=".x-nav-wrap.mobile">
  <i class="x-icon-bars" data-x-icon="&#xf0c9;"></i>
  <span class="visually-hidden"><?php _e( 'Navigation', '__x__' ); ?></span>
</a>

<nav class="x-nav-wrap desktop" role="navigation">
  <?php x_output_primary_navigation(); ?>
</nav>

<div class="x-nav-wrap mobile collapse">
  <?php x_output_primary_navigation(); ?>
</div>

I went ahead and I have updated it into this code:

<?php

// =============================================================================
// VIEWS/GLOBAL/_NAV-PRIMARY.PHP
// -----------------------------------------------------------------------------
// Outputs the primary nav.
// =============================================================================

if( function_exists( 'ubermenu' ) && $config_id = ubermenu_get_menu_instance_by_theme_location( 'primary' ) ):
	ubermenu( $config_id, array( 'theme_location' => 'primary') );
 else: ?>

<a href="#" id="x-btn-navbar" class="x-btn-navbar collapsed" data-x-toggle="collapse-b" data-x-toggleable="x-nav-wrap-mobile" aria-expanded="false" aria-controls="x-nav-wrap-mobile" role="button">
  <i class="x-icon-bars" data-x-icon-s="&#xf0c9;"></i>
  <span class="visually-hidden"><?php _e( 'Navigation', '__x__' ); ?></span>
</a>

<nav class="x-nav-wrap desktop" role="navigation">
  <?php x_output_primary_navigation(); ?>
</nav>

<div id="x-nav-wrap-mobile" class="x-nav-wrap mobile x-collapsed" data-x-toggleable="x-nav-wrap-mobile" data-x-toggle-collapse="1" aria-hidden="true" aria-labelledby="x-btn-navbar">
  <?php x_output_primary_navigation(); ?>
</div>

<?php endif; ?>

I would highly recommend that you switch to the latest child theme. You can get it from your dashboard: https://theme.co/apex/child-themes

You must switch to the new Child theme because sooner or later you will encounter another problem or issues with your child theme. For example, the _nav-primary.php file is supposed to be located in x-child/framework/legacy/cranium/headers/views/global/. In your legacy child theme set up, it is still located in x-child/framework/views/global/.

Hope this helps.

#5

Hi RueNel,

Thank you for helping! Would you mind giving me advice on how I can safely switch to the new Child Theme without losing the customizations from our legacy Child Theme? I have checked our server structure (screenshot attached) and we have a lot of customization in our child theme folder. These were mainly made by an external WordPress Developer we hired.

I am not familiar with the child theme structure and I am afraid of losing all those customizations like our recipe database. Is there a way to safely switch from our child theme to new new one or could you help us with that? Thank you.

Kind Regards, lypa

#6

Hi Lypa,

Basically, you can copy/paste most of those files from the old child theme to your new child theme. But you need to keep an eye to files that native to the theme that has been moved to a different directory and has been refactored/rewrote like the _nav-primary.php file, and those custom functions that are inside your functions.php file.

But since these old child theme is working fine with the latest version of the parent theme there should only minor or no issue at all copying those custom files.

I would advise that you hire back the Developer that made this customization for you if you’re not comfortable doing it.

Thanks,

#7

Hi Friech

Thank you for helping. I try and see how far I get.

Kind Regards,
lypa

#8

We are delighted to assist you with this.

Cheers!

#9

Hi Friech

Thank you for helping.

Ok, I have downloaded your latest child theme “x-child” via the given link now.

In this downloaded x-child there is no such directory, the folders are all empty, here is a screenshot of it:

Is there another x-child theme I need to use?

How do I know where to copy the files to? There is only two empty folders, “framework” and “views” in this x-child. There is no folder structure like the one you mentioned here:

So I do not know, where to copy all the files into.

Or do I just take all our files from our child theme “x-child-integrity-light” and paste them into the “framework” folder of the new theme? Plus add the added php-code to the new functions-file?

Our current theme structure looks like this (a lot more files than in the freshly downloaded one from X):

Would you mind giving me some more advice on this? Thank you. I will put a Dropbox link to both the provided x-child-theme and our child-theme below.

Kind Regards,
lypa

#10

Hi Lypa,

That is fine, if the directory does not exist, that means you need to create it, create folders and rename it.

You copy the files in the same directory, create the directory in your new child theme if it does not exist.

You got that one right, copy all the custom functions from your old functions.php file to the new one.

Oh no, did your developer really modified all those files? I know all files (except functions.php, screenshot.png, & style.css) on your old child theme root directory are all custom. But inside framework > views I’m not sure about that, you need to contact your developer and ask which of those files are really modified because those are the only ones that you need to copy (should have not copied all those files).

Maybe you can copy all those files on your new child theme but you’re risking to have a lot of conflict issues in the future, like what is happening now.

Hope this shed some lights,
Cheers!

#11

Hi Friech

Thank you for helping. I still do not understand where should know the folder structure from, like the “cranium”-folder, that was in the path RueNel metioned:

the _nav-primary.php file is supposed to be located in x-child/framework/legacy/cranium/headers/views/global/

Would you mind explaining that further?

Thank you,
lypa

#12

Hi Lypa,

The cranium folder is a legacy folder for compatibility purposes with the old versions of the theme.

To override the header or footer you can check the framework/legacy/cranium/headers/views folder.

Thank you.

#13

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.