Developing (v7+)

No C5 Edit Bar or Editable Areas Showing Up When I log In

Permalink 1 user found helpful April 20, 2011 at 10:28 AM

I followed these instructions & had no luck so I looked at the structure of some of the themes I had downloaded through the marketplace and set up an elements folder which contains my header with the code below:

<?php   defined('C5_EXECUTE') or die(_("Access Denied.")); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en-US" xml:lang="en-US" xmlns="http://www.w3.org/1999/xhtml">
<head>
<?php 
    Loader::element('header_required'); 
 ?>
<link href='http://fonts.googleapis.com/css?family=Just+Another+Hand' rel='stylesheet' type='text/css'>
  <link rel="stylesheet" type="text/css" media="all" href="<?=$this->getThemePath()?>/css/style.css" />
  <link rel="stylesheet" type="text/css" media="all" href="<?=$this->getThemePath()?>/css/text.css" />
  <link rel="stylesheet" type="text/css" media="all" href="<?=$this->getThemePath()?>/css/960.css" />
</head>
<body>
<div id="container">

and then loads in my default.php page which is made up this code:

<?php 
defined('C5_EXECUTE') or die(_("Access Denied."));
$this->inc('elements/header.php'); ?>
  <div class="container_16">
    <div id="logo"><img src="<?=$this->getThemePath()?>/images/mannings-logo.png" width="188" height="347" alt="Mannings Emporium" /></div>
    <div class="grid_3"> 
      <div id="menu-top"></div>
      <div id="menu-bg">
        <div id="menu-spacer"></div>
           <div id="nav">
      <?php 
      $bt = BlockType::getByHandle('autonav');
      $bt->controller->displayPages = 'top';
      $bt->controller->orderBy = 'display_asc';                    
      $bt->controller->displaySubPages = 'all';

Viewing 15 lines of 74 lines. View entire code block.

 
<?php 
defined('C5_EXECUTE') or die(_("Access Denied."));
$this->inc('elements/header.php'); ?>
 
  <div class="container_16">
 
    <div id="logo"><img src="<?=$this->getThemePath()?>/images/mannings-logo.png" width="188" height="347" alt="Mannings Emporium" /></div>
    <div class="grid_3"> 
      <div id="menu-top"></div>
      <div id="menu-bg">
        <div id="menu-spacer"></div>
           <div id="nav">
      <?php 
      $bt = BlockType::getByHandle('autonav');
      $bt->controller->displayPages = 'top';
      $bt->controller->orderBy = 'display_asc';                    
      $bt->controller->displaySubPages = 'all'; 
      $bt->controller->displaySubPageLevels = 'custom';
      $bt->controller->displaySubPageLevelsNum = '1';                   
      $bt->render('templates/main_menu');
      ?>
   </div><!-- nav ends -->   
      </div>
      <div id="menu-bottom"></div>
    </div>
 
 
 <div class="grid_13">
      <div id="content-top"></div>
      <div id="content-bg">
        <div class="grid_9">
          <div id="main-image">
            <div id="main-image-pic"><?php
   $a = new Area('Main Image');
   $a->display($c);
?></div>
          </div>
          <div class="grid_5">
            <div class="inner"><?php
   $a = new Area('Main Content');
   $a->display($c);
?></div>
          </div>
          <div class="grid_3"><?php
   $a = new Area('Additional Info');
   $a->display($c);
?></div>
        </div>
 
 
              <div class="grid_4a">
                <div id="news-top"></div>
                <div id="news-bg">
                  <div class="inner-news">
                   <?php
   $a = new Area('News Section');
   $a->display($c);
?>
                  </div></div>
                <div id="news-bottom"></div>
 
                <div class="clear"></div>
                <div id="facebook-bg">
                <script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like-box href="http://www.facebook.com/pages/Mannings-Emporium/125428607483109?ref=ts" width="200" show_faces="true" stream="false" header="false"></fb:like-box>
                </div>
 
              </div>
                <div class="clear"></div>
      </div>
 
      <div id="content-bottom"></div>
    </div>
  </div>
</div>
 
 
<!--include jquery & backstretch-->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="<?=$this->getThemePath()?>/js/jquery.backstretch.min.js"></script>
<script type="text/javascript">
   $.backstretch("<?=$this->getThemePath()?>/images/mannings-bg.jpg", {speed: 150});
