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

آموزش المنتور وردپرس از صفر تا پیشرفته — راهنمای جامع ۱۴۰۴

اگر می‌خواهید بدون یاد گرفتن کدنویسی، یک سایت وردپرسی حرفه‌ای طراحی کنید، آموزش المنتور اولین قدمی است که باید بردارید. المنتور محبوب‌ترین افزونه صفحه‌ساز وردپرس در جهان است که با بیش از ۱۵ میلیون وب‌سایت فعال، استاندارد طراحی سایت بصری را تعریف کرده. در این راهنما، همه چیز را از نصب تا کار با المان‌های پیشرفته به شما آموزش می‌دهیم.

المنتور چیست؟

المنتور (Elementor) یک افزونه صفحه‌ساز بصری برای وردپرس است که در سال ۲۰۱۶ منتشر شد و امروز به پرکاربردترین ابزار طراحی سایت با وردپرس تبدیل شده است. این افزونه با رابط کشیدن و رها کردن (Drag & Drop) به شما امکان می‌دهد تا صفحات وب را مستقیماً روی مرورگر و به صورت زنده طراحی کنید — بدون اینکه فایلی را ذخیره کنید یا صفحه را رفرش بزنید.

پیش از وجود المنتور، طراحی سایت وردپرس نیاز به آشنایی با PHP، HTML و CSS داشت. المنتور این مرز را برداشت و طراحی حرفه‌ای را برای همه ممکن کرد.

چرا المنتور بهترین انتخاب برای طراحی سایت وردپرس است؟

المنتور به چند دلیل مشخص از رقبا متمایز است. اول اینکه ویرایشگر زنده دارد — تغییرات را همان لحظه‌ای که اعمال می‌کنید می‌بینید. دوم اینکه بیش از ۱۰۰ ویجت آماده (در نسخه پرو) ارائه می‌دهد که نیاز به هیچ افزونه اضافی را از بین می‌برد. سوم اینکه کاملاً ریسپانسیو است و می‌توانید طراحی موبایل، تبلت و دسکتاپ را به طور جداگانه کنترل کنید.

المنتور رایگان یا پرو؟ مقایسه کامل

اولین سوالی که در آموزش المنتور وردپرس باید پاسخ بدهیم اینه که کدام نسخه را نصب کنید. نسخه رایگان برای شروع کافی است، اما نسخه پرو امکانات حرفه‌ای‌تری دارد.

امکانات	المنتور رایگان	المنتور Pro
تعداد ویجت‌ها	حدود ۴۰ ویجت	بیش از ۱۰۰ ویجت
Theme Builder	ندارد	دارد
Popup Builder	ندارد	دارد
WooCommerce Builder	ندارد	دارد
قالب‌های آماده	محدود	بیش از ۳۰۰ قالب
پشتیبانی	انجمن عمومی	پشتیبانی مستقیم
قیمت	رایگان	از ۵۹ دلار در سال

اگر می‌خواهید هدر، فوتر، صفحه آرشیو یا صفحه محصول ووکامرس را با المنتور طراحی کنید، حتماً به نسخه پرو نیاز دارید.

نصب المنتور در وردپرس — گام به گام

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

نصب المنتور رایگان

وارد پیشخوان وردپرس شوید
به مسیر افزونه‌ها ← افزودن بروید
در کادر جستجو، کلمه Elementor را تایپ کنید
روی نصب و سپس فعال‌سازی کلیک کنید
مراحل راه‌اندازی اولیه را طی کنید

نصب قالب Hello Elementor

پس از نصب افزونه، توصیه می‌شود قالب Hello Elementor را نیز نصب کنید. این قالب سبک‌ترین و سازگارترین قالب وردپرس برای استفاده با المنتور است و هیچ استایل اضافی‌ای بر طراحی شما تحمیل نمی‌کند.

به مسیر نمایش ← قالب‌ها ← افزودن بروید
کلمه Hello Elementor را جستجو کنید
قالب را نصب و فعال کنید

آشنایی با رابط کاربری المنتور

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

ساختار صفحه در المنتور

هر صفحه‌ای که در المنتور می‌سازید از سه لایه تشکیل می‌شود:

