Header_required and javascript
Permalink
Hi
I am new to concrete and it is the first time i am making a theme for it.
Currently i am having troubles by getting the header_required and my own javascript files to work simultaneously.
This is the code in my header:
<script src="<?= $this->getThemePath() ?>/js/jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="<?= $this->getThemePath() ?>/js/jquery.easing.1.3.js" type="text/javascript"></script>
<script src="<?= $this->getThemePath() ?>/js/cufon-yui.js" type="text/javascript"></script>
<script src="<?= $this->getThemePath() ?>/js/ColaborateLight_400.font.js" type="text/javascript"></script>
<script src="<?= $this->getThemePath() ?>/js/jquery.scrollTo-min.js" type="text/javascript"></script>
<script src="<?= $this->getThemePath() ?>/js/jquery.prettyPhoto.js" type="text/javascript"></script>
<script src="<?= $this->getThemePath() ?>/js/jquery.nivo.slider.js" type="text/javascript"></script>
<script src="<?= $this->getThemePath() ?>/js/init.js" type="text/javascript"></script>
<!--[if IE 6]>
<script src="js/DD_belatedPNG_0.0.7a-min.js" type="text/javascript"></script>
<script>
/* EXAMPLE */
DD_belatedPNG.fix('.ie6fix');
</script>
<![endif]-->
<? Loader::element('header_required'); ?>
The problem is that all my javascript is not loading when the header_required line is in the end of the header.
What can I do?
I am new to concrete and it is the first time i am making a theme for it.
Currently i am having troubles by getting the header_required and my own javascript files to work simultaneously.
This is the code in my header:
<script src="<?= $this->getThemePath() ?>/js/jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="<?= $this->getThemePath() ?>/js/jquery.easing.1.3.js" type="text/javascript"></script>
<script src="<?= $this->getThemePath() ?>/js/cufon-yui.js" type="text/javascript"></script>
<script src="<?= $this->getThemePath() ?>/js/ColaborateLight_400.font.js" type="text/javascript"></script>
<script src="<?= $this->getThemePath() ?>/js/jquery.scrollTo-min.js" type="text/javascript"></script>
<script src="<?= $this->getThemePath() ?>/js/jquery.prettyPhoto.js" type="text/javascript"></script>
<script src="<?= $this->getThemePath() ?>/js/jquery.nivo.slider.js" type="text/javascript"></script>
<script src="<?= $this->getThemePath() ?>/js/init.js" type="text/javascript"></script>
<!--[if IE 6]>
<script src="js/DD_belatedPNG_0.0.7a-min.js" type="text/javascript"></script>
<script>
/* EXAMPLE */
DD_belatedPNG.fix('.ie6fix');
</script>
<![endif]-->
<? Loader::element('header_required'); ?>
The problem is that all my javascript is not loading when the header_required line is in the end of the header.
What can I do?
If i put the javascript after the call to Loader::element('header_required'); all of my javascript works, but the editing line in top of the page does not.
It is just a white line across my website without any buttons :(
It is just a white line across my website without any buttons :(
Then something in your javascript is causing the toolbar to do that. Trust me, it's going to be easier to fix that problem then it will be to get the jquery's to not conflict with each other.
I would try to isolate the problem by taking out different javascript files and reloading the page and seeing when the toolbar reappear. Once you know which file is causing the problem, it might be possible to see what exactly it's doing.
The Firebug plugin for FireFox would also be a useful tool to help figure this out -- you could put a breakpoint on the javascript when the page first loads and step through it all and maybe see where things go wrong.
Good luck!
-Jordan
I would try to isolate the problem by taking out different javascript files and reloading the page and seeing when the toolbar reappear. Once you know which file is causing the problem, it might be possible to see what exactly it's doing.
The Firebug plugin for FireFox would also be a useful tool to help figure this out -- you could put a breakpoint on the javascript when the page first loads and step through it all and maybe see where things go wrong.
Good luck!
-Jordan
I found the error:
It was this line:
<script src="<?= $this->getThemePath() ?>/js/jquery-1.4.2.min.js" type="text/javascript"></script>
I just needed to delete it and then it worked :)
Thank you very much.
It was this line:
<script src="<?= $this->getThemePath() ?>/js/jquery-1.4.2.min.js" type="text/javascript"></script>
I just needed to delete it and then it worked :)
Thank you very much.
Could you walk me through this?>
Which bit do you need help with?
Its pretty much a case of comment out all your custom javascript code,
and then re-enable it one bit a time.
When your site breaks, you know its the last thing you added that broke it.
In most cases, its when someone loads a file called jQuery.x.x.js
This is because Concrete5 loads jQuery in the header loading in two lots of jquery causes problems and often results in a hidden top admin bar or some javascript not working.
Its pretty much a case of comment out all your custom javascript code,
and then re-enable it one bit a time.
When your site breaks, you know its the last thing you added that broke it.
In most cases, its when someone loads a file called jQuery.x.x.js
This is because Concrete5 loads jQuery in the header loading in two lots of jquery causes problems and often results in a hidden top admin bar or some javascript not working.
* You're loading jquery on your own, but it's also included by the system automatically so they will conflict.
* You need to put all of your js AFTER the call to Loader::element('header_required') -- because of the aforementioned jquery issue (it's included by that call)
*in your [if IE 6], you forgot to put $this->getThemePath()
HTH