Themes

Where is my Top Edit Bar? <? Loader::element('header_required'); ?>

Permalink 1 user found helpful February 16, 2010 at 2:00 PM

I followed the screencast exactly but the Edit Bar on the top is not showing up!

Why?

Here's my header code:

<? Loader::element('header_required'); ?>
** must open post to view code**

.

Here's the site, so you can see everything else worked fine:http://php.22graphics.com/Concrete5/...

--------------------

IF IT HELPS, HERE IS MY FULL CODE:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="description" content="22 Graphics is a full-service design boutique located at 900 Broadway, NYC.">
<? Loader::element('header_required'); ?>
<!-- front slides -->
<link type="text/css" rel="stylesheet" href="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/byslidemenu.css" media="all">
   <script type="text/javascript" src="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/mootools-core.js"></script>
   <script type="text/javascript" src="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/byslidemenu.js"></script>
    <script type="text/javascript" src="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/byslidemenu_demo.js"></script>
<!-- navigation scripts -->
<link rel="stylesheet" href="<?=$this->getThemePath()?>/dropdown.css" type="text/css" />
<script type="text/javascript" src="<?=$this->getThemePath()?>/dropdown.js"></script>
<style type = "text/css">

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

 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="description" content="22 Graphics is a full-service design boutique located at 900 Broadway, NYC.">
 
<? Loader::element('header_required'); ?>
<!-- front slides -->
<link type="text/css" rel="stylesheet" href="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/byslidemenu.css" media="all">
   <script type="text/javascript" src="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/mootools-core.js"></script>
   <script type="text/javascript" src="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/byslidemenu.js"></script>
    <script type="text/javascript" src="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/byslidemenu_demo.js"></script>
 
<!-- navigation scripts -->
<link rel="stylesheet" href="<?=$this->getThemePath()?>/dropdown.css" type="text/css" />
<script type="text/javascript" src="<?=$this->getThemePath()?>/dropdown.js"></script>
 
<style type = "text/css">
* { margin: 0px; padding: 0px; }
 
#wrapper {
   width: 830px;
   margin: 0px auto;
   }
 
#menu {
   width:830px;
   height:25px;
   float: left;
   background-color: blue;
   }
 
#slideshowdiv {
   width: 830px;
   height: 300px;
   margin-top:20px;
   float: left;
   }
#blogareadiv {
   width: 430px;
   float: left;
   background-color: green;
   }
 
#updateareadiv {
   width: 380px;
   float: right;
   background-color: yellow;
   }
 
         /*
NAVIGATION
----------    */
 
#nondropmenu li {
   display: inline;
   float: left;
   list-style-type: none;
   text-indent: -9999px;
   height:20px;
   padding-right: 5px;
   }
 
#nondropmenu li a {
   text-indent: -9999px;
   display:block;
   height:20px;
   }
 
#nondropmenu .about {
   width: 84px;
   background-image: url(<?=$this->getThemePath()?>/images/menu_05.gif);
   }
#nondropmenu .contact {
   width: 103px;
   background-image: url(<?=$this->getThemePath()?>/images/menu_06.gif);
   }
#nondropmenu .home {
   width: 56px;
   background-image: url(<?=$this->getThemePath()?>/images/menu_07.gif);
   }
#nondropmenu .about a:hover {
   background-image: url(<?=$this->getThemePath()?>/images/menuover_05.gif);
   }
#nondropmenu .contact a:hover  {
   background-image: url(<?=$this->getThemePath()?>/images/menuover_06.gif);
   }
#nondropmenu .home a:hover  {
   background-image: url(<?=$this->getThemePath()?>/images/menuover_07.gif);
 
 
</style>
</head>
 