سکشن (Section): بزرگ‌ترین بلوک — هر ردیف افقی در صفحه یک سکشن است
ستون (Column): هر سکشن می‌تواند یک تا شش ستون داشته باشد
ویجت (Widget): المان‌های محتوایی مثل متن، تصویر، دکمه که داخل ستون‌ها قرار می‌گیرند

تب‌های اصلی پنل المنتور

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

محتوا (Content): تنظیمات متن، تصویر و محتوای اصلی المان
استایل (Style): رنگ، فونت، سایه، حاشیه و ظاهر المان
پیشرفته (Advanced): مارجین، پدینگ، CSS سفارشی و تنظیمات ریسپانسیو

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

یادگیری ویجت‌های کلیدی، قلب آموزش المنتور است. در اینجا با مهم‌ترین المان‌ها آشنا می‌شوید:

ویجت‌های پایه‌ای

Heading: برای تیترهای H1 تا H6 با کنترل کامل استایل
Text Editor: برای نوشتن محتوای متنی با ویرایشگر کلاسیک
Image: برای درج و استایل‌دهی تصاویر
Button: برای دکمه‌های call-to-action با طرح‌های متنوع
Divider: برای ایجاد خط جداکننده بین بخش‌ها
Spacer: برای ایجاد فاصله خالی بین المان‌ها

ویجت‌های پیشرفته

Loop Grid: یکی از قدرتمندترین ویجت‌های المنتور پرو برای نمایش داینامیک محتوا. در آموزش المان Loop Grid در المنتور به طور کامل این ویجت را بررسی کرده‌ایم
Sidebar: برای نمایش سایدبار وردپرس در هر نقطه از صفحه. آموزش کامل ویجت Sidebar المنتور را مطالعه کنید
Posts: برای نمایش لیست مقالات وبلاگ
Form: برای ساخت فرم‌های تماس و ثبت‌نام (نسخه پرو)
Popup: برای طراحی پنجره‌های پاپ‌آپ (نسخه پرو)

ویجت‌های ووکامرس

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

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

وقتی اصول پایه طراحی سایت با المنتور را یاد گرفتید، تنظیمات پیشرفته زیر به شما کمک می‌کنند کیفیت طراحی‌هایتان را به سطح حرفه‌ای ببرید.

طرح‌بندی Global (سراسری)

در تنظیمات سراسری المنتور (Elementor ← تنظیمات) می‌توانید فونت پیش‌فرض، رنگ‌های اصلی سایت و عرض محتوا را برای کل سایت تعریف کنید. این کار باعث می‌شود طراحی شما یکدست و منسجم باشد.

کنترل ریسپانسیو

المنتور یک نمادگرداب ریسپانسیو دارد که در پایین صفحه ویرایشگر قرار دارد. با کلیک روی آیکون‌های دسکتاپ، تبلت و موبایل می‌توانید طراحی هر دستگاه را به طور مجزا تنظیم کنید. مثلاً فونت را در دسکتاپ ۳۶ پیکسل و در موبایل ۲۴ پیکسل بگذارید.

Motion Effects (افکت‌های حرکتی)

در تب پیشرفته هر المان، بخش Motion Effects وجود دارد که به شما امکان می‌دهد انیمیشن‌های ورودی تعریف کنید. استفاده هوشمندانه از این افکت‌ها، تجربه کاربری سایت را بهتر می‌کند — اما زیاده‌روی نکنید.

CSS سفارشی

هر المان، سکشن و ستون در المنتور یک فیلد CSS سفارشی دارد. اگر با CSS آشنا هستید، می‌توانید استایل‌هایی اعمال کنید که از طریق تنظیمات معمول المنتور ممکن نیست.

المنتور و سئو — نکاتی که باید بدانید

یکی از نگرانی‌های رایج درباره المنتور تأثیر آن بر سئو سایت است. واقعیت این است که المنتور به خودی خود نه به سئو آسیب می‌زند و نه به آن کمک می‌کند — نحوه استفاده شما تعیین‌کننده است.

مشکلات رایج سئوی المنتور و راه‌حل‌ها

