добавив скрипт jquery на страницу Magento - PullRequest
Новая
       2

добавив скрипт jquery на страницу Magento

2 голосов
/ 21 декабря 2010

это сводило меня с ума. Я не могу понять, как добавить какой-нибудь скрипт jquery в заголовочный раздел определенной страницы в Magento 1.4.2. Я добавил последнюю библиотеку jquery на все страницы, отредактировав page.xml, и добавил, что нет конфликта.

Я знаю, что мне нужно добавить код в область обновления пользовательского макета для рассматриваемой страницы. Однако ничего не работает, я пробовал много кусков кода, и ни один не появляется в заголовке страницы, когда я позже проверю исходный код.

Я разместил тот же вопрос на официальном форуме Мангето, но через восемь дней, и никаких ответов. Этот форум ужасен для получения советов, большинство вопросов остаются без ответа :(. Любая идея, как я мог бы добавить к голове через пользовательский макет обновления, например? 

$(document).ready(function(){
    $("a").click(function(event){
        alert("Thanks for visiting!");
    });
});

Я попытался включить это в теги скрипта, в тег тега = head. Ничего не работает Вытаскивая свои волосы, я гуглил каждую словосочетание, которое только мог придумать, но нет примеров того, как добавить текст в заголовок страницы в Magento. Пожалуйста, помогите.

Ответы [ 3 ]

8 голосов
/ 21 декабря 2010

расширение на отличное резюме Алана.Если вы просто хотите добавить файл на одну конкретную страницу, вы можете использовать следующий фрагмент в поле XML обновления макета: 

<reference name="head">
    <action method="addJs"><script>path/to/my/file.js</script></action>
</reference>

и поместить файл в http://example.com/js/path/to/my/file.js

или, есливы хотите, чтобы он находился в вашей папке скина, используйте 

<reference name="head">
    <action method="addItem"><type>skin_js</type><name>js/file.js</name><params/></action>
</reference>

с ожидаемым расположением http://example.com/skin/frontend/base/default/js/file.js смена базы и значения по умолчанию в соответствии с пакетом и темой, которую вы используете

Вы также можетеиспользуйте приведенный выше фрагмент в любом другом файле макета / ?. XML, просто поместите его в дескриптор макета, к которому вы хотите обратиться.Например, чтобы разместить его на всех страницах cms в cms.xml, вы найдете 

<cms_page>
 ....
</cms_page>

и измените его на 

<cms_page>
    ...
    <reference name="head">
        <action method="addJs"><script>path/to/my/file.js</script></action>
    </reference>
</cms_page>

, а также еще один простой способ добавления фрагмента JavaScript ввсе страницы перейдите в Система> Конфигурация> Дизайн> Нижний колонтитул> Разное HTML

Дополнительная информация:

Использование local.xml для настройки темы

Демистификация макета Magento XML

3 голосов
/ 21 декабря 2010

Вот три разных способа сделать это.Мне было бы трудно назвать один из них более «правильным», чем другой.

Первый подход : Похоже, вы использовали page.xml для добавления базовой библиотеки jQueryна вашу страницу.Если вы знаете, как это сделать, вы можете добавить что-то вроде 

<action method="addJs"><script>path/to/my/file.js</script></action>

ниже действия, которое вы добавили для jQuery.Затем поместите свой код в файл file.js, который в конечном итоге будет связан в вашей голове.

Второй подход : если вы посмотрите на класс Block для головы, вы увидите, где находитсяфайл шаблона установлен.

app/code/core/Mage/Page/Block/Html/Head.php

...
protected function _construct()
{
    $this->setTemplate('page/html/head.phtml');
}

Найдите page/html/head.phtml в своей теме и добавьте код непосредственно в page.html.

Третий подход : Если вы посмотрите на упомянутую выше акцию page.html, вы увидите эту строку 

<?php echo $this->getChildHtml() ?>

Обычно метод getChildHtmlиспользуется для визуализации определенного дочернего блока.Однако, если вызывается без параметра, getChildHtml автоматически отобразит все дочерние блоки.Это означает, что вы можете добавить что-то вроде 

<!-- existing line --> <block type="page/html_head" name="head" as="head"> 
    <!-- new sub-block you're adding --> <block type="core/template" name="stackoverflow" as="stackoverflow" template="page/stackoverflow.phtml"/>
    ...

в page.xml, а затем добавить файл stackoverflow.phtml.Любой блок, добавленный в головной блок, будет автоматически обработан.(этот автоматический рендеринг не применяется для всех блоков макета, только для блоков, где getChildHtml вызывается без параметров)

Ваш файл phtml не обязательно должен быть в page/, вы можете разместить его где угоднов структуре папок шаблона вашей темы.Файл stackoverflow.phtml будет содержать JavaScript, который вы хотите добавить в заголовок 

<script type="text/javascript">
    alert("Test");
</script>
3 голосов
/ 21 декабря 2010

Если вы добавили библиотеку jQuery и включили режим noConflict, то вам следует попытаться получить доступ к объекту jQuery с помощью переменной jQuery, а не переменной $.Попробуйте вот так и посмотрите, работает ли он: 

jQuery(document).ready(function(){
    jQuery("a").click(function(event){
        alert("Thanks for visiting!");
    });
});

Если это не сработает, вы должны дважды проверить вывод html, чтобы увидеть, включена ли библиотека jQuery перед запуском скрипта.Это очень важно, поскольку JavaScript обрабатывает последовательно на странице сверху вниз.

...