Forums

Custom Theme broke Concrete 5's editor

Permalink 1 user found helpful
I am updating my custom theme to have a hover navigation as well as a slide out navigation for mobile. Both are working. My problems accrued when I went to edit the page via the Concrete 5 editor.

I can select "edit this page"
The edible regions highlight properly
I can click on one of the editable regions to get the small menu.
But when I select one of the options, I get the overlay with the loading icon, and then the page is switched to just the texted (I am a supposing it is just displaying the html page with out css) of what is supposed to be the overlay menu/editor. (Screenshot attached)

This is the mobile sidebar I added.
https://www.adchsm.com/slidebars/help/usage/opening-and-closing-slid...
This is the nesting accordion I added inside the sidebar.
https://codepen.io/anon/pen/mAErWB...

Here is a link to the page with my updated navigation.
http://www.savageriver.com/savageriver/canoes/recreational/pontoon...

Note: I couldn't get the small menu to pop up, when I clicked on one of the edible regions. The nested accordion was using a class called inner, that after changed fixed the problem.

Thanks for any help you can provide. I have been trying to fix this for several days now.

1 Attachment

Kershar
 
hutman replied on at Permalink Reply
hutman
You have two javascript errors, these could possibly be causing issues

Uncaught TypeError: $(...).flexNav is not a function
Uncaught TypeError: $(...).flexslider is not a function
Kershar replied on at Permalink Reply
Kershar
The error is caused from my footer.php file. the code is used in the rest of my site, just not on this page.
<script> 
   $("[role='navigation']").flexNav(); 
</script>
<!--FlexSlider-->
<script type="text/javascript" charset="utf-8">
  $(window).load(function() {
    $('.flexslider').flexslider();
  });
</script>
<script> 
   var $buoop = {} 
   $buoop.ol = window.onload; 
   window.onload=function(){ 
       try {if ($buoop.ol) $buoop.ol();}catch (e) {} 
       var e = document.createElement("script");
Viewing 15 lines of 20 lines. View entire code block.


Would this cause my problem? If so I can move it out of the footer.php file
hutman replied on at Permalink Best Answer Reply
hutman
Actually I think this is caused because you have 2 versions of jquery being loaded on the page, which could be causing the other two errors I cited. Can you remove the jquery from your header.php and see if that fixes the errors?
Kershar replied on at Permalink Reply
Kershar
This is the header.php
<?php defined('C5_EXECUTE') or die(_("Access Denied.")); ?>
<!DOCTYPE html>
<!--[if IE 8]> <html class="ie8" lang="<?php echo LANGUAGE?>"> <![endif]-->
<!--[if gt IE 8]><!--> <html lang="<?php echo LANGUAGE?>"> <!--<![endif]-->
<head>
   <?php Loader::element('header_required'); ?>
   <meta name="viewport" content="width=device-width; initial-scale=1.0" />
   <!--[if lt IE 9]>
      <script src="http://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.6/html5shiv.min.js"></script>
   <![endif]-->


or are you referring to this code here? 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
hutman replied on at Permalink Reply
hutman
Yes, that second bit, remove that and see if it works. C5 already includes a copy of jquery so you don't need two.
Kershar replied on at Permalink Reply
Kershar
I removed it but it seams to have done nothing. Apparently just some redundant code that in didn't need to be there.

the errors are still there as well
hutman replied on at Permalink Reply
hutman
There is another duplicate copy of jquery in your page too, it's down toward the footer

<!-- Slidebars -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
Kershar replied on at Permalink Reply
Kershar
Fixed!

Thanks a lot!
hutman replied on at Permalink Reply
hutman
Glad things are working, you still have those original 2 javascript errors on your page that will probably cause problems in the future. You're calling flexNav and flexSlider but not including the js files for those. So you should either include those js files or remove the references to them.
Kershar replied on at Permalink Reply
Kershar
I am planning on phasing them out, but right now the rest of my site is using them. So I don't want to remove them yet.