Sinopse

Gostaria de adicionar um bloco à minha visão de produto agrupada e à minha visão de produto simples. Este bloco terá algumas dicas de ferramentas para estados de foco, eu estou usando uma pequena biblioteca com um plugin jquery e uma folha de estilo css.

Desejo incluir esses dois recursos no magento apenas nessas páginas.

Notas

• Estou executando um tema personalizado;
• O cache está desativado ; e
• Meus arquivos estão dentro do /jsdiretório;

Até agora…

No entanto, eu sabia que uma maneira era usar layout.xmlno meu módulo, no começo isso não funcionou, então pensei que talvez precisasse de configuração adicional dentro do meu config.xmlpara informar ao Magento sobre meus requisitos de layout - isso também não funcionou.

Por não funcionar, o que quero dizer é que meus ativos não foram carregados.

Por favor, encontre a fonte anexada abaixo.

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 / etc / config.xml

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

    ...

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

    ...

</config>

Primeiro, seu arquivo de layout deve ser inserido app/design/frontend/{interface}/{theme}/layout/.
Segundo. Se você deseja adicionar os arquivos css e js apenas nas páginas agrupadas e simples do produto, não use a <default>alça de layout.
Faça com que seu layout fique assim:

<?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>

Como isso ainda não foi suficientemente claro:

Diretórios

Os arquivos XML de layout para um módulo personalizado devem ser independentes de tema e, portanto, colocados em

app/design/frontend/base/default/layout

Você pode substituir qualquer um desses arquivos XML em seu tema personalizado, mas na maioria dos casos, é melhor ter um arquivo de layout específico para um tema adicional que adicione alterações. Mais informações: Qual é a maneira / abordagem correta de modificar um modelo Magento?

Nomes de arquivo

Observe que esses arquivos às vezes são chamados de "arquivos layout.xml", mas layout.xmlna verdade não é um nome de arquivo que você normalmente encontraria em qualquer código Magento. Seu código funcionará se você colocar o layout.xmlarquivo no local correto (veja acima), mas a convenção é usar o nome do módulo em letras minúsculas:

rating.xml

ou melhor

vendor_rating.xml

Lembre-se de que os arquivos XML de layout de todos os módulos estão em um único diretório, portanto, o nome deve ser exclusivo!

Seu layout.xml deve entrar

app / design / frontend / [SEU PACOTE PERSONALIZADO] / [SEU TEMA PERSONALIZADO] / layout /

Como indicado acima para o seu caso particular, você não deve usá-lo dentro de <default>tags, mas, por exemplo, você pode adicionar arquivos css que residem no diretório raiz do magento / js desta maneira no seu app/design/frontend/vendor/theme/layout/local.xmlexemplo:

<?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>