آموزش استفاده از المنتور

آموزش استفاده از المنتور

افزونه المنتور یکی از بهترین Page Builder های وردپرس است. با استفاده از این افزونه میتوان بدون دانش برنامه نویسی (Frontend) صفحه های زیبا و خیره کننده ایجاد نمود. استفاده از افزونه المنتور با قالب آسترا ترکیب فوق العاده است که با آن میتوان هر سایتی را با ظاهری خیره کننده ایجاد نمود. در این مقاله به آموزش استفاده از المنتور برای ایجاد Section خواهیم پرداخت در ادامه همراه با نووا بلاگ باشید.

نصب افزونه المنتور

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

آموزش استفاده از المنتور

ویرایش صفحه اصلی با المنتور

بعد از نصب و فعال سازی افزونه المنتور نوبت به ویرایش صفحه اصلی سایت میرسد. برای این منظور ابتدا وارد صفحه اصلی سایت شوید و روی گزینه ویرایش برگه کلیک کنید.

پس از ورود به ویرایشگر پیشفرض وردپرس (Gutenberg Editor) روی گزینه ویرایش با المنتور کلیک کرده تا وارد محیط صفحه ساز المنتور شوید.

چند نکته قبل از شروع:

  1. باید در نظر داشته باشید افزونه المنتور شامل عناصری است که باید از آنها برای ایجاد صفحه سایت خود استفاده کنید. مثل عنصر تیر – ویرایشگر متن – دکمه – آیکون – جدا کننده و …
  2. قبل از استفاده از عناصر المنتور باید جایگاه آنها را در بخش محتوای سایت ایجاد کنید. (به این جایگاه Section میگویند) ابعاد و موقعیت Section به صورت کامل قابل ویرایش و شخصی سازی است.
  3. المنتور در دو نسخه رایگان و غیر رایگان ارائه میشود از اینرو برخی از عناصر کاربردی و زیبای آن فقط در نسخه غیر رایگان ارائه میشوند. مثل عناصر مطالب – نمونه کارها – گالری – اسلایدر – فرم تماس و …

تنظیم فونت اصلی المنتور

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

از منوی باز شده وارد گزینه تنظیمات سایت شده و سپس وارد منوی فونت های سراسری شوید با کلیک بر روی آیکون ویرایش گزینه های (آیکون مداد) اولیه، رنگ دوم، متن، شدت، Font Family این موارد را روی پیشفرض تنظیم کنید.

آموزش استفاده از المنتور
آموزش استفاده از المنتور

بعد از پیشفرض نمودن Font Family موارد مذکور، باید فونت جایگزین پیشفرض را تغییر دهید. برای این منظور کافیست نام فونت فارسی نصب شده در سایت را مشخص کنید.

مثلا به شخصه برای پروژه های خود از فونت های iransans و یا iranyekan استفاده میکنم پس در کادر فونت جایگزین پیشفرض باید کلمه iransans و یا iranyekan را وارد کنم.

نکته: توجه کنید برای پیدا کردن نام فونت فارسی نصب شده روی قالب باید به فایل استایل (Style.css) قالب مراجعه کرده و بدنبال کد @font-family بگردید تا نام فونت پیدا شود.

تنظیم فونت اصلی المنتور

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

اولین گام در آموزش استفاده از المنتور، افزودن Section است برای این منظور از قسمت محتوا روی آیکون قرمز رنگ بعلاوه کلیک کرده تا بتوانید یک Section برای جایگذاری عناصر المنتور اضافه کنید.

بعد از کلیک بر روی گزینه بعلاوه باید ساختار Section را مشخص کنید. همانطور که در تصویر زیر مشاهده میکنید 12 ساختار پیشفرض وجود دارد که میتوانید یکی از آنها را انتخاب کنید.

آموزش استفاده از المنتور

نکته: هر ساختاری که انتخاب کنید بعد از افزوده شدن به صورت کامل قابل شخصی سازی میباشد. مثلا اگر یک Section دو ستون انتخاب کنید بعدا میتوانید یک یا چند ستون دیگر به آن اضافه کنید یا ابعاد هر ستون را به صورت دقیق مشخص کنید.

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

شخصی سازی Section در المنتور

حال اجازه دهید شما را با منو ها و نحوه شخصی سازی هر Section آشنا کنم.

عرض محتوا: از طریق این منو میتوانید عرض محتوای Section انتخاب شده را به صورت تمام عرض و یا جعبه ای تنظیم کنید. در حالت جعبه ای محتوا در میانه صفحه قرار میگیرد و ساختار سایت زیبا و مشخص است اما در حالت تمام عرض محتوا از گوشه ترین نقطه صفحه شروع میشود. (هر دو حالت را تست کنید)

اگر عرض محتوا روی حالت جعبه ای باشد از قسمت پایین آن میتوانید اندازه عرض Section را مشخص کنید. به صورت پیشفرض این عدد 1140 پیکسل است. شما میتوانید طبق نیاز خود اندازه عرض را تغییر دهید. از 1110 تا 1400 ابعاد مناسبی هستند.

شخصی سازی Section در المنتور

