نمایش فیلم ها به صورت رسپانسیو در وردپرس

وقتی که شما یک ویدئو را در وردپرس آپلود می کنید، این فیلم ها به طور پیش فرض واکنشگرا نیستند. با ظهور تم های وردپرس واکنشگرا، کاربرانی که با صفحه ی نمایش کوچکتر از سایت شما بازدید می کنند، ویدئویی هایی را خواهند دید که کشیده شده و نامتناسب هستند. در این مقاله، ما به شما آموزش خواهیم داد که چگونه می توان به وسیله ی FitVids فیلم های خود را در وردپرس واکنشگرا کنیم.

responsive video نمایش فیلم ها به صورت رسپانسیو در وردپرس

FitVids یک افزونه ی jQuery است که به شما اجازه می دهد تا ویدیوهای جایگزین شده ی خود را، واکنشگر کنید.
اگر می خواهید آن را در سایت وردپرس خود استفاده کنید، تنها کاری که باید انجام دهید این است که افزونه یFitVids for WordPress را نصب و فعال سازی کنید. بعد از فعال سازی، باید به نمایش » FitVids رفته و کلاس انتخاب کننده ی CSS را وارد کنید. وردپرس به آن مقاله به طور خودکار class .postاضافه می کند،

fitvids for wordpress نمایش فیلم ها به صورت رسپانسیو در وردپرس

بنابراین شما می توانید به راحتی از آن استفاده کنید. تغییرات را ذخیره کنید و پیش نمایش سایت را اجرا کنید. شما باید اندازه ی صفحه ی نمایش مرورگر را دوباره با فیلم تنظیم کنید.
اضافه کردن دستی FitVids برای واکنشگر کردن فیلم ها در وردپرس

اگر نمی خواهید برای وردپرس، افزونه ی FitVids نصب کنید، می توانید افزونه ی FitVids jQuery را به صورت دستی اضافه کنید. اولین کاری که باید انجام دهید، دانلود و extract کردن افزونه ی FitVids jQuery در کامپیوترتان است. حالا باید پوشه ی استخراج شده ی FitVids.js-master را در پوشه js تم خود آپلود کنید.
شما باید با استفاده از یک سرویس گیرنده FTP مثل Filezilla به وب سایت خود متصل شوید و فولدر تم خود را باز کنید. این امکان وجود دارد که تم وردپرس شما پوشه ی js نداشته باشد. اگر این پوشه وجود نداشت، پس باید یکی ایجاد کنید و سپس پوشه ی FitVids.js-master را از کامپیوتر خود آپلود کنید.
در داخل پوشه ی js، باید یک فایل جدید بسازید و نام آن را بگذارید FitVids.js. این فایل را ویرایش کنید و کد زیر را در آن کپی کنید.

(function($) {
$(document).ready(function(){
// Target your .container, .wrapper, .post, etc.
$(“.post”).fitVids();
});

})(jQuery);

کد بالا به FitVid ها می گوید که به دنبال کلاس انتخاب کننده ی .post CSS بگردد. حالا که FitVid ها آماده شده اند، وقت آن است که جاوا اسکریپتها به درستی در تم وردپرس خود اضافه کنید. به سادگی، کد زیر را در فایلfunctions.php تم خود کپی کنید:

wp_enqueue_script(‘fitvids’, get_template_directory_uri() . ‘/js/FitVids.js-master/jquery.fitvids.js’, array(‘jquery’), ”, TRUE);

wp_enqueue_script(‘fitvids-xtra’, get_template_directory_uri() . ‘/js/FitVids.js’, array(), ”, TRUE);

هنگامی که این را انجام دهید، کار شما انجام شده است. شما با موفقیت توانسته اید فیلم های وردپرس خود را واکنشگر کنید.

ما امیدواریم که از این مقاله مفیدی کرده باشید. برای انتقادات، پیشنهادات و سوالات، لطفا نظرات خود را در زیر با ما در میان بگذارید و هر چه سریعتر هم همیار وردپرسی شوید که به زودی خبرهای خوب و خوشحال کننده ای براتون داریم