Как добавить jQuery в шаблон Joomla?

Question

Как добавить jQuery в шаблон Joomla?

0

Извините за мое незнание, но я начинаю с Joomla, и мне нужно будет добавить в свой шаблон Joomla Lumiere некоторые сценарии jQuery и их изображения. Я смотрю на шаблон, и я видел, что Index.html не содержит кода, но файл index.php является кодом, и я думаю, я должен добавить этот "там". Код в скрипте php следующий:

<?php
/**
* @version   $Id: index.php 5057 2012-11-06 04:48:10Z rhuk $
 * @author RocketTheme http://www.rockettheme.com
 * @copyright Copyright (C) 2007 - 2012 RocketTheme, LLC
 * @license http://www.gnu.org/licenses/gpl-2.0.html GNU/GPLv2 only
 *
 * Gantry uses the Joomla Framework (http://www.joomla.org), a GNU/GPLv2 content management system
 *
 */
// no direct access
defined( '_JEXEC' ) or die( 'Restricted index access' );

// load and inititialize gantry class
require_once(dirname(__FILE__) . '/lib/gantry/gantry.php');
$gantry->init();

// get the current preset
$gpreset = str_replace(' ','',strtolower($gantry->get('name')));

?>
<!doctype html>
<html xml:lang="<?php echo $gantry->language; ?>" lang="<?php echo $gantry->language;?>" >
<head>
    <?php if ($gantry->get('layout-mode') == '960fixed') : ?>
    <meta name="viewport" content="width=960px">
    <?php elseif ($gantry->get('layout-mode') == '1200fixed') : ?>
    <meta name="viewport" content="width=1200px">
    <?php else : ?>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <?php endif; ?>
    <?php
        $gantry->displayHead();

        $gantry->addStyle('grid-responsive.css', 5);
        $gantry->addLess('bootstrap.less', 'bootstrap.css', 6);
        $gantry->addLess('global.less', 'master.css', 8, array('main-body'=>$gantry->get('main-body','light'), 'main-accent'=>$gantry->get('main-accent', '#a84d6c')));

        if ($gantry->browser->name == 'ie'){
            if ($gantry->browser->shortversion == 9){
                $gantry->addInlineScript("if (typeof RokMediaQueries !== 'undefined') window.addEvent('domready', function(){ RokMediaQueries._fireEvent(RokMediaQueries.getQuery()); });");
            }
            if ($gantry->browser->shortversion == 8){
                $gantry->addScript('html5shim.js');
            }
        }
        if ($gantry->get('layout-mode', 'responsive') == 'responsive') $gantry->addScript('rokmediaqueries.js');
        if ($gantry->get('loadtransition')) {
        $gantry->addScript('load-transition.js');
        $hidden = ' class="rt-hidden"';}

    ?>
