Attempting to use Shadowbox

[Tamuren]

Hello,

I am attempting to use shadowbox on one of my ez pages so I may my visitors click an icon of a video and view a youtube video associated with that icon. I added the shadowbox.js file to the correct location, but the instructions on shadowbox's web page indicates that a method within the .js file needs to be called on in the header of the page I'm trying to use it on. This is seriously all that needs to go in the header:

Shadowbox.init();

So where's the page I can modify to affect the contents of the header of my web site?

[RescoCCC]

There are a couple files that are used for the header:

includes/templates/your_template/common/tpl_header.php
includes/languages/english/your_template/header.php

The first file is where you would add any code. The second is where you would change the names of links that appear in the header.

[Tamuren]

Didn't work. Btw in both those files I didn't see any <header> tag, are you sure that's where I should place my mark up? Right now my site completely ignores the shadowbox.css and shadowbox.js files, even though I put the following lines in both of the above files:

<link rel="stylesheet" type="text/css" href="css/shadowbox.css">
<script type="text/javascript" src="jscript/shadowbox.js"></script>
<script type="text/javascript">
Shadowbox.init();
</script>

edit: btw This is the test page I'm using to try and get shadowbox working correctly: http://www.on-grade.ca/index.php?main_page=page&id=4

[Tamuren]

In a more simplistic website I'd simply have to upload shadowbox.js and shadowbox.css to my server, put the following lines into the <header> tag of my web pages:

<link rel="stylesheet" type="text/css" href="shadowbox.css">
<script type="text/javascript" src="shadowbox.js"></script>
<script type="text/javascript">
Shadowbox.init();
</script>

And call on shadowbox via the 'rel' attribute of the <a> tag. This is so simplistic, there must be an easy way to do this via zen cart? : /

[RescoCCC]

OOPS My bad. The correct file for adding the code is:

includes/templates/your_template/common/html_header.php

You would add it right before </head>. Note that there is no such thing as <header>.

[Tamuren]

Haha whoops, typo yo. Guess it's time for me to try again. Thanks for the prompt response.

[Tamuren]

Alrighty, I modified the file 'includes/templates/my_template/common/html_header.php'. Inside this file just before the </head> tag, I added:

<link rel="stylesheet" type="text/css" href="includes/themes/my_theme/css/shadowbox.css">
<script type="text/javascript" src="includes/themes/my_theme/jscript/shadowbox.js"></script>
<script type="text/javascript">
Shadowbox.init();
</script>

It still does not work, and in fact something really weird happens. My manufacturers drop down list on my side bar disappears and the video loads at the bottom of the page, playing but not layered on top of the interface like shadowbox should. It's seriously bizarre. Here's a link to the madness: http://www.on-grade.ca/index.php?main_page=page&id=4

Anyone have any other thoughts?

[Tamuren]

I fixed my problem, it seems that the 'href' attribute of my <link> tag was incorrect. However, if you are looking at the archive and want to know for sure, definitely modify the 'html_header.php' file in your template's common folder!