کد اضافی: المنتور کدهای CSS و JS زیادی لود می‌کند. راه‌حل: قابلیت CSS بهینه‌شده المنتور را فعال کنید و از ویجت‌های غیرضروری پرهیز کنید
ساختار هدینگ: مطمئن شوید فقط یک H1 در صفحه دارید و ساختار H2/H3 منطقی است
تصاویر: همیشه alt text توصیفی برای تصاویر بنویسید
سرعت: تصاویر را بهینه کنید و از Lazy Loading استفاده کنید

برای آشنایی بیشتر با بهینه‌سازی سئو سایت وردپرسی‌تان، صفحه سئو سایت آرتا رسانه را مطالعه کنید.

نکات حرفه‌ای طراحی سایت با المنتور

این نکات را از تجربه سال‌ها کار با المنتور در پروژه‌های مختلف طراحی سایت جمع‌آوری کرده‌ایم:

از Global Widgets استفاده کنید

اگر یک ویجت را در چند صفحه استفاده می‌کنید (مثل هدر CTA یا باکس اعتماد)، آن را به عنوان Global Widget ذخیره کنید. این کار باعث می‌شود تغییر در یک مکان، همه جای سایت اعمال شود.

از قالب‌های بخشی (Section Templates) استفاده کنید

سکشن‌های طراحی‌شده را می‌توانید به عنوان قالب ذخیره کنید و در صفحات مختلف استفاده کنید. این کار سرعت طراحی شما را چند برابر می‌کند.

Flexbox Container را یاد بگیرید

المنتور در نسخه‌های جدید، Flexbox Container را معرفی کرد که جایگزین سکشن‌های قدیمی می‌شود. این روش جدید کد بهینه‌تری تولید می‌کند و انعطاف بیشتری در چیدمان دارد.

Revision History را فراموش نکنید

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

سوالات متداول درباره المنتور

المنتور رایگان است یا پولی؟

المنتور دو نسخه دارد: نسخه رایگان که از مخزن وردپرس قابل دانلود است و ویجت‌های پایه را ارائه می‌دهد، و نسخه پرو (المنتور Pro) که ویجت‌های پیشرفته‌تر، قالب‌های بیشتر و امکانات حرفه‌ای‌تری مانند Theme Builder و Popup Builder دارد.

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

خیر. المنتور یک صفحه‌ساز بصری است که با سیستم کشیدن و رها کردن (Drag & Drop) کار می‌کند. هیچ دانش HTML یا CSS پیش‌نیازی برای طراحی صفحات حرفه‌ای با المنتور نیاز ندارید، هرچند آشنایی با CSS به شما امکان شخصی‌سازی عمیق‌تر می‌دهد.

المنتور با همه قالب‌های وردپرس سازگار است؟

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

آیا المنتور سرعت سایت را کاهش می‌دهد؟

استفاده نادرست از المنتور می‌تواند سرعت سایت را کاهش دهد. برای جلوگیری از این مشکل باید از ویجت‌های غیرضروری پرهیز کنید، تصاویر را بهینه کنید و از قالب سبک مانند Hello Elementor استفاده نمایید.

تفاوت المنتور و المنتور پرو چیست؟

المنتور رایگان حدود ۴۰ ویجت پایه دارد. المنتور Pro بیش از ۱۰۰ ویجت، Theme Builder برای طراحی هدر، فوتر و آرشیو، Popup Builder، WooCommerce Builder و قالب‌های پریمیوم بیشتری ارائه می‌دهد.

آماده طراحی سایت وردپرسی حرفه‌ای هستید؟

یادگیری المنتور اولین قدم است — اما طراحی یک سایت کامل و حرفه‌ای که واقعاً برای کسب‌وکار شما کار کند نیاز به تجربه و دانش بیشتری دارد. تیم آرتا رسانه از سال ۱۳۹۱ صدها پروژه طراحی سایت وردپرسی را با موفقیت تحویل داده است. اگر می‌خواهید به جای صرف وقت برای یادگیری، یک سایت آماده و بهینه داشته باشید، همین حالا با ما تماس بگیرید.