</head>
<body <?php echo $gantry->displayBodyTag(); ?>>
    <?php /** Begin Top Surround **/ if ($gantry->countModules('top') or $gantry->countModules('header')) : ?>
    <header id="rt-top-surround">
        <?php /** Begin Top **/ if ($gantry->countModules('top')) : ?>
        <div id="rt-top" <?php echo $gantry->displayClassesByTag('rt-top'); ?>>
            <div class="rt-container">
                <?php echo $gantry->displayModules('top','standard','standard'); ?>
                <div class="clear"></div>
            </div>
        </div>
        <?php /** End Top **/ endif; ?>

        <?php echo $gantry->displayModules('background','basic','basic'); ?>
        <?php if (($gantry->countModules('showcase')) and (!$gantry->countModules('feature'))) : ?>
        <div class="rt-bg-fade"></div>
        <?php endif; ?>

        <?php /** Begin Header **/ if ($gantry->countModules('header')) : ?>
        <div id="rt-header">
            <div class="rt-container">
                <?php echo $gantry->displayModules('header','standard','standard'); ?>
                <div class="clear"></div>
            </div>
        </div>
        <?php /** End Header **/ endif; ?>
        <?php /** Begin Showcase **/ if ($gantry->countModules('showcase')) : ?>
        <div id="rt-showcase">
            <div class="rt-container">
                <?php echo $gantry->displayModules('showcase','standard','standard'); ?>
                <div class="clear"></div>
            </div>
        </div>
        <?php /** End Showcase **/ endif; ?>
        <?php /** Begin Feature **/ if ($gantry->countModules('feature')) : ?>
        <div id="rt-feature">
            <div class="rt-container">
                <?php echo $gantry->displayModules('feature','standard','standard'); ?>
                <div class="clear"></div>
            </div>
        </div>
        <?php /** End Feature **/ endif; ?>
    </header>
    <?php /** End Top Surround **/ endif; ?>
    <?php /** Begin Drawer **/ if ($gantry->countModules('drawer')) : ?>
    <div id="rt-drawer">
        <div class="rt-container">
            <?php echo $gantry->displayModules('drawer','standard','standard'); ?>
            <div class="clear"></div>
        </div>
    </div>
    <?php /** End Drawer **/ endif; ?>
    <div id="rt-main-container">
        <div id="rt-transition"<?php if ($gantry->get('loadtransition')) echo $hidden; ?>>
            <div id="rt-mainbody-surround">
                <?php /** Begin Utility **/ if ($gantry->countModules('utility')) : ?>
                <div id="rt-utility">
                    <div class="rt-container">
                        <?php echo $gantry->displayModules('utility','standard','standard'); ?>
                        <div class="rt-main-divider"></div>
                        <div class="clear"></div>
                    </div>
                </div>
                <?php /** End Utility **/ endif; ?>
                <?php /** Begin Breadcrumbs **/ if ($gantry->countModules('breadcrumb')) : ?>
                <div id="rt-breadcrumbs">
                    <div class="rt-container">
                        <?php echo $gantry->displayModules('breadcrumb','standard','standard'); ?>
                        <div class="clear"></div>
                    </div>
                </div>
                <?php /** End Breadcrumbs **/ endif; ?>
                <?php /** Begin Main Top **/ if ($gantry->countModules('maintop')) : ?>
                <div id="rt-maintop">
                    <div class="rt-container">
                        <?php echo $gantry->displayModules('maintop','standard','standard'); ?>
                        <div class="clear"></div>
                    </div>
                </div>
                <?php /** End Main Top **/ endif; ?>
                <?php /** Begin Main Body **/ ?>
                <div class="rt-container">
                        <?php echo $gantry->displayMainbody('mainbody','sidebar','standard','standard','standard','standard','standard'); ?>
                    </div>
                <?php /** End Main Body **/ ?>
                <?php /** Begin Main Bottom **/ if ($gantry->countModules('mainbottom')) : ?>
                <div id="rt-mainbottom">
                    <div class="rt-container">
                        <?php echo $gantry->displayModules('mainbottom','standard','standard'); ?>
                        <div class="clear"></div>
                    </div>
                </div>
                <?php /** End Main Bottom **/ endif; ?>
                <?php /** Begin Extension **/ if ($gantry->countModules('extension')) : ?>
                <div id="rt-extension">
                    <div class="rt-container">
                        <?php echo $gantry->displayModules('extension','standard','standard'); ?>
                        <div class="clear"></div>
                    </div>
                </div>
                <?php /** End Extension **/ endif; ?>
            </div>
        </div>
        <?php /** Begin Bottom **/ if ($gantry->countModules('bottom')) : ?>
        <div id="rt-bottom">
            <div class="rt-container">
                <?php echo $gantry->displayModules('bottom','standard','standard'); ?>
                <div class="clear"></div>
            </div>
        </div>
        <?php /** End Bottom **/ endif; ?>
        <?php /** Begin Footer Section **/ if ($gantry->countModules('footer') or $gantry->countModules('copyright')) : ?>
        <footer id="rt-footer-surround">
            <?php /** Begin Footer **/ if ($gantry->countModules('footer')) : ?>
            <div id="rt-footer">
                <div class="rt-container">
                    <?php echo $gantry->displayModules('footer','standard','standard'); ?>
                    <div class="clear"></div>
                </div>
            </div>
            <?php /** End Footer **/ endif; ?>
            <?php /** Begin Copyright **/ if ($gantry->countModules('copyright')) : ?>
            <div id="rt-copyright">
                <div class="rt-container">
                    <?php echo $gantry->displayModules('copyright','standard','standard'); ?>
                    <div class="clear"></div>
                </div>
            </div>
            <?php /** End Copyright **/ endif; ?>
        </footer>
        <?php /** End Footer Surround **/ endif; ?>
        <?php /** Begin Debug **/ if ($gantry->countModules('debug')) : ?>
        <div id="rt-debug">
            <div class="rt-container">
                <?php echo $gantry->displayModules('debug','standard','standard'); ?>
                <div class="clear"></div>
            </div>
        </div>
        <?php /** End Debug **/ endif; ?>
    </div>
    <?php /** Begin Popups **/
        echo $gantry->displayModules('popup','popup','popup');
        echo $gantry->displayModules('login','login','popup');
    /** End Popup s**/ ?>
    <?php /** Begin Analytics **/ if ($gantry->countModules('analytics')) : ?>
    <?php echo $gantry->displayModules('analytics','basic','basic'); ?>
    <?php /** End Analytics **/ endif; ?>
    </body>
