JQuery Help Needed

Permalink
http://www.portobellarain.com/hoodiemonkeecentral/index.php

here is the page I need to work on.

http://www.portobellarain.com/hoodiemonkeecentral/themes/HoodieMonk...

here is the jquery that I would like it to go on.

<?php  defined('C5_EXECUTE') or die("Access Denied."); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- Site Header Content //-->
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getStyleSheet('main.css')?>" />
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getStyleSheet('typography.css')?>" />
<?php  Loader::element('header_required'); ?>
</head>
<body>
<div id="page">
      <div id="header">
      <?php
      $a = new Area('Header');


here is my header.PHP.

I have used jquery before on other sites, but the structure to them was different with the index being in HTML and there were separate files for each aspect of the component.

Things I have tried:
I have tried to copy it in as HTML- this crashes the page. I have added the script to the header of the page and this crashes it also. If I take just a section of the code and paste it in, this just brings up a column of images.

Could anyone take a look at the source view and get back to me on how I might get this into the page?

Stuck.

PortobellaRain
 
PortobellaRain replied on at Permalink Reply
PortobellaRain
<?php  defined('C5_EXECUTE') or die("Access Denied."); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- Site Header Content //-->
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getStyleSheet('main.css')?>" />
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getStyleSheet('typography.css')?>" />
<?php  Loader::element('header_required'); ?>
<link rel="stylesheet" media="screen" type="text/css" 
href="<?php echo $this->getStyleSheet('main.css')?>" />
<link rel="stylesheet" media="screen" type="text/css" 
href="<?php echo $this->getStyleSheet('typography.css')?>" />
<body>
<div id="page">
PortobellaRain replied on at Permalink Reply
PortobellaRain
My new header.php, but it still doesn't work.
jordanlev replied on at Permalink Reply
jordanlev
Wasn't this just in another thread? You're repeating everything twice, and you shouldn't load jquery yourself because C5 loads it already. So take out your extra calls to Loader::element('header_required') and main.css and typography.css and the jquery call.
PortobellaRain replied on at Permalink Reply
PortobellaRain
Hi There,

this is a new thread as I'm very new to jquery and I have used two different formats for 2 different projects. 1 with all the components in different files, i.e. separate .css +.js and this new one that was originally running off a single index.php with the css at the top, the java/jquery in the middle of the document and the HTML at the bottom.

I have taken what I know and separated the document into three, with an HTML index page, a separate .css file and a .js file and when transferred over, it works.

http://www.portobellarain.com/hoodiemonkeecentral/themes/HoodieMonk...

I have removed the double calls and it is working, but in the first instance that we working through the other day, @portobellarain.com, the file crashes when I take the call for j query out and so the only way I can get it to work is keeping it in the header php.

This is the header.php for this thread anyway:

<?php  defined('C5_EXECUTE') or die("Access Denied."); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- Site Header Content //-->
 <?php  Loader::element('header_required'); ?>
<link rel="stylesheet" media="screen" type="text/css" 
href="<?php echo $this->getStyleSheet('main.css')?>" />
<link rel="stylesheet" media="screen" type="text/css" 
href="<?php echo $this->getStyleSheet('typography.css')?>" />
<body>
<div id="page">
      <div id="header">
      <?php


I have taken the call for j query out at the bottom and when I put the HTML block in, it crashes and I have to remove the version.

Have you any ideas as to why? I have tested it so many times today, but am not sure what it is that is different to my other site.

Best wishes,

Ben.
PortobellaRain replied on at Permalink Reply
PortobellaRain
I'm having a complete nightmare,

I have made the changes you suggested and they did'nt work, the jquery file on the home page loses all its structure and then to top it all off, when I log in to edit the page and delete the file, the edit bar disappears.

I have reverted back to what I had before so at the very least I have one site that sort of works, but even with the original changes, I cannot edit the pages.

1. I have cleared the cache
2. swapped code about in the header.php (I guess this is where the problem lies)Its now as it was in the first code panel above, I have made these changes you suggested, but they are wrecking the page.

what I don't understand is if JQuery is already formatted, then it should just let me put the HTML Code with the script in right? It doesn't - all that happens is a wreck. Lost today, out of solutions. :D Prfff.
mdzoidberg replied on at Permalink Reply
mdzoidberg
Look what the source code looks like on your page, why do you have so many head tags and body tags opening and closing? looks like your page types are not layout correctly.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- Site Header Content //-->
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>Portobella Creative Design :: Home</title>
<meta name="description" content="" />
<meta name="generator" content="concrete5 - 5.4.1.1" />
<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";
PortobellaRain replied on at Permalink Reply
PortobellaRain
Ok, I have been using a simple layout for the pages that I took from a tutorial. I've been able to edit them for different requirements.

I was thinking that the reason for all this was down to the header.php, I will look at the main css too.

Thanks for the highlight, I would'nt have known to go there.

There will be gaping errors in places as I have been teaching myself how to do this, so will crack on and correct this as best I can.
PortobellaRain replied on at Permalink Reply
PortobellaRain
I have looked at the layout and just wanted to add that the reason for the body tags in the header is due to an block of HTML I have added in for navigation.

I am convinced that is due to this code:

<!-- Required script --> 
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" charset="utf-8"></script> 
  <script type="text/javascript" src="js/jquery.movingboxes.js" charset="utf-8"></script> 
  <!-- Demo only --> 
  <link type="text/css" href="http://www.portobellarain.com/themes/clouds/Introslide/demo.css" media="screen" charset="utf-8" rel="stylesheet"  /> 
  <script type="text/javascript" src="demo/demo.js"></script> </div>   </div> 
   <div id="page_edge" class="drop_shadow"> 
      <div id="content_area" class="inner_shadow"> 
      <h1></h1> 
<h2></h2>
that's in the header, I placed this in thinking it would be needed to call the JQuery, but was wrong and I think its why I can't edit the page and delete it.

Your thoughts would be appreciated.

Ben.
mdzoidberg replied on at Permalink Best Answer Reply
mdzoidberg
remove the call to jQuery, C5 already loads jQuery when you include <?php Loader::element('header_required'); ?>, try to call your JS files like this

<script type="text/javascript" src="<?php echo $this->getThemePath(); ?>/js/jquery.movingboxes.js"></script>


See if that helps.
PortobellaRain replied on at Permalink Reply
PortobellaRain
Thank you! Have placed that code into the header.php at the bottom, I will let you know how this turns out.

Thanks for the help, have been hitting a brick wall so many times today.
PortobellaRain replied on at Permalink Reply
PortobellaRain
finally found a solution and I have been able to get all of it in.

Thanks so much to you both for helping me today, needed the support and got there in the end. :D