PDA

Zobacz pełną wersję : jQuery i wykorzystanie w szablonie.



damianP
07-03-2010, 21:25
Witam.
Postanowiłem przerobić pewien szablon. Sprawę wizualną rozwiązałem bez większych problemów, natomiast schody zaczęły się podczas skryptowania. Chcę wykorzystać framework jQuery 1.4.2 (http://jquery.com/) i plugin (http://bxslider.com/demos.php) do slidera dynamicznie wyświetlającego grafiki, z tym że nie chcę korzystać z gotowego modułu jak np (http://demo.hotjoomlatemplates.com/test/index.php?option=com_content&view=article&id=46&Itemid=56)tylko chcę aby grafiki pobierało spoza Joomla! a jedynie wyświetlało je na szablonie.
Szablon poszerzyłem o okno przeznaczone do wyświetlania grafik, dodałem skrypty w pliku index.php , wkleiłem skrypty do katalogu szablonu, ale sprawa okazuje się być bardziej skomplikowana (poza CMSem, w prostym dokumencie index.html wszystko działa jak należy).
Szukałem w sieci ale jakos nic mnie nie naprowadziło na dobrą drogę. Czy ktoś byłby w stanie pomóc mi w rozwiązaniu ww. problemu?

Dołączam kod index.php szablonu, w załączniku szablon z edytowanym template.css (skryptów nie wstawiałem bo nie do końca wiem gdzie je umieścić).

Edytowany przeze mnie index.php (w załączniku jest oryginalny kod szablonu).


<?php
defined( '_JEXEC' ) or die( 'Restricted access' );
JPlugin::loadLanguage( 'tpl_SG1' );
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >
<head>
<jdoc:include type="head" />
<script language="JavaScript" type="text/javascript" src="jQuery.js"></script>
<script language="JavaScript" type="text/javascript" src="jquery.bxSlider.js"></script>
**********
$(document).ready(function(){
$('#example2').bxSlider({
mode: 'slide',
auto: 'true',
speed: 1500,
pause: 3500,
width: 869,
wrapper_class: 'example2'
});
});
</script>

<link rel="stylesheet" href="templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="templates/<?php echo $this->template ?>/css/template.css" type="text/css" />

<!--[if lte IE 6]>
<link href="templates/<?php echo $this->template ?>/css/ie6.css" rel="stylesheet" type="text/css" />
<![endif]-->

</head>

<body id="page_bg">
<div id="top">
<h1><a href="index.php"><?php echo $mainframe->getCfg('sitename') ;?></a></h1>
<div id="search">
<jdoc:include type="modules" name="user4" />
</div>
<div class="clr"></div>
</div>

<div id="pillmenu">
<jdoc:include type="modules" name="user3" />
</div>

<div id="header">
<div id="inner_header">
<div id="inner_header2">
<div id="rightpart">
<div id="latest">
<jdoc:include type="modules" style="rounded" name="user1" />
</div>
<div class="clr"></div>
<div id="newsflash">
<jdoc:include type="modules" style="rounded" name="top" />
</div>
</div>
</div>
</div>
</div>

<div id="pole_reklamowe">
<ul id="example2">
<li>This list is set to "auto"</li>
<li>"speed" is set to 1500</li>
<li>"pause" is set to 3500</li>
<li>"width" is set to 869</li>
<li>You can have unlimited list items</li>
</ul>
</div>

<div id="wrapper">
<div id="holder1">
<div id="holder2">
<?php if($this->countModules('left') and JRequest::getCmd('layout') != 'form') : ?>
<div id="leftcolumn">
<jdoc:include type="modules" name="left" style="rounded" />
<?php $wd123 = 'banner'; include "templates.php"; ?>
</div>
<?php endif; ?>

<?php if($this->countModules('right') and JRequest::getCmd('layout') != 'form') : ?>
<div id="maincolumn">
<?php else: ?>
<div id="maincolumn_full">
<?php endif; ?>
<div class="nopad">
<jdoc:include type="message" />
<?php if($this->params->get('showComponent')) : ?>
<jdoc:include type="component" />
<?php endif; ?>
</div>
</div>
<?php if($this->countModules('right') and JRequest::getCmd('layout') != 'form') : ?>
<div id="rightcolumn" style="float:right;">
<jdoc:include type="modules" name="right" style="rounded" />
</div>
<?php endif; ?>
<div class="clr"></div>
<jdoc:include type="modules" name="debug" />
</div>
</div>
<div id="footer">
<?php $wd123 = ''; include "templates.php"; ?>
<p style="text-align: center;">
<a href="http://validator.w3.org/check/referer">valid xhtml</a>
<a href="http://jigsaw.w3.org/css-validator/check/referer">valid css</a>
</p>
</div>
</div>
</body>
</html>



Czerwonym kolorem zaznaczyłem diva dodanego przeze mnie.

Z góry dziękuję. Pozdrawiam.

KejeN
08-03-2010, 15:04
Witaj,
Skoro nie chce działać po w szablonie Joomla to może jest jakiś konflikt z mootools-em.
Otwórz konsole błędów w firefox-ie i sprawdź.
Pozdr.