آیا به دنبال راهی برای استفاده از CSS سفارشی در نسخه رایگان المنتور هستید؟ المنتور یکی از افزونه های محبوب با امکانات و قابلیت های زیاد است. قابلیت استفاده از CSS سفارشی یکی از این قابلیت ها است. شما می توانید در هر قسمتی از المنتور از CSS سفارشی استفاده کنید، مثلا در ابزارک، ستون، بخش و سایر قسمت ها. با استفاده از CSS سفارشی، می توانید یک طراحی تعاملی ایجاد کنید که وبسایت شما را از سایر وبسایت ها متمایز کند.
قابلیت CSS سفارشی فقط در نسخه پرو المنتور موجود است و نمی توانید از آن در نسخه رایگان المنتور استفاده کنید. اما نگران نباشید، در این مقاله به شما آموزش خواهیم داد تا به راحتی بتوانید از CSS سفارشی در نسخه رایگان المنتور استفاده کنید.
نکته : برای خرید افزونه المنتور پرو اینجا کلیک کنید.
نحوه استفاده از CSS سفارشی در نسخه رایگان المنتور
در مقالات قبلی ما در مورد چگونگی افزودن حاشیه گرادیانتی به گالری تصاویر در المنتور صحبت کردیم و برای آن مقاله از قطعه کد CSS در فیلد CSS سفارشی المنتور پرو استفاده کردیم. اکنون قصد داریم همین موارد را بدون استفاده از المنتور پرو اضافه کنیم. ما همان CSS را با استفاده از نسخه رایگان المنتور اضافه می کنیم.
selector .elementor-gallery-item
{
background-image:
linear-gradient(to left,#FFA500,#c779d0,#FFFF00,#808000);
padding: 5px 5px 5px 5px;
}
برای استفاده از این کد، باید مراحل زیر را دنبال کنید:
- CSS اضافی
- شناسه CSS المنتور
CSS اضافی در سفارشی ساز وردپرس
در مرحله اول باید کد را در فیلد CSS اضافی سفارشی وردپرس اضافه کنید. برای این کار به قسمت نمایش > سفارشی سازی > CSS اضافی بروید. سپس کد CSS را در فیلد CSS اضافی وارد کنید.
همانطور که این کد را برای افزودن حاشیه گرادیان به گالری تصاویر استفاده می کنیم، شما باید متن انتخاب کننده را از کد CSS حذف کنید و یک شناسه CSS یکتا اضافه کنید. در اینجا ما شناسه CSS را به عنوان (#gradientborder) اضافه می کنیم.
وقتی ویرایش را به پایان رساندید، بر روی دکمه انتشار (Publish) کلیک کنید تا تغییرات ذخیره شوند.
افزودن شناسه CSS المنتور
حالا در مرحله دوم، باید شناسه کلاس را برای فراخوانی کد CSS که در قسمت CSS اضافی سفارشی وردپرس اعمال کرده اید، اضافه کنید. صفحه را با افزونه ی المنتور باز کنید و ابزارک گالری را اضافه کنید. تصاویر خود را درج کرده و آن را به طوری که نیاز دارید طراحی کنید. حالا به قسمت پیشرفته بروید و سپس در فیلد شناسه CSS ، شناسه CSS را که در قسمت CSS اضافی سفارشی اضافه کرده بودید، وارد کنید. در زمانی که شناسه CSS را اضافه می کنید، ویژگی هایی که اضافه کرده بودید را خواهید داشت.
با انتشار تغییرات، بر روی دکمه انتشار (Publish)کلیک کنید تا تغییرات ذخیره شوند. اگر می خواهید یک گالری تصویر دیگر با حاشیه گرادیانت متفاوت اضافه کنید، باید همین فرآیند را دوباره تکرار کنید. به قسمت سفارشی سازی > اضافی CSS بروید و همان کد را اضافه کنید، اما در اینجا می توانید مقدار رنگ را تغییر دهید و مطمئن شوید که یک شناسه CSS متفاوت را هم اضافه کرده اید.سپس، در المنتور، می توانید از شناسه CSS استفاده کنید تا کدی که در فیلد اضافی CSS وارد کرده اید را بازیابی کنید.
