-0.31
Рейтинг
0.01
Сила

Как подключить javascript?

Здравствуйте. Есть javascript выпадающего блока: Как подключить его к движку?
Вставил файл скрипта в папку «js» скина. В confige прописал
$config['head']['default']['js'][] = '___path.static.skin___/js/template.js';

В header.tpl прописал
<script type="text/javascript">
window.addEvent('domready', function(){
	var mySlide = new Fx.Slide('top-panel');
mySlide.hide();
	$('toggle').addEvent('click', function(e){
		e = new Event(e);
		mySlide.toggle();
		
	});
});
 
</script>
/////////////
</div>
<div id="sub-panel">
  <a href="#" id="toggle">
  <span>Об авторе</span>
  </a>
  </div>

Стили css в grid.css. Не работает! Как нужно сделать?
Вот код скрипта.
html файл
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Slide top panel</title>
<script type="text/javascript" src="mootools.js"></script>
<script type="text/javascript">
window.addEvent('domready', function(){
	var mySlide = new Fx.Slide('top-panel');
mySlide.hide();
	$('toggle').addEvent('click', function(e){
		e = new Event(e);
		mySlide.toggle();
		
	});
});
 
</script>
<style type="text/css">
body{	
	border:0;
	padding:0;
	margin:0;
	font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif; 
	font-size:12px; 
	color:#555555;
}
a:link, a:visited{color:#0066CC;}
#top-panel{
	background: #F60;
	border-bottom:3px solid #a6c34e;
	padding:14px 20px;
	text-align:right;
	height:auto;
	
}
#sub-panel{
	text-align:center;
	color:#000;
}
#sub-panel a{
	margin-top: 40px;
	width:200px;
	float:right;
	color:#000;
	text-decoration:none;
	margin-right:30px;
	font-weight:bold;
	background:url(img/sub-left.png) bottom left no-repeat ;
}
#sub-panel a span{
	padding:6px;
	background:url(img/sub-right.png) right bottom no-repeat;
	display:block;

}
strong{color:#000000;}
.face{border:solid 2px #a6c34e; margin-left:10px; float:right;}

</style>
</head>

<body>
<div id="top-panel">
  ygyhuhuhuhuhuuhuhuuhuuhuhuhuhuhuhuhu
</div>
<div id="sub-panel">
  <a href="#" id="toggle">
  <span>Об авторе</span>
  </a>
  </div>
</body>
</html>

и сам файл со скриптом «mootools.js»
Очень много кода, если необходимо то вставлю

Хочу сделать шаблон. С чего начать?

Ребят, помогите. Подскажите с чего начать? Хочу сделать шаблон на Livestreet. Хорошо верстаю на html5+css3. На джумлу шаблоны делаю. Есть небольшие познания PHP. Вчера сел, поковырял стандартный шаблон. Много перелопатил в CSS. Но в конце концов заблудился. Посмотрел документацию, там только названия файлов, какой за, что отвечает. Но вот, то, что внутри-не понятно совсем. Поясню. К примеру на html стандартный div.
<div id="container"></div>

Что бы вложить в этот див еще один контейнер пишем так:
<div id="container">
<div id="Bar"></div>
</div>

А как подобную операцию сделать в Livestreet? Что можно почитать, что бы хоть как-то вникнуть в устройство движка?