So wenden Sie den Slick-Slider auf Magento an

Question

Ich bin ein Magento-Neuling und versuche mich heute zu bewerben Slick-Slider als benutzerdefiniertes Modul auf meiner Magento-Website verfügbar.

Ich habe ein leeres Modul mit etwas einfachem „Echo“ und HTML erstellt und alles hat gut funktioniert.Allerdings weiß ich nicht, was ich mit dem Slick-Verzeichnis machen soll.Soll ich es im Stammverzeichnis der Website oder irgendwo ablegen?Und wie kann ich diese Js und CSS danach in mein Modul anwenden?

Bitte geben Sie eine Anleitung

Answer 1

Ich weiß nicht, was ich mit dem Slick-Verzeichnis machen soll

Gemäß den Best Practices von Magento sollten Sie diesen Slider-Ordner darunter ablegen skin Verzeichnis.Allerdings unterstellen Sie dies lib Ordner ist auch in Ordnung und wird funktionieren.Aber ich empfehle skin Verzeichnis.

Fügen Sie also Ihre CSS-JS-Dateien ein skin\frontend\[package]\[theme]\slick_slider\*

Wie kann ich diese Js und CSS in mein Modul anwenden?

Der nächste Schritt besteht darin, die XML-Datei für die Layoutaktualisierung in Ihrem Modul zu definieren.Fügen Sie dazu dieses Snippet in Ihr Modul ein config.xml Datei.

<config>
    <frontend>
        <layout>
            <updates>
                <{namespace_module}>
                    <file>{namespace_module}.xml</file>
                </{namespace_module}>
            </updates>
        </layout>
    </frontend>
</config>

Verwenden Sie nun diese Datei, um Slider-spezifische Dateien (CSS und JS) zum Head-Bereich hinzuzufügen

Datei : app\design\frontend\[package]\[theme]\layout\{namespace_module.xml}

<layout>
    <{layout_update_handle_you_need}>
        <reference name="head">
            <action method="addItem">
                <type>skin_css</type>
                <item>slick_slider/slick.css</item>
            </action>
            <action method="addItem">
                <type>skin_css</type>
                <item>slick_slider/slick-theme.css</item>
            </action>
            <!-- add jquery if not present -->
            <action method="addItem">
                <type>skin_js</type>
                <item>slick_slider/slick.min.js.css</item>
            </action>
        </reference>
    </{layout_update_handle_you_need}>
</layout>

Fügen Sie nun HTML und Skript speziell für den Schieberegler in eine der Vorlagendateien Ihres Moduls ein.

Ich hoffe, das hilft

Answer 2

für die js füge es hinzu

base/js/modulename/   //put you js file here

für CSS Datei hinzufügen in

base/skin/frontend/default Or Base/default/css/modulename/  //put css file here

zum Hinzufügen von Dateien im Kopf in Ihnen module layout Datei.Sie können solche CSS- und JS-Dateien hinzufügen

<?xml version="1.0"?>
<layout version="0.1.0">
    <default>
      <reference name="head">
        <action method="addCss"><stylesheet>css/modulename/style.css</stylesheet></action>

        <action method="addJs"><script>modulename/search.js</script></action>

      </reference>
</default>
</layout>