</script>
 
 
<?php Loader::element('footer_required'); ?>
</body>
</html>

I'm stumped. I've spent all afternoon trying different snippets of code from other C5 themes I've bought in the header but to no avail. Can anyone help?

RandomBrad replied on Apr 20, 2011 at 4:02 pm Permalink Reply

In the vein of "Did you put gas in it", I have to ask, have you tried other browsers? I had trouble with a chrome browser once not giving me edit options.

kirkroberts replied on Apr 20, 2011 at 11:27 pm Permalink Reply

Are you logging in as admin (the super-user)?

It may just be that your user for some reason doesn't have permission to edit the page, so no toolbar is appearing. It's happened to me!

Log in as the super-user (typically "admin") and check permissions on the home page and others.

cannonf700 replied on Apr 21, 2011 at 12:36 am Permalink Reply

Try moving

<?php 
    Loader::element('header_required'); 
 ?>

so that it is just above the </head> tag.
I've had issues with this before related to that.

PassionForCreative replied on Apr 21, 2011 at 3:28 am Permalink Reply

I figured it out. I was trying to use the Backstretch.js function in the background of the site, hard-coded into my template. For whatever reason this was causing the edit bar to not appear. I removed the JS and will just purchase the Backstretch block from the marketplace.

Thanks for looking into it guys. Although do any of you have any idea why this conflict occurred?

cannonf700 replied on Apr 21, 2011 at 4:27 am Permalink Best Answer Reply

The error is because you are making two calls for the javascript. You have to have this <?php Loader::element('header_required'); ?> before your call for javascript.

here's an example of a successful use of the backstretch javascript... see if this works for you.

<?php  defined('C5_EXECUTE') or die(_("Access Denied.")); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="<?php echo LANGUAGE?>" xml:lang="<?php echo LANGUAGE?>" xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getThemePath(); ?>/fonts/fonts.css" />
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getStyleSheet('typography.css')?>" />
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getStyleSheet('main.css')?>" />
<?php
$html = Loader::helper('html');
$this->addHeaderItem($html->javascript('jquery.ui.js'), 'VIEW');
?>
<?php  Loader::element('header_required'); ?>
<script type="text/javascript" src="<?php echo $this->getThemePath(); ?>/js/jquery.backstretch.min.js"></script>
<script type="text/javascript">
    $.backstretch("<?php if ($c->getAttribute('bg_image')){ echo($c->getAttribute('bg_image')->getVersion()->getRelativePath()); }else{ echo(''.$this->getThemePath().'/images/defaultbg.jpg'); }?>", {speed: 750});

Viewing 15 lines of 19 lines. View entire code block.

 
<?php  defined('C5_EXECUTE') or die(_("Access Denied.")); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
<html lang="<?php echo LANGUAGE?>" xml:lang="<?php echo LANGUAGE?>" xmlns="http://www.w3.org/1999/xhtml">
 
<head>
 
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getThemePath(); ?>/fonts/fonts.css" />
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getStyleSheet('typography.css')?>" />
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getStyleSheet('main.css')?>" />
 
<?php
$html = Loader::helper('html');
$this->addHeaderItem($html->javascript('jquery.ui.js'), 'VIEW');
?>
 
<?php  Loader::element('header_required'); ?>
 
<script type="text/javascript" src="<?php echo $this->getThemePath(); ?>/js/jquery.backstretch.min.js"></script>
<script type="text/javascript">
    $.backstretch("<?php if ($c->getAttribute('bg_image')){ echo($c->getAttribute('bg_image')->getVersion()->getRelativePath()); }else{ echo(''.$this->getThemePath().'/images/defaultbg.jpg'); }?>", {speed: 750});
</script>
 
<script type="text/javascript" src="<?php echo $this->getThemePath(); ?>/js/rb_menu.js"></script>
 
<script type="text/javascript" src="<?php echo $this->getThemePath(); ?>/js/functions.js"></script>
 
</head>

PassionForCreative replied on Apr 21, 2011 at 6:55 am Permalink Reply

Cannon, thanks for taking the time to write this post. This works perfectly. Thanks again dude.

gariah replied on Jun 24, 2011 at 5:20 am Permalink Reply

