Blok için bir layout.xml modülü kullanarak <head> öğesine CSS ve JS ekleme


9

özet

Gruplandırılmış ürün görünümüme ve basit ürün görünümüme bir blok eklemek istiyorum. Bu blok, vurgulu durumlar için bazı güzel ipuçları olacak, bir jquery eklentisi ve bir css stil sayfası ile küçük bir kütüphane kullanıyorum.

Bu iki kaynağı sadece bu sayfalara macentaya eklemek istiyorum.

notlar

  • Özel bir tema çalıştırıyorum;
  • Önbellek devre dışıdır ; ve
  • Dosyalarım /jsdizinin içinde ;

Şimdiye kadar…

Yine de modülümde kullanmanın bir yolu olduğunu biliyordum layout.xml, ilk başta bu işe yaramadı, belki de config.xmlMagento'ya mizanpaj gereksinimlerimi anlatmak için ek yapılandırmaya ihtiyacım olduğunu düşündüm - bu da işe yaramadı.

By işe yaramadı , benim varlıklar dolu olmadıkları ne demek istiyorum.

Lütfen ekteki kaynağı aşağıda bulabilirsiniz.


Uygulamanın / kod / yerel / Satıcı / Değerlendirme / 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>

Uygulamanın / kod / yerel / Satıcı / Değerlendirme / etc / Config.xml

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

    ...

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

    ...

</config>

Yanıtlar:


17

İlk olarak, düzen dosyanız yerleştirilmelidir app/design/frontend/{interface}/{theme}/layout/.
İkinci. Css ve js dosyalarını yalnızca gruplandırılmış ve basit ürün sayfalarına eklemek istiyorsanız, <default>mizanpaj tutamacını kullanmayın .
Düzeninizi aşağıdaki gibi yapın:

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

Çok teşekkür ederim, bu çok mantıklı. Benim config.xmldüzeni xml dosyasının adını tanımladığından beri bu istediğim her şeyi çağırabilirim?
ash

@Takingsides. Evet. İsim ne istersen olabilir.
Marius

4

Bu henüz yeterince açık bir şekilde belirtilmediğinden:

Dizinler

Özel bir modülün düzen XML dosyaları temadan bağımsız olmalı ve böylece

app/design/frontend/base/default/layout

Özel temanızdaki bu XML dosyalarından herhangi birini geçersiz kılabilirsiniz, ancak çoğu durumda, değişiklik ekleyen temaya özgü ek bir düzen dosyasına sahip olmak daha iyidir . Daha fazla bilgi: Magento şablonunu değiştirmenin doğru yolu / yaklaşımı nedir?

Dosya adları

Bu dosyalar bazen "layout.xml dosyaları" olarak anılır, ancak layout.xmlaslında herhangi bir Magento kodunda bulacağınız bir dosya adı değildir. Dosyanızı layout.xmldoğru konuma yerleştirirseniz (yukarıya bakın) kodunuz çalışır , ancak kural küçük harf modülü adını kullanmaktır:

rating.xml

ya da daha iyisi

vendor_rating.xml

Tüm modüllerdeki düzen XML dosyalarının tek bir dizinde bulunduğunu unutmayın, bu nedenle ad benzersiz olmalıdır!


1

Layout.xml dosyanız içeri girmeli

app / design / frontend / [ÖZEL PAKETİNİZ] / [ÖZEL TEMANIZ] / düzen /


0

Özel durumunuz için yukarıda belirtildiği gibi, <default>etiketleri içinde kullanmamalısınız, ancak örneğin, amaçlar için kök magento / js dizininizde bulunan css dosyalarını örneğin şu şekilde ekleyebilirsiniz 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>
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.