How do you show a responsive menu with autonav? (elemental/cloneamental theme)
Permalink
When I shrink my browser, the full menu gets hidden, and the "Hamburger" menu appears, but is unresponsive. i,.e. There is no reaction to a click
What do I need to do to make it show a mobile-friendly menu?
What do I need to do to make it show a mobile-friendly menu?
Hi Conkreet,
The default Elemental/Cloneamental theme does not need additional Bootstrap CSS/JavaScript for the Responsive Header Navigation custom template to work.
Do you have any errors in your browser console?
Have you modified the theme, added custom code/blocks/add-ons, added scripts through the HTML block, etc.? For the navigation to be broken, I suspect a JavaScript error.
The default Elemental/Cloneamental theme does not need additional Bootstrap CSS/JavaScript for the Responsive Header Navigation custom template to work.
Do you have any errors in your browser console?
Have you modified the theme, added custom code/blocks/add-ons, added scripts through the HTML block, etc.? For the navigation to be broken, I suspect a JavaScript error.
A long-shot: if you're using an iPad or the like...
https://www.concrete5.org/community/forums/5-7-discussion/elemental-...
Dunno if this has been fixed.
https://www.concrete5.org/community/forums/5-7-discussion/elemental-...
Dunno if this has been fixed.
Thank you for your help.
There's aren't any javascript errors in the console. When i click on the hamburger, jQuery does kick in - So if there's an error, then it hasn't stopped event firing.
Also checkedhttp://validator.w3.org for unmatched tags, but no major issues.
So I'm wondering if there is markup missing that jQuery is expecting.
I have made some changes, to various parts of the system, but they have been over a period of weeks, so finding them now would be very hard.
http://www.clinicmtb.co.uk
There's aren't any javascript errors in the console. When i click on the hamburger, jQuery does kick in - So if there's an error, then it hasn't stopped event firing.
Also checkedhttp://validator.w3.org for unmatched tags, but no major issues.
So I'm wondering if there is markup missing that jQuery is expecting.
I have made some changes, to various parts of the system, but they have been over a period of weeks, so finding them now would be very hard.
http://www.clinicmtb.co.uk
Trying to debug this. So far i can see that...
blocks/autonav/templates/responsive_header_navigation/view.js (and the other files in this directory, I assume) are not being loaded.
view.js is the one that manages the click event on the hamburger menu.
i.e. $('.ccm-responsive-menu-launch').click(function(){ ... }
(Of course I have set the custom template for AutoNav to "Responsive Header Navigation"
blocks/autonav/templates/responsive_header_navigation/view.js (and the other files in this directory, I assume) are not being loaded.
view.js is the one that manages the click event on the hamburger menu.
i.e. $('.ccm-responsive-menu-launch').click(function(){ ... }
(Of course I have set the custom template for AutoNav to "Responsive Header Navigation"
@Conkreet
I can confirm that the CSS and JS for the Responsive Header Navigation custom template are not being loaded.
Did you modify or attempt to override the custom template?
I can confirm that the CSS and JS for the Responsive Header Navigation custom template are not being loaded.
Did you modify or attempt to override the custom template?
@MrKDilkington No. Not as far as I'm aware anyway as I would not know how to do that.
I've changed the cloneamental template, header_top.php etc, but that's not what you mean, is it?
So........ Given your clue above I did some investigating... I figured that if I was going to modify the template, I might put something into application/blocks/autonav.. I checked and there was a file in autonav/templates/responsive_header_navigation/view.php. I'm really not sure why it's there.... but I removed the autonav directory and now my mobile menu appears!
Thank you so much!! A whole day wasted on that :-)
I've changed the cloneamental template, header_top.php etc, but that's not what you mean, is it?
So........ Given your clue above I did some investigating... I figured that if I was going to modify the template, I might put something into application/blocks/autonav.. I checked and there was a file in autonav/templates/responsive_header_navigation/view.php. I'm really not sure why it's there.... but I removed the autonav directory and now my mobile menu appears!
Thank you so much!! A whole day wasted on that :-)
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
But this seems to have made no difference for this site, where I am using Auto Nav.