<body>
<div id="wrapper">
<img src="<?=$this->getThemePath()?>/images/22-graphics-new-website-3_01.gif" />
   <div id="menudiv">
      <dl class="dropdown">
        <dt id="one-ddheader" onmouseover="ddMenu('one',1)" onmouseout="ddMenu('one',-1)">Dropdown One</dt>
         <dd id="one-ddcontent" onmouseover="cancelHide('one')" onmouseout="ddMenu('one',-1)">
                <ul>
                   <li><a href="#" class="underline">Navigation Item 1</a></li>
                      <li><a href="#" class="underline">Navigation Item 2</a></li>
                      <li><a href="#" class="underline">Navigation Item 3</a></li>
                      <li><a href="#" class="underline">Navigation Item 4</a></li>
                      <li><a href="#">Navigation Item 5</a></li>
            </ul>
           </dd>
      </dl>
 
        <dl class="dropdown2">
        <dt id="two-ddheader" onmouseover="ddMenu('two',1)" onmouseout="ddMenu('two',-1)">Dropdown One</dt>
         <dd id="two-ddcontent" onmouseover="cancelHide('one')" onmouseout="ddMenu('two',-1)">
                <ul>
                   <li><a href="#" class="underline">Navigation Item 1</a></li>
                      <li><a href="#" class="underline">Navigation Item 2</a></li>
                      <li><a href="#" class="underline">Navigation Item 3</a></li>
                      <li><a href="#" class="underline">Navigation Item 4</a></li>
                      <li><a href="#">Navigation Item 5</a></li>
            </ul>
           </dd>
      </dl>
 
        <dl class="dropdown3">
        <dt id="three-ddheader" onmouseover="ddMenu('three',1)" onmouseout="ddMenu('three',-1)">Dropdown One</dt>
         <dd id="three-ddcontent" onmouseover="cancelHide('three')" onmouseout="ddMenu('three',-1)">
                <ul>
                   <li><a href="#" class="underline">Navigation Item 1</a></li>
                      <li><a href="#" class="underline">Navigation Item 2</a></li>
                      <li><a href="#" class="underline">Navigation Item 3</a></li>
                      <li><a href="#" class="underline">Navigation Item 4</a></li>
                      <li><a href="#">Navigation Item 5</a></li>
            </ul>
           </dd>
      </dl>
 
        <dl class="dropdown4">
        <dt id="four-ddheader" onmouseover="ddMenu('four',1)" onmouseout="ddMenu('four',-1)">Dropdown One</dt>
         <dd id="four-ddcontent" onmouseover="cancelHide('four')" onmouseout="ddMenu('four',-1)">
                <ul>
                   <li><a href="#" class="underline">Navigation Item 1</a></li>
                      <li><a href="#" class="underline">Navigation Item 2</a></li>
                      <li><a href="#" class="underline">Navigation Item 3</a></li>
                      <li><a href="#" class="underline">Navigation Item 4</a></li>
                      <li><a href="#">Navigation Item 5</a></li>
            </ul>
           </dd>
      </dl>
 
        <ul id="nondropmenu">
           <li class="about"><a href="#">About Us</a></li>
            <li class="contact"><a href="#">Contact Us</a></li>
            <li class="home"><a href="#">Home</a></li>
        </ul>
 
</div>
    <div id="slideshowdiv">
        <ul style="padding: 0px; overflow: hidden; position: relative; width: 830px; height: 266px;" class="bsm" id="byslidemenu">
      <li id="byslidemenu_Elm1" style="position: absolute; height: 266px; width: 700px; left: 0px;" class="first"><img alt="" src="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/creditcards.jpg"></li>
      <li id="byslidemenu_Elm2" style="position: absolute; height: 266px; width: 700px; left: 92px;"><img alt="" src="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/games.jpg"></li>
      <li id="byslidemenu_Elm3" style="position: absolute; height: 266px; width: 700px; left: 184px;"><img alt="" src="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/computer.jpg"></li>
      <li id="byslidemenu_Elm4" style="position: absolute; height: 266px; width: 700px; left: 276px;"><img alt="" src="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/eiffeltower.jpg"></li>
      <li id="byslidemenu_Elm5" style="position: absolute; height: 266px; width: 700px; left: 368px;"><img alt="" src="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/electronic.jpg"></li>
        <li id="byslidemenu_Elm6" style="position: absolute; height: 266px; width: 700px; left: 460px;"><img alt="" src="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/games.jpg"></li>
      <li id="byslidemenu_Elm7" style="position: absolute; height: 266px; width: 700px; left: 552px;"><img alt="" src="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/computer.jpg"></li>
      <li id="byslidemenu_Elm8" style="position: absolute; height: 266px; width: 700px; left: 644px;"><img alt="" src="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/eiffeltower.jpg"></li>
      <li id="byslidemenu_Elm9" style="position: absolute; height: 266px; width: 700px; left: 736px;"><img alt="" src="<?=$this->getThemePath()?>/javascript-dynamic-accordion-menu_files/electronic.jpg"></li>
