how do I add jquery?
Permalink
Hi, I'm trying to add a link in the header file to the required jquery library but think I may be missing something.
I'm using:
<script type="text/javascript" src="js/easySlider1.7.js"></script>
I know there are other files it's the link process I need. Like <?=getThemePath()blah blah blah
any help would be great
thanks
I'm using:
<script type="text/javascript" src="js/easySlider1.7.js"></script>
I know there are other files it's the link process I need. Like <?=getThemePath()blah blah blah
any help would be great
thanks
by default jquery is automatically added to the header
Sorry but am still unsure, outside of c5 the slider works great. Maybe I'm doing something incorrect in c5.
my header file has this, :
<?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 xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script type="text/javascript" src="<?php echo $this->getThemePath()?>/js/jquery.js"></script>
<script type="text/javascript" src="<?php echo $this->getThemePath()?>/js/easySlider1.7.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#slider").easySlider({
auto: true,
continuous: true,
numeric: true
});
});
</script>
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getStyleSheet('main.css')?>" />
<link href="<?php echo $this->getStyleSheet('css/screen.css')?>" rel="stylesheet" type="text/css" media="screen" />
<style type="text/css">@import "<?php echo $this->getStyleSheet('typography.css')?>";</style>
<?php Loader::element('header_required'); ?><!-- this shows the c5 edit tool bar -->
</head>
and my main default.php has this:
<?php
defined('C5_EXECUTE') or die(_("Access Denied."));
$this->inc('elements/header.php'); ?>
<div id="leftMini">
<?php
$a = new Area('leftMini');
$a->display($c);
?>
</div>
<div id="leftFull">
<div id="slider">
<ul>
<li><a href="http://templatica.com/preview/30"><img src="images/01.jpg" alt="Css Template Preview" /></a></li>
<li><a href="http://templatica.com/preview/7"><img src="./images/02.jpg" alt="Css Template Preview" /></a></li>
<li><a href="http://templatica.com/preview/25"><img src="./images/03.jpg" alt="Css Template Preview" /></a></li>
<li><a href="http://templatica.com/preview/26"><img src="./images/04.jpg" alt="Css Template Preview" /></a></li>
<li><a href="http://templatica.com/preview/27"><img src="./images/05.jpg" alt="Css Template Preview" /></a></li>
</ul>
</div>
</div>
<div id="leftMini2">
<?php
$a = new Area('leftMini2');
$a->display($c);
?>
</div>
<div class="baseBlock" >
<div class="boxBlock">
<div class="boxInner">
<?php
$as = new Area('baseBlock');
$as->display($c);
?>
</div>
</div>
<div class="boxBlock">
<div class="boxInner">
<?php
$as = new Area('baseBlock2');
$as->display($c);
?>
</div>
</div>
<div class="boxBlock" id="last3">
<div class="boxInner" >
<?php
$as = new Area('baseBlock3');
$as->display($c);
?>
</div>
</div>
</div>
</div> <!--close baseBlock-->
<div class="baseBlock" >
<div class="boxBlock">
<div class="boxInner">
<?php
$as = new Area('baseBlock4');
$as->display($c);
?>
</div>
</div>
<div class="boxBlock">
<div class="boxInner">
<?php
$as = new Area('baseBlock5');
$as->display($c);
?>
</div>
</div>
<div class="boxBlock" id="last6">
<div class="boxInner" >
<?php
$as = new Area('baseBlock6');
$as->display($c);
?>
</div>
</div> <!--close baseBlock-->
<?php $this->inc('elements/footer.php'); ?>
my header file has this, :
<?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 xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script type="text/javascript" src="<?php echo $this->getThemePath()?>/js/jquery.js"></script>
<script type="text/javascript" src="<?php echo $this->getThemePath()?>/js/easySlider1.7.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#slider").easySlider({
auto: true,
continuous: true,
numeric: true
});
});
</script>
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getStyleSheet('main.css')?>" />
<link href="<?php echo $this->getStyleSheet('css/screen.css')?>" rel="stylesheet" type="text/css" media="screen" />
<style type="text/css">@import "<?php echo $this->getStyleSheet('typography.css')?>";</style>
<?php Loader::element('header_required'); ?><!-- this shows the c5 edit tool bar -->
</head>
and my main default.php has this:
<?php
defined('C5_EXECUTE') or die(_("Access Denied."));
$this->inc('elements/header.php'); ?>
<div id="leftMini">
<?php
$a = new Area('leftMini');
$a->display($c);
?>
</div>
<div id="leftFull">
<div id="slider">
<ul>
<li><a href="http://templatica.com/preview/30"><img src="images/01.jpg" alt="Css Template Preview" /></a></li>
<li><a href="http://templatica.com/preview/7"><img src="./images/02.jpg" alt="Css Template Preview" /></a></li>
<li><a href="http://templatica.com/preview/25"><img src="./images/03.jpg" alt="Css Template Preview" /></a></li>
<li><a href="http://templatica.com/preview/26"><img src="./images/04.jpg" alt="Css Template Preview" /></a></li>
<li><a href="http://templatica.com/preview/27"><img src="./images/05.jpg" alt="Css Template Preview" /></a></li>
</ul>
</div>
</div>
<div id="leftMini2">
<?php
$a = new Area('leftMini2');
$a->display($c);
?>
</div>
<div class="baseBlock" >
<div class="boxBlock">
<div class="boxInner">
<?php
$as = new Area('baseBlock');
$as->display($c);
?>
</div>
</div>
<div class="boxBlock">
<div class="boxInner">
<?php
$as = new Area('baseBlock2');
$as->display($c);
?>
</div>
</div>
<div class="boxBlock" id="last3">
<div class="boxInner" >
<?php
$as = new Area('baseBlock3');
$as->display($c);
?>
</div>
</div>
</div>
</div> <!--close baseBlock-->
<div class="baseBlock" >
<div class="boxBlock">
<div class="boxInner">
<?php
$as = new Area('baseBlock4');
$as->display($c);
?>
</div>
</div>
<div class="boxBlock">
<div class="boxInner">
<?php
$as = new Area('baseBlock5');
$as->display($c);
?>
</div>
</div>
<div class="boxBlock" id="last6">
<div class="boxInner" >
<?php
$as = new Area('baseBlock6');
$as->display($c);
?>
</div>
</div> <!--close baseBlock-->
<?php $this->inc('elements/footer.php'); ?>
remove <script type="text/javascript" src="<?php echo $this->getThemePath()?>/js/jquery.js"></script>
and stick the header_required above all the js you add as that loads jquery
and stick the header_required above all the js you add as that loads jquery
Thanks so very much, the only problem now is that the main content images aren't appearing. I suspect that the path I'm using is wrong though I'm not sure how. Is the path correct?
<li><a href="http://templatica.com/preview/30"><img src="images/01.jpg" alt="Css Template Preview" /></a></li>
or do I have to add a c5 getThemePath or something similar.
Appreciate all your help thanks
<li><a href="http://templatica.com/preview/30"><img src="images/01.jpg" alt="Css Template Preview" /></a></li>
or do I have to add a c5 getThemePath or something similar.
Appreciate all your help thanks
Hello Kappi
Did you ever find the answer to this? I'm trying to achieve the same thing as you and keep encountering TypeErrors - something in the built-in slideshow disagreeing with easySlider. Would really appreciate hearing what you discovered to solve this... that's if you did manage to solve it!
Thanks in advance
Did you ever find the answer to this? I'm trying to achieve the same thing as you and keep encountering TypeErrors - something in the built-in slideshow disagreeing with easySlider. Would really appreciate hearing what you discovered to solve this... that's if you did manage to solve it!
Thanks in advance