I have a very similar problem with my Javascript preventing my edit bar from loading!

this is the code that i have for the header tag

<link rel="stylesheet" href="<?=$this->getThemePath()?>/css/default.css">
    <?php Loader::element('header_required'); ?>
    <script src="<?=$this->getThemePath()?>/js/libs/modernizr-1.7.min.js"></script>
    <script src="<?=$this->getThemePath()?>/js/cufon-yui.js" type="text/javascript"></script>
      <script src="<?=$this->getThemePath()?>/js/Museo_Slab_500.font.js" type="text/javascript"></script>
      <script type="text/javascript">
         Cufon.replace('h1',{ textShadow: '1px 1px #fff'});
         Cufon.replace('h2',{ textShadow: '1px 1px #fff'});
         Cufon.replace('h3',{ textShadow: '1px 1px #777'});
         Cufon.replace('nav',{ textShadow: '1px 1px #FFF'});
         Cufon.replace('h6',{ textShadow: '1px 1px #777'});
      </script>
        <script type="text/javascript" src="<?=$this->getThemePath()?>/js/twitter.js"></script>
        <script type="text/javascript" src="<?=$this->getThemePath()?>/js/custom.js"></script>
</head>

and i've also got this at the bottom of the body tag which seems to prevent it.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
   <script>!window.jQuery && document.write(unescape('%3Cscript src="<?=$this->getThemePath()?>/js/libs/jquery-1.5.1.min.js"%3E%3C/script%3E'))</script>
   <script src="<?=$this->getThemePath()?>/js/script.js"></script>
   <!--[if lt IE 7 ]>
   <script src="<?=$this->getThemePath()?>/js/libs/dd_belatedpng.js"></script>
   <script> DD_belatedPNG.fix('img, .png_bg');</script>
   <![endif]-->

Help!

kirkroberts replied on Jun 28, 2011 at 11:27 am Permalink Reply

It looks like you're double-loading jQuery (once in header_required and once manually).

Try removing your google jquery and local jquery fallback. Concrete5 already loads jQuery in the head.

cainKuri replied on May 12, 2012 at 11:02 pm Permalink Reply

Thank you so much, it help me your description ! :D

ankitoo97 replied on Jul 11, 2013 at 6:31 am Permalink Reply

can you help me with that again. iam facing a similar problem.

in header:
<?php $this->inc('elements/header.php'); ?>

<script src="<?=$this->getThemePath()?>/Scripts/jquery-1.6.min.js" type="text/javascript"></script>
<script src="<?=$this->getThemePath()?>/Scripts/jquery.cycle.all.js" type="text/javascript"></script>

<script type="text/xml">

</script>
<style type="text/css">

</style>

in body

<script type="text/javascript">

slideshowAddCaption=false;
$(document).ready(function() {
$('#slideshow').cycle({
after: slideshowOnCycleAfter, //the function that is triggered after each transition
autostop: false, // true to end slideshow after X transitions (where X == slide count)
fx: 'scrollLeft,scrollRight,',// name of transition effect
pause: true, // true to enable pause on hover
randomizeEffects: true, // valid when multiple effects are used; true to make the effect sequence random
speed: 1000, // speed of the transition (any valid fx speed value)
sync: true, // true if in/out transitions should occur simultaneously
timeout: 3000, // milliseconds between slide transitions (0 to disable auto advance)
fit: false,
height: '300px',
width: '300px' // container width (if the 'fit' option is true, the slides will be set to this width as well)
});
});
function slideshowOnCycleAfter() {
if (slideshowAddCaption==false){
$('#slideshow-caption').html(this.title);
}
}

</script>

kirkroberts replied on Jul 11, 2013 at 9:29 am Permalink Reply

Try removing this line from your head

<script src="<?=$this->getThemePath()?>/Scripts/jquery-1.6.min.js" type="text/javascript"></script>

Unless you've altered it header_required will load jQuery. If you load jQuery again it causes problems like the site toolbar going away.

Job replied on Jul 11, 2013 at 9:32 am Permalink Reply

Try to post new topics rather than grave digging ones that are two years old.

Forums

Developing (v7+)

No C5 Edit Bar or Editable Areas Showing Up When I log In

Code

Post Reply

Delete Post

Mark Post as Spam

Destroy Spammer

Sign In?