</ul>
    </div>
    <div id="blogareadiv">
    blog area -- temporary filling this with Main Content snippet just to see if it works... <br /><br />
   <? $a = new Area('Main'); $a->display($c); ?>
 
    </div>
    <div id="updateareadiv">
    update area
    </div>
</div>
</body>
</html>

chunksmurray replied on Feb 17, 2010 at 7:39 am Permalink Reply

Are you logging in as Admin or another user? Can you access the dashboard ok?

Also, what browser are you using?

zoinks replied on Feb 17, 2010 at 7:58 am Permalink Reply

I log in as admin. There is no top bar at all, so there is no dashboard.

This is not a browser-specific problem. I've used the latest Firefox and the latest Safari.

Basically, if I ever want to get out of this situation (if I can't figure out how to get the top edit bar back), I will need to delete the theme using FTP and then upload the default theme (Vanilla Yogurt) to the Themes folder and change its name to that of my current theme so that Concrete5 recognizes it as the theme which is currently activated. Since the default theme has the edit bar, this will work. (I've already had to do it once.)

But, of course, then I'm back to the default Vanilla Yogurt theme, which is not what I want.

zoinks replied on Feb 17, 2010 at 8:17 am Permalink Reply

I'm guessing it's something like what happened to this guy:
http://www.concrete5.org/community/forums/usage/no-edit-bar/...
^His edit bar disappeared after he installed some Google ad code.

All I have is some javascript for the dropdown menus and a slider image script.

Are there any known conflicts with <? Loader::element('header_required'); ?> ?

chunksmurray replied on Feb 17, 2010 at 8:20 am Permalink Reply

You can go directly to the dashboard:http://www.yoursite.com/index.php/dashboard/...

And at least from there you can apply one of the default themes.

Along with what nate22 posted, maybe these will help:
http://www.concrete5.org/index.php?cID=18017...
http://www.concrete5.org/index.php?cID=13834...

zoinks replied on Feb 17, 2010 at 8:39 am Permalink Reply

Thank you very much! I will look into those...

::crosses fingers::

zoinks replied on Feb 17, 2010 at 8:54 am Permalink Reply

There is some conflict with Edit Bar and javascript and jQuery.

zoinks replied on Feb 17, 2010 at 9:03 am Permalink Reply

Partially figured it out, but not really...

I moved <? Loader::element('header_required'); ?> to the very bottom just before the closing </header> tag so that no CSS would interfere with the Edit Bar's css and that solved the problem.

NOW my jQuery slider gallery does not work, however. So, the edit bar definitely conflicts with jQuery.

zoinks replied on Feb 17, 2010 at 9:10 am Permalink Reply

Actually, it's MooTools.

And, according to this link, the Edit Bar also conflicts with jQuery:
http://www.concrete5.org/index.php?cID=18017...

These are pretty big conflicts! Is there a Bug Report section anywhere?

zoinks replied on Feb 17, 2010 at 9:37 am Permalink Reply

For posterity, I found some answers:

http://www.concrete5.org/community/forums/usage/adding_javascript_b...

http://mootools.net/blog/2009/06/22/the-dollar-safe-mode/...

Apparently, jQuery is in the base code of Concrete5. The conflict (for me) probably has something to do with $ being used in jQuery and MooTools. So, I will have to follow the MooTools instructions and figure out how to encapsulate my MooTools plugins so there is no conflict.

