دکمه، یک ویژگی بسیار مهم برای هر نوع وبسایتی است. می توانید از دکمه برای اهداف متنوعی استفاده کنید. از فراخوانی مشتریان گرفته تا اقدام به ساخت بنر، همیشه جایگاهی برای دکمه وجود دارد. بطور معمول، شما می توانید دو ویژگی، یعنی متن و آیکون را در یک دکمه قرار دهید. ویرایشگر المنتور دارای ابزارک پیش فرض دکمه است که می‌ت وانید از آن برای افزودن دکمه در وبسایت خود استفاده کنید.
آیکون و متن در یک دکمه به صورت افقی نمایش داده می شوند. اما گاهی اوقات ممکن است نیاز داشته باشید محتوا را به صورت عمودی نمایش دهید یا نیاز به خط شکست خط در دکمه داشته باشید. افزودن شکست خط در متن دکمه یک کار پیچیده نیست. شما می توانید از تگ <br> برای افزودن خط شکسته در متن استفاده کنید. در این مقاله، به شما آموزش خواهیم داد که چگونه به ساده ترین روش ممکن یک شکست خط در متن دکمه با استفاده از ویرایشگر المنتور ایجاد کنید.
نکته : برای خرید افزونه المنتور پرو اینجا کلیک کنید.
نحوه ی ایجاد شکست خط در متن دکمه با استفاده از ویرایشگر المنتور
ابتدا، صفحه ای با ویرایشگر المنتور باز کنید. سپس روی ابزارک دکمه کلیک کنید تا پنل ویرایش ظاهر شود. در ویرایشگر متن، بین متن دکمه، نیاز به استفاده از تگ <br> دارید.
در این روش، مشکل این است که شما کنترلی بر روی متن های جداگانه دکمه ندارید. وقتی کاری را بر روی متن دکمه اعمال می کنید، این کار برای هر دو متن اعمال می شود. اگر می خواهید بر روی هر دو متن تغییرات متفاوتی اعمال کنید، نیاز به استفاده از CSS سفارشی دارید. در اینجا باید کد زیر را در قسمت متن دکمه اضافه کنید.
<span class=“top-small-text”>Inline</span> <br> Button
به جای شکست خط متن خود اضافه کنید و به قسمت پیشرفته بروید. حالا فیلد CSS سفارشی را باز کنید و کد زیر را در آنجا قرار دهید.
selector .elementor-button-icon{
font-size: 58px;
}
selector .top-small-text{
font-size: 16px;
color: #ffffff;
}
در این کد CSS، شما می توانید اندازه یا رنگ فونت را مطابق با نیاز خود تغییر دهید. اگر می خواهید اندازه دکمه را تنظیم کنید، روی قسمت ویرایش تایپوگرافی واقع در استایل کلیک کنید و سپس اندازه متن را تنظیم کنید.
همچنین برای تنظیمات دکمه ، گزینه های ویرایش متنوعی نیز وجود دارد. وقتی تغییراتتان انجام شد، بر روی دکمه “به‌روزرسانی” یا “انتشار” کلیک کنید تا تغییرات ذخیره شود.
