سبد خرید فروشگاه

آموزش ایجاد حاشیه گرادیانت در المنتور

آموزش ایجاد حاشیه گرادیانت در المنتور
آموزش ایجاد حاشیه گرادیانت در المنتور

فهرست مطالب آموزش ایجاد حاشیه گرادیانت در المنتور

آیا به دنبال راهی برای ایجاد حاشیه گرادیانت در المنتور هستید؟ در این مقاله، به شما آموزش خواهیم داد تا با ساده ترین روش ممکن حاشیه گرادیانت را با استفاده از ویرایشگر المنتور ایجاد کنید. با استفاده از یک حاشیه گرادیانت در صفحات وبسایت خود می توانید زیبایی وبسایت خود را افزایش دهید. همچنین، با حاشیه گرادیانت برای بخش های مختلف می توانید وبسایت خود را منحصر به فرد کنید.

هیچ ابزارکی در المنتور برای ایجاد حاشیه گرادیانت در دسترس نیست. بنابراین باید از ویژگی (CSS) سفارشی استفاده کنید، تا حاشیه گرادیانت زیبا برای بخش های وبسایت خود ایجاد کنید. می توانید این حاشیه گرادیانت را در هر نقطه از وبسایت خود اضافه کنید. می توانید حاشیه را به یک دکمه اضافه کنید یا می توانید آن را برای هر بخش خاصی اضافه کنید. بنابراین بیایید ببینیم چگونه می توانید به راحتی یک حاشیه گرادیانت ایجاد کنید. (برای استفاده از این ویژگی باید از نسخه پرمیوم المنتور استفاده کنید.)

نکته : برای خرید افزونه المنتور پرو اینجا کلیک کنید.

نحوه ایجاد حاشیه گرادیانت در المنتور

صفحه ای را که در آن می خواهید حاشیه گرادیانت را اضافه کنید، با ویرایشگر المنتور باز کنید. اکنون روی آیکون “+” کلیک کنید تا بخش اضافه شود.

افزودن بخش جدید در المنتور
افزودن بخش جدید در المنتور

اکنون باید یک ستون برای بخش خود انتخاب کنید. در اینجا ما از بخش تک ستونی استفاده می کنیم. روی ستونی که برای استفاده انتخاب کرده اید کلیک کنید.

انتخاب ستون مورد نیاز برای بخش جدید در المنتور
انتخاب ستون مورد نیاز برای بخش جدید در المنتور

اکنون باید یک ابزارک اضافه کنید، تا یک حاشیه گرادیانت روی آن ابزارک ایجاد کنید. در اینجا ما یک ابزارک متنی را اضافه می کنیم.

افزودن ابزارک سر برگ به بخش ایجاد شده در المنتور
افزودن ابزارک سر برگ به بخش ایجاد شده در المنتور

اکنون مقداری متن را در ابزارک خود اضافه می کنیم و سپس از قسمت پیشرفته (Advanced) یک حاشیه به بخش اضافه می کنیم.

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

با استفاده از قسمت استایل (Style) می توانید رنگ متن را تغییر دهید و سبکی نیز به متن اضافه کنید. حالا برای ایجاد حاشیه گرادیانت از قسمت پیشرفته (advanced) به گزینه (CSS) سفارشی بروید. حالا کد زیر را در قسمت (CSS) سفارشی اضافه کنید تا یک حاشیه گرادیانت ایجاد شود.

selector {
border-left: 1px solid #AF24D1;
border-right: 1px solid #F0C3FB;
box-sizing: border-box;
background-position: 0 0, 0 100%;
background-repeat: no-repeat;
background-size: 100% 1px;
background-image: linear-gradient(to right, #FF1685 0%, #AF24D1 100%), linear-gradient(to right, #AF24D1 0%, #FF1685 100%);
}

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

نمای کلی از حاشیه گرادیانت ایجاد شده در المنتور
نمای کلی از حاشیه گرادیانت ایجاد شده در المنتور
پیمایش به بالا

%70 تخفیف کلیه محصولات به مدت محدود

ساعت
دقیقه
ثانیه