Конспект

Я хотів би додати блок до перегляду згрупованих продуктів і простого продукту. Цей блок буде мати кілька приємних підказок для наближення станів, я використовую невелику бібліотеку з одним плагіном jquery та однією таблицею стилів css.

Я хотів би включити ці два ресурси до Магенто лише на цих сторінках.

Примітки

• Я запускаю власну тему;
• Кешування вимкнено ; і
• Мої файли знаходяться всередині /jsкаталогу;

Поки що…

Тим не менш я знав, що одним із способів є використання layout.xmlв моєму модулі, спочатку це не спрацювало, тому я подумав, що, можливо, мені потрібна додаткова конфігурація, config.xmlщоб розповісти Magento про мої вимоги до компонування - це теж не спрацювало.

До не працює , що я маю в виду, мої активи не були завантажені.

Знайдіть додане джерело нижче.

app / code / local / Vendor / Rating / etc / layout.xml

<?xml version="1.0"?>
<layout>
    <default>
        <reference name="head">
            <action method="addJs">
                <script>vendor/qtip/jquery.qtip.min.js</script>
            </action>
            <action method="addCss">
                <stylesheet>vendor/qtip/jquery.qtip.min.css</stylesheet>
            </action>
        </reference>
    </default>
</layout>

app / code / local / Vendor / Rating / тощо / config.xml

<?xml version="1.0"?>
<config>

    ...

    <frontend>
        <layout>
            <updates>
                <vendor_rating>
                    <file>layout.xml</file>
                </vendor_rating>
            </updates>
        </layout>
    </frontend>

    ...

</config>

По-перше, слід розмістити файл макета app/design/frontend/{interface}/{theme}/layout/.
Друге. Якщо ви хочете додати файли css та js лише на згруповані та прості сторінки продуктів, не використовуйте <default>ручку макета.
Зробіть макет таким чином:

<?xml version="1.0"?>
<layout>
    <my_handle><!-- declare a custom handle so you won't duplicate the code -->
        <reference name="head">
            <action method="addJs">
                <script>vendor/qtip/jquery.qtip.min.js</script>
            </action>
            <action method="addCss">
                <stylesheet>vendor/qtip/jquery.qtip.min.css</stylesheet>
            </action>
        </reference>
    </my_handle>
    <PRODUCT_TYPE_simple><!-- layout handle for simple products -->
        <update handle="my_handle" /> <!-- include the handle you declared above -->
    </PRODUCT_TYPE_simple>
    <PRODUCT_TYPE_grouped><!-- layout handle for grouped products -->
        <update handle="my_handle" /> <!-- include the handle you declared above -->
    </PRODUCT_TYPE_grouped>
</layout>

Оскільки це ще недостатньо чітко зазначено:

Довідники

Макет XML-файлів для спеціального модуля повинен бути незалежним за темою і таким чином розміщуватися в

app/design/frontend/base/default/layout

Ви можете замінити будь-який із цих XML-файлів у вашій спеціальній темі, але в більшості випадків краще мати додатковий файл-макет, що додає зміни. Більше інформації: Який правильний спосіб / підхід до зміни шаблону Magento?

Імена файлів

Зауважте, що ці файли іноді називають "файлами layout.xml", але layout.xmlнасправді це не ім'я файлу, яке ви зазвичай знаходите в будь-якому коді Magento. Ваш код працює, якщо ви розміщуєте layout.xmlфайл у потрібному місці (див. Вище), але умовою є використання найменування нижнього регістру:

rating.xml

або краще

vendor_rating.xml

Пам'ятайте, що файли розміщення XML з усіх модулів знаходяться в одній єдиній директорії, тому ім'я повинно бути унікальним!

Ваш layout.xml має зайти всередину

додаток / дизайн / frontend / [ВАШИЙ МИТНИЙ ПАКЕТ] / [ВАША МИТНА ТЕМА] / макет /

Як зазначено вище для вашого конкретного випадку, ви не повинні використовувати його всередині <default>тегів, але, наприклад, ви можете додати файли css, які знаходяться у вашому кореневому каталозі magento / js таким чином, наприклад у вашому app/design/frontend/vendor/theme/layout/local.xml:

<?xml version="1.0"?>

<layout version="0.1.0">
    <default>
        <reference name="head">
             <action method="addItem">
                <type>js_css</type>
                <stylesheet>css/styles.css</stylesheet>
                <params>media="all"</params>
            </action>
        </reference>
    </default>
</layout>