به دنبال راهی برای تغییر آیکون پخش ویدیو در المنتور هستید؟ المنتور از ابزارک ویدئو پشتیبانی می کند که یک راه عالی برای اضافه کردن ویدئو ها به وبسایت شما است. ابزارک ویدئو المنتور به اندازه ای قابل تنظیم و قدرتمند است که می توانید بر روی آن تنظیمات سفارشی بسیاری اعمال کنید. برای ویدئو های یوتیوب، می توانید باند های آن را حذف کنید، همچنین می توانید از تاخیر بارگذاری تنبل و نمایش تصویر روی ویدئو استفاده کنید.
همچنین از نمایش باز و کد های (CSS) نیز استفاده کنید. با تمام قابلیت های عالی که وجود دارد، یک نقطه منفی وجود دارد و آن این است که نمی توانید آیکون پخش ویدئو را تغییر دهید. می توانید رنگ و اندازه را سفارشی کنید، اما به طور پیش فرض، شما این گزینه را برای تغییر آیکون ندارید. در این مقاله، به شما آموزش خواهیم داد تا با ساده ترین روش ممکن آیکون پخش ویدئو در المنتور تغییر دهید. (برای استفاده از این قابلیت المنتور لازم است از نسخه ی پرمیوم المنتور استفاده کنید.)
نکته : برای خرید افزونه المنتور پرو اینجا کلیک کنید.
نحوه تغییر آیکون پخش ویدیو در المنتور
برای تغییر آیکون پخش ویدئو، باید از (CSS) سفارشی استفاده کنیم. اما باید توجه داشته باشید که این ویژگی CSS سفارشی فقط در المنتور پرمیوم در دسترس است. برای شروع، صفحه ای را با ویرایشگر المنتور باز کنید که در آن ابزارک ویدئو قرار دارد. سپس از قسمت کنترل سمت چپ، روی آیکون منو کلیک کرده و به گزینه تنظیمات سایت بروید.
حالا از قسمت تنظیمات سایت، به قسمت (CSS سفارشی) رفته و کد های زیر را در آنجا اضافه کنید.
/* Elementor Video icon */
.elementor-video-icon .eicon-play {
display:none;}
.elementor-video-icon .elementor-custom-embed-play {
width: 18%;
content: url(https://domain.com/wp-content/uploads/icon-link.svg);
transition: 0.3s ease-in-out;
filter: drop-shadow(4px 5px 20px rgba(0,0,0,0.4));
}
.elementor-video-icon .elementor-custom-embed-play:hover{
width: 25%;
}
قبل از افزودن قطعه کد (CSS)، نیاز دارید تا چند گزینه را سفارشی کنید. ابتدا، باید آیکونی که می خواهید اضافه کنید را در سایت خود بارگذاری کنید. سپس در کد، باید آدرس URL محتوا را با لینک آیکونی که بارگذاری کرده اید، جایگزین کنید. آدرس URL موجود را (https://domain.com/wp-content/uploads/icon-link.svg) با لینک واقعی آیکون جایگزین کنید. پس از آن، می توانید اندازه و سایر تنظیمات را تعیین کنید. می توانید اندازه و رنگ سایه را تغییر دهید، درصد عرض و اثر هاور را تعیین کنید. وقتی که به سفارشی سازی پایان دادید، روی دکمه بروزرسانی کلیک کنید تا تغییرات ذخیره شوند.
حالا به صفحه ویرایش برگردید و روی ابزارک ویدئو کلیک کنید. ما کلاس (elementor-video-icon) را در CSS سفارشی تنظیم کرده ایم، حالا باید آن کلاس را به ابزارک ویدئو اضافه کنیم. روی ابزارک ویدئو کلیک کنید و به بخش پیشرفته (Advanced) بروید. سپس کلاس (elementor-video-icon) را در فیلد کلاس های (CSS) اضافه کنید.
این کار باعث می شود آیکونی که بارگذاری کرده اید به عنوان آیکون پخش ویدئو در ابزارک ویدئو نمایش داده شود.
