كيفية تطبيق شريط التمرير Slick على Magento

Question

أنا مبتدئ في Magento واليوم أحاول التقديم سليك سلايدر إلى موقع Magento الخاص بي كوحدة مخصصة.

لقد قمت بإنشاء وحدة نمطية فارغة تحتوي على بعض "الصدى" وHTML البسيطين وقد عملت جميعها بشكل جيد.ومع ذلك، لا أعرف ماذا أفعل بدليل Slick.هل يجب أن أضعه في الدليل الجذر لموقع الويب أو في مكان ما؟وبعد ذلك، كيف يمكنني تطبيق تلك Js وCss في وحدتي؟

يرجى تقديم بعض الإرشادات

Answer 1

لا أعرف ماذا أفعل بدليل Slick

وفقًا لأفضل ممارسات Magento، يجب عليك وضع مجلد شريط التمرير هذا أسفله skin الدليل.ومع ذلك وضع هذا تحت lib المجلد جيد أيضًا وسيعمل.لكني أوصي skin الدليل.

لذا ضع ملفات css js فيها skin\frontend\[package]\[theme]\slick_slider\*

كيف يمكنني تطبيق تلك Js وCss في وحدتي

الخطوة التالية هي تحديد ملف xml لتحديث التخطيط داخل الوحدة النمطية الخاصة بك.لهذا أضف هذا المقتطف داخل الوحدة النمطية الخاصة بك config.xml ملف.

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

استخدم الآن هذا الملف لإضافة ملفات خاصة بشريط التمرير (css وjs) إلى القسم الرئيسي

ملف : 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>

الآن قم بوضع HTML والبرنامج النصي الخاص بشريط التمرير في أي من ملفات القالب الخاصة بوحدتك.

امل ان يساعد

Answer 2

لـ js قم بإضافته إلى

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

بالنسبة لـ CSS قم بإضافة الملف إلى

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

لإضافة الملفات في رأسك module layout ملف.يمكنك إضافة ملفات CSS وJS من هذا القبيل

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