</html>
<?php
$gantry->finalize();
?>

Я думаю, я должен добавить файлы js в папку Js и файлы css в папку CSS и изображения в папку "Изображения", но если у меня есть следующие сценарии js/css:

carousel.css
carousel.js
jquery.roundabout.min.js
jquery-1.6.min.js

Какой код должен добавить к этому скрипту php (см. Выше), чтобы этот файл отлично работал? Заранее спасибо Алехандро PS: Извините за мой маленький английский

Alejandro Castan 21 окт. 2013, в 19:48

Источник

Теги:

php

jquery

joomla

joomla3.0

2 ответа

2

Способ Joomla для загрузки файлов Javascript и CSS будет JHtml::script('path-to-file'); и JHtml::stylesheet('path-to-stylesheet'); , Документ: http://docs.joomla.org/Adding_JavaScript_and_CSS_to_the_page

Вы можете бесплатно хранить файлы, но рекомендуется их немного упорядочить. Включение их в js и css-папки - это то, что делают большинство людей.

На стороне: Joomla 3.x поставляется с версией (1.8.1) включенной jQuery. Вы можете загрузить это с помощью JHtml::_('jquery.framework'); Это также гарантирует, что он загружается только один раз.

Также был бы включен карусельный плагин с Bootstrap, который также поставляется с Joomla 3.x. Вы можете загрузить его с помощью JHtml::_('bootstrap.carousel'); , Если вы используете тот, вам явно не нужно загружать jQuery, поскольку он позаботится об этом.

См. Http://docs.joomla.org/J3.1:Javascript_Frameworks для получения дополнительной информации о включенных фреймах.

Bakual 21 окт. 2013, в 17:16

0

Привет Бакуаль, я увижу информацию и попробую! Спасибо за вашу помощь ! Alejandro
Alejandro Castan 22 окт. 2013, в 18:53
0

Это гораздо лучший способ добавить jquery в шаблон Joomla. Главным образом из-за этого пункта «Это также обеспечит загрузку только один раз». +1
Neel 09 дек. 2014, в 11:58

Ещё вопросы

Привет Бакуаль, я увижу информацию и попробую! Спасибо за вашу помощь ! Alejandro
Это гораздо лучший способ добавить jquery в шаблон Joomla. Главным образом из-за этого пункта «Это также обеспечит загрузку только один раз». +1

Lodder · Accepted Answer · 2013-10-21T16-26-00.000Z

Увидев, что вы используете Gantry Framework, загрузите файлы js и css в следующие места:

templates/yourtemplate/js

а также

templates/yourtemplate/css

затем в index.php вашего шаблона добавьте следующий код:

$gantry->addScript("name_of_file.js"); 
$gantry->addStyle("name_of_file.css");

Привет, Лоддер, я попробую! Спасибо за вашу помощь ! Alejandro