طراحی سایت، طراحی اپلیکیشن اندروید و ios، سئو و بهینه سازی سایت

userMessages.Posts.Original photo آموزش ابزارهای پایه در المنتور

آموزش ابزارهای پایه در المنتور

یکی از راه های ساده و راحت برای طراحی سایت استفاده از ابزارهای آماده و بدون نیاز به کدنویسی می باشد. در المنتور یکسری ابزارهای پایه و بسیار کاربردی وجود دارد، که باعث بهبود طراحی سایت و حتی یادگیری راحت تری برای کاربر دارد.

 

در این مقاله قصد داریم با المان های (ابزار) پایه بیشتری به شما آموزش دهیم. برای انجام این کار وارد بخش مدیریت و طبق مقاله (آشنایی با المنتور و نحوه نصب آن) المنتور را باز می کنیم. اولین ابزار پایه به اسم "دکمه" می باشد.

آموزش ایجاد ابزار دکمه در المنتور

در فایل آموزشی بالا نحوه درج دکمه بر روی میزکار را انجام دادیم. حالا به بخش تنظیمات دکمه ورود می کنیم تا تنظیمات لازم را بر روی دکمه اعمال کنیم.

تنظیمات ویرایش دکمه در المنتور

سه تب مهم در همه تنظیمات ابزار های المنتور وجود دارد، که بسته به نوع هر ابزاری از تنظیمات خاصی بر خوردار است.

✓ تب محتوا

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

متن: در این بخش شما می توانید متنی که بر روی دکمه نمایش داده می شود را بنویسید.

پیوند: می توانید در این بخش به دکمه، یک لینک متصل کنید.

چیدمان: در این قسمت نحوه چینش دکمه در صفحه را می توانید تنظیم کنید (چپ، راست، وسط، تراز بندی)

اندازه: سایز (اندازه) دکمه را از کوچک تا بزرگ می توانید انتخاب کنید.

آیکن: می توانید برای دکمه، یک آیکن در کنار متن انتخاب کنید.

فاصله بین آیکن ها: می توانید به صورت دستی فاصله آیکن با متن را زیاد و کم کرد.

✓ تب استایل

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

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

رنگ متن: به دو قسمت عادی و هاور تقسیم می شود. در قسمت عادی از رنگ های متنوعی می توان استفاده کرد. و در قسمت هاور زمانی که ماوس بر روی دکمه قرار گیرد رنگ متن دکمه تغییر می کند

نوع پس زمینه: با بکارگیری این قسمت می توان رنگ دکمه را تغییر داد یا از حالت های گرادینت (ترکیب دو رنگ) استفاده کرد .

نوع کادر دور: این قسمت یک حاشیه کادر مانندی به دور دکمه رسم می شود بسته به سلیقه طراح می توان از (یکپارچه، دوبل، نقطه ای، و...) استفاده کرد.

انحنای مرز: در این قسمت به گوشه های دکمه حالت پخ (انحنا) می دهد.

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

فاصله داخلی: با وارد کردن اعداد در این بخش، فاصله داخلی ایجاد می شود.

✓ تب پیشرفته

در این قسمت می توانید از حالت های حاشیه های خارجی و فاصله داخلی از (چپ، راست، بالا و پایین) استفاده کنید، و از حالت های افکت (متحرک)، پس زمینه ، حاشیه کادر دور، یا css سفارشی می توانید استفاده کنید.

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

آموزش درج ابزار جداکننده در المنتور

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

تنظیمات ویرایش ابزار جداکننده

✓ تب محتوا

استایل: در این قسمت می توانید انتخاب کنید که استایل خط جداکننده به چه صورتی باشه (دوبل، نقطه ای، خط فاصله دار، فرفری، خم و..)

عرض: می توانید به صورت دستی عرض این ابزار را تغییر دهید (کم یا زیاد)

چیدمان: با انتخاب این قسمت می توانید تعیین کنید در کدام سمت از ستون قرار گیرد (وسط، چپ، راست)

افزودن المنت: با فعال سازی این قسمت می توانید انتخاب کنید وسط جداکننده متن قرار گیرد یا آیکن

✓ تب استایل

رنگ: می توانید رنگ جداکننده در این قسمت تغییر دهید.

وزن فونت: می توانید در این قسمت سایز جداکننده (از باریک تا کلفت) بودن را به صورت دستی تغییر دهید.

فاصله: در این قسمت می توانید فاصله از بالا و پایین را تغییر دهید.

✓ تب پیشرفته

در این قسمت می توانید از حالت های حاشیه های خارجی و فاصله داخلی از (چپ، راست، بالا و پایین) استفاده کنید، و از حالت های افکت (متحرک)، پس زمینه ، حاشیه کادر دور، یا css سفارشی می توانید استفاده کنید.

نوشته های مرتبط

0 دیدگاه ها


ارسال نظر

captcha