سلام دوستان عزیز. در آموزش امروز مدرسه وردپرس، میخواهیم نحوه ” ساخت اسلایدر در وردپرس ” با استفاده از Owl Carousel را توضیح بدهیم.

مقدمه آموزش

آموزش ساخت اسلایدر در وردپرس توسط یکی از کاربران عزیز مدرسه وردپرس درخواست داده شده است. در این آموزش ما نحوه ساخت Post type در وردپرس ، نحوه ساخت دسته بندی جدید و نحوه ساخت شورت کد در وردپرس را آموزش خواهیم داد.

ساخت اسلایدر در وردپرس

اولین قدم برای ساخت اسلایدر در وردپرس ، ساخت post type سفارشی می باشد. برای مطالعه مقاله کامل Post type در وردپرس کلیک کنید. برای افزودن post type اسلایدر،فایل functions.php را باز کنید، به انتهای کدها رفته و کد زیر را قرار دهید:

بعد از ذخیره فایل، پنل مدیریت وردپرس خود را Refresh کنید. باید post type به نام “اسلاید ها” به منو سمت راست اضافه شده باشد:

post typeدر وردپرس

ساخت دسته بندی برای post type

قدم بعدی ساخت دسته بندی برای post type اسلاید ها می باشد. پس کد زیر را در ادامه کدهای قبلی قرار دهید:

در کد بالا با استفاده از تابع register_taxonomy و آرگومان هایی که بهش دادیم، یک دسته بندی به Post type اسلاید ها اضافه کردیم. حالا در ادامه یک دسته بندی ایجاد کنید و چند اسلاید جدید ثبت کنید و تصویر شاخص برای هر کدام قرار دهید. من یک دسته بندی به نام test ایجاد کردم و چهار اسلاید بهش اضافه کردم همراه با تصویر شاخص:

فراخوان فایل های مورد نیاز اسلایدر در پوسته

در این مرحله، شورت کد اسلاید ها را مینویسیم. این شورت کد 2 تا ورودی داره: 1: دسته بندی 2: تعداد اسلاید ها. اما قبل از نوشتن شورت کد باید فایل های Owl Carousel را دانلود کنیم. برای دانلود هم می توانید وارد سایت Owl Carousel  شوید و یا این فایل را دانلود کنید.

بعد از دانلود، فایل css و js را در جای مناسبی در پوسته خود قرار دهید. در پوسته 2017 وردپرس، فایل css را در مسیر assets/css و فایل js را در مسیر assets/js قرار دادم. حالا باید این فایل ها را در پوسته خود فراخوان کنیم. برای این کار از تابع wp_enqueue در وردپرس استفاده می کنیم. برای آشنایی بیشتر با این تابع، مقاله ” wp_enqueue در وردپرس ” را مطالعه کنید.

برای فراخوانی فایل ها در پوسته خود، کد زیر را به ادامه کدها در functions.php اضافه کنید:

فایل های مورد نیاز ما برای ساخت اسلایدر در وردپرس با استفاده از Owl Carousel هم فراخوان شدند. حالا باید شورت کد را بسازیم.

ساخت شورت کد اسلایدر در وردپرس

برای ساخت شورت کد اسلایدر در وردپرس باید در ادامه کدهای قبلی کد زیر را قرار دهیم:

در کد بالا ما یک کوئری نوشتیم که مقدار دسته بندی و تعداد اسلاید ها از آرگومان های شورت کد به دست میاد. حالا شورت کد زیر را داخل یک برگه قرار بدید:

حالا قبل از دیدن برگه، کد زیر را به فایل css خود اضافه کنید (برای زیباتر کردن اسلایدر):

و همچنین کد جی کوئری زیر را به یک فایل مناسب اضافه کنید و یا در فایل footer.php بعد از کد <?php the_footer();?> قرار دهید:

حالا برگه ای که ایجاد کردید رو باز کنید. باید اسلایدرتون چیزی شبیه به این باشه:

ویدئو آموزش ساخت اسلایدر در وردپرس به زودی تهیه در در آپارات مدرسه وردپرس و همین مقاله منتشر خواهد شد.

نکته: برای تغییر تعداد اسلاید ها و… می توانید مستندات Owl Carousel را مطالعه کنید و یا نمونه اسلاید های Owl Carousel را ببینید.

آموزش وردپرس امروز مدرسه وردپرس به پایان رسید. امیدوارم لذت برده باشید

موفق باشید

یک دیدگاه برای “آموزش ساخت اسلایدر در وردپرس

  • gholamreza
    - ۴ اردیبهشت , ۱۳۹۷

    اموزش بسیار عالی بود

دیدگاه خود را بیان کنید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

Captcha loading...