For the guys who are having conflicts with jQuery, I don't know what the problem would be. But, hopefully this thread is a good starting point.

(Sorry for the cross-linking, but it's hard to find stuff around here!)

simbadj replied on Jun 30, 2010 at 10:39 pm Permalink Best Answer Reply

jquery is trying to load twice, because c5 also uses it.

solution:
remove the jquery line from your header.

hope this helps!

thundavolt replied on Jul 16, 2010 at 4:35 pm Permalink Reply

As mentioned above jQuery is trying to load twice. Therefore take out any jQuery loading.

zoinks replied on Jul 16, 2010 at 4:40 pm Permalink Reply

I already resolved this problem, but forgot to mark the correct answer.

dennyburkes replied on Sep 8, 2011 at 1:03 pm Permalink Reply

I was having the same issue with the C5 menu bar not showing up. I took the advice of this thread and removed my own link to jQuery and PRESTO! Problem solved. Thank you helpful people.

SteveAtParadigm replied on Oct 26, 2011 at 4:08 pm Permalink Reply

Hey, thanks a lot! You just saved me hours of frustration.
I moved the 'header_required' line to the bottom of the header and everything works great.
I was working with "Expandable Sticky Bar" fromhttp://www.dynamicdrive.com

dragondesignz replied on Oct 21, 2011 at 4:03 pm Permalink Reply

Hello everyone,

I had the same problem,
I fixed by moving the header code on the last line before </head>

Like this

<link rel="stylesheet" href="<?=$this->getThemePath();?>/style.css" type="text/css" media="screen" />
    <!--[if IE 6]><link rel="stylesheet" href="<?=$this->getThemePath();?>/style.ie6.css" type="text/css" media="screen" /><![endif]-->
    <!--[if IE 7]><link rel="stylesheet" href="<?=$this->getThemePath();?>/style.ie7.css" type="text/css" media="screen" /><![endif]-->
<link rel="shortcut icon" href="<?=$this->getThemePath();?>/favicon.ico" type="image/x-icon" />
    <script type="text/javascript" src="<?=$this->getThemePath();?>/DDjquery.js"></script>
    <script type="text/javascript" src="<?=$this->getThemePath();?>/DDscript.js"></script>
   <style type="text/css">
.c5_Dragondesignz-post .layout-item-0 { padding-right: 10px;padding-left: 10px; }
   .ie7 .c5_Dragondesignz-post .c5_Dragondesignz-layout-cell {border:none !important; padding:0 !important; }
   .ie6 .c5_Dragondesignz-post .c5_Dragondesignz-layout-cell {border:none !important; padding:0 !important; }
   </style>
<?php  Loader::element('header_required'); ?>

openly replied on Oct 21, 2011 at 4:12 pm Permalink Reply

Hmm this will break jQuery as header_require.php adds jquery to your header and needs to load before other jQuery

dragondesignz replied on Oct 22, 2011 at 3:33 am Permalink Reply

It works fine with my code,
I see everything and don't have any errors,

Looks like this :

<link rel="stylesheet" href="/themes/Bright_Dragondesignz/style.css" type="text/css" media="screen" />
    <!--[if IE 6]><link rel="stylesheet" href="/themes/Bright_Dragondesignz/style.ie6.css" type="text/css" media="screen" /><![endif]-->
    <!--[if IE 7]><link rel="stylesheet" href="/themes/Bright_Dragondesignz/style.ie7.css" type="text/css" media="screen" /><![endif]-->
<link rel="shortcut icon" href="/themes/Bright_Dragondesignz/favicon.ico" type="image/x-icon" />
    <script type="text/javascript" src="/themes/Bright_Dragondesignz/jquery.js"></script>
    <script type="text/javascript" src="/themes/Bright_Dragondesignz/script.js"></script>
   <style type="text/css">
.c5_Dragondesignz-post .layout-item-0 { padding-right: 10px;padding-left: 10px; }
   .ie7 .c5_Dragondesignz-post .c5_Dragondesignz-layout-cell {border:none !important; padding:0 !important; }
   .ie6 .c5_Dragondesignz-post .c5_Dragondesignz-layout-cell {border:none !important; padding:0 !important; }
   </style>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>C5 Dragondesignz test :: Home</title>
<meta name="description" content="Welcome to the C5 site ofhttp://www.dragondesignz.eu,
You can find here all themes that are made for Concrete5.

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

 
    <link rel="stylesheet" href="/themes/Bright_Dragondesignz/style.css" type="text/css" media="screen" />
    <!--[if IE 6]><link rel="stylesheet" href="/themes/Bright_Dragondesignz/style.ie6.css" type="text/css" media="screen" /><![endif]-->
    <!--[if IE 7]><link rel="stylesheet" href="/themes/Bright_Dragondesignz/style.ie7.css" type="text/css" media="screen" /><![endif]-->
<link rel="shortcut icon" href="/themes/Bright_Dragondesignz/favicon.ico" type="image/x-icon" />
    <script type="text/javascript" src="/themes/Bright_Dragondesignz/jquery.js"></script>
    <script type="text/javascript" src="/themes/Bright_Dragondesignz/script.js"></script>
   <style type="text/css">
.c5_Dragondesignz-post .layout-item-0 { padding-right: 10px;padding-left: 10px; }
   .ie7 .c5_Dragondesignz-post .c5_Dragondesignz-layout-cell {border:none !important; padding:0 !important; }
   .ie6 .c5_Dragondesignz-post .c5_Dragondesignz-layout-cell {border:none !important; padding:0 !important; }
   </style>
 
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>C5 Dragondesignz test :: Home</title>
<meta name="description" content="Welcome to the C5 site ofhttp://www.dragondesignz.eu,
You can find here all themes that are made for Concrete5.
 
If you need more help please go to the theme page." />
<meta name="generator" content="concrete5 - 5.4.2.2" />
 
<script type="text/javascript">
var CCM_DISPATCHER_FILENAME = '/index.php';
var CCM_CID = 1;
var CCM_EDIT_MODE = false;
var CCM_ARRANGE_MODE = false;
var CCM_IMAGE_PATH = "/concrete/images";
var CCM_TOOLS_PATH = "/index.php/tools/required";
var CCM_REL = "";
 
</script>
 
 
<link rel="stylesheet" type="text/css" href="/concrete/css/ccm.base.css?v=2fbbdc2a6544352095e46b51d71e19f2" />
<script type="text/javascript" src="/concrete/js/jquery.js?v=2fbbdc2a6544352095e46b51d71e19f2"></script>
<script type="text/javascript" src="/concrete/js/ccm.base.js?v=2fbbdc2a6544352095e46b51d71e19f2"></script>
<style type="text/css"> 
#blockStyle50HeaderNav1 {background-repeat:no-repeat; } 
#blockStyle54Sidebar3 {background-repeat:no-repeat; } 
 
</style>
<link rel="stylesheet" type="text/css" href="/concrete/blocks/slideshow/view.css?v=2fbbdc2a6544352095e46b51d71e19f2" />
<link rel="stylesheet" type="text/css" href="/packages/jereme_tweetcrete/blocks/jereme_tweetcrete/view.css?v=2fbbdc2a6544352095e46b51d71e19f2" />

Everything works fine :D

openly replied on Oct 22, 2011 at 4:22 am Permalink Reply

You are loading jQuery twice, which can cause problems if they are not the same version, also is an unnecessary overhead.

cainKuri replied on May 15, 2012 at 9:12 am Permalink Reply

I was having a lot of problems with dropdown menu and fancy image and some other addons with images, i found this post after days and helps me and fix the problem. Thank you so much.

Forums

Themes

Where is my Top Edit Bar? <? Loader::element('header_required'); ?>

Code

Post Reply

Delete Post

Mark Post as Spam

Destroy Spammer

Sign In?