فاصله بین ستون ها: اگر یک Section را با دو ستون یا بیشتر از دو ستون انتخاب کرده باشید از طریق این منو میتوانید فاصله بین هر ستون را مشخص کنید. موارد قابل انتخاب: بدون فاصله – باریک – باز شده – عریض – عریض تر – سفارشی

ارتفاع: اگر میخواهید ارتفاع هر Section را مشخص کنید از طریق این گزینه اقدام کنید. موارد قابل انتخاب:

  • پیشفرض: بدون ارتفاع، ارتفاع به اندازه عناصری است که به Section اضافه میشوند.
  • هم اندازه صفحه نمایش: ارتفاع Section به اندازه صفحه نمایش میشود.
  • کمترین ارتفاع: شما میتوانید ارتفاع بخش را خودتان مشخص کنید.

موقعیت ستون: اگر میخواهید عناصری که در یک ستون قرار میدهید در بالا یا پایین یا بخش میانی آن ستون قرار بگیرند باید از طریق این گزینه اقدام کنید. موارد قابل استفاده: کشیده – بالا – وسط (پیشفرض) – پایین

Overflow: برای مخفی سازی محتوای که از کادر Section خارج میشوند باید از گزینه مخفی استفاده کنید.

شخصی سازی استایل Section

از تب استایل میتوان ظاهر Section را شخصی سازی نمود مثلا رنگ پس زمینه section را مشخص کرد و یا برای پس زمینه عکس انتخاب نمود.

پس زمینه: از طریق این منو میتوانید برای زمینه Section رنگ و عکس انتخاب کنید. برای این منظور کافیست روی آیکون قلم (نمایش کلاسیک) کلیک کرده و رنگ زمینه مد نظر خود را انتخاب کنید. همچنین با کلیک بر روی بعلاوه تصویر میتوانید یک عکس به عنوان پس زمینه انتخاب کنید.

شخصی سازی استایل Section
آموزش استفاده از المنتور

رنگ گرادینت: اگر میخواهید رنگ زمینه Section از یک سو به سوی دیگر به صورت ملایم تغییر کند باید حالت Gradient را انتخاب کنید و رنگ اولیه و ثانویه را مشخص کنید. مثلا رنگ اولیه آبی کم باشد و رنگ ثانویه آبی تیره (یا هر رنگ دیگر که مد نظر شماست)

از طریق موقعیت و زوایه میتوانید زوایه شروع و نحوه تغییر رنگ را مشخص کنید. مثلا بگویید رنگ از سمت راست بالا به سمت چپ پایین از سبز به آبی تغییر کند.

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

روکش پس زمینه:

معمولا زمانیکه از یک تصویر پر رنگ و لعاب برای زمینه Section استفاده میشود محتوای (عنوان و متن) آن بخش بدرستی دیده نمیشوند از اینرو از طریق روکش پس‌زمینه میتوانید Contrast عکس استفاده شده را کنترل کنید.

از طریق گزینه شفافیت میتوانید سطح شفافیت روکش پس زمینه را مشخص کنید. (عدد 1 کدر است و پس زمینه دیده نمیشود)

افزودن حاشیه:

با استفاده از گزینه حاشیه میتوانید به دور Section حاشیه اضافه کنید مثلا فقط در قسمت پایین Section یک حاشیه دو خط اضافه کنید.

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

برای افزودن حاشیه کافیست از طریق نوع کادر دور،حاشیه مد نظر خود را انتخاب کنید سپس عرض آنرا در کادر نمایان شده مشخص کنید.

اگر روی آیکون زنجیر کلیک کنید میتوانید برای هر سمت Section یک مقدار مشخص تعیین کنید. مثلا برای قسمت پایین Section عدد دو را انتخاب کنید و برای باقی موارد عدد صفر را وارد کنید.

از طریق گزینه رنگ میتوانید رنگ حاشیه افزوده شده را تغییر دهید و از طریق گزینه گوشه های مدور به حاشیه خود هلال دهید.

افزودن جدا کننده:

با استفاده از گزینه جدا کننده در المنتور میتوانید Section های صفحه را به روشهای جذابی از یکدیگر متمایز کنید. مثلا از جدا کنند ابرها استفاده کنید و به بالای یک Section ابرهای زیبا اضافه کنید و یا به قسمت پایین Section یک خط حاشیه دار ممتد بیفزاید.

برای افزودن جدا کننده ابتدا بالا یا پایین Section را انتخاب کنید و از گزینه نوع جدا کننده مد نظر خود را انتخاب کنید. (مثل ابر) سپس رنگ جدا کننده و بعد از آن ارتفاع جدا کننده را مشخص کنید.

گزینه فلیپ جدا کننده را به صورت افقی برعکس میکند و گزینه معکوس آنرا برعکس میکند. با گزینه جلو آوردن جدا کننده روی محتوای Section قرار میگیرد.

فن چاپ

از طریق منوی فن چاپ میتوانید برای متن و عنوان های درون Section رنگ تنظیم کنید.

تا اینجا برای این بخش کافیست در مطلب بعد به تنظیمات پیشرفته Section خواهیم پرداخت.

دیدگاه‌ خود را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *