وردپرس

آموزش المنتور صفر تا صد برای مبتدیان + پروژه عملی

راهنمای استفاده از المنتور در وردپرس برای مبتدیان

آموزش المنتور یکی از کاربردی‌ترین مهارت‌هایی هست که هر کسی برای طراحی سایت با وردپرس باید بلد باشه — مخصوصاً اگه دنبال ساخت صفحات جذاب، واکنش‌گرا و حرفه‌ای بدون کدنویسی باشی.آموزش المنتور از صفر تا صد رو همین امروز شروع کن و بدون کدنویسی، سایت حرفه‌ای خودتو بساز!
در این راهنمای جامع، نه‌تنها یاد می‌گیری المنتور چیه و چطور نصبش کنی، بلکه با کمک تصاویر مرحله‌به‌مرحله و پروژه‌های عملی مثل طراحی صفحه «درباره ما» و صفحات فروشگاهی، واقعاً وارد دنیای طراحی وب می‌شی. ما تو این مقاله قدم‌به‌قدم باهات همراهیم؛ از نصب المنتور و استفاده از ابزارک‌ها گرفته تا ساخت صفحه‌های اختصاصی، کار با قالب‌های آماده، نکات سئو، افزونه‌های مکمل و حتی رفع خطاهای رایج. اگه واقعاً می‌خوای با المنتور سایت بسازی و حرفه‌ای بشی، این مقاله دقیقاً برای تو نوشته شده . آنچه در این مقاله می خوانیم :

✨ طبق آمار WPBeginner، المنتور در حال حاضر روی بیش از ۸ میلیون سایت فعال وردپرسی نصب شده!

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

elementor

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

 طراحی حرفه‌ای وب‌سایت خود را با Elementor Pro تجربه کنید! 

آیا به دنبال ابزاری قدرتمند برای طراحی وب‌سایت بدون نیاز به کدنویسی هستید؟ افزونه Elementor Pro، صفحه‌ساز شماره یک وردپرس، همه آنچه نیاز دارید را در اختیار شما می‌گذارد!

با ما در ارتباط باش سفارشتو ثبت کن

 

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

المنتور (Elementor) یکی از محبوب‌ترین صفحه‌سازهای وردپرس است که امکان طراحی و ویرایش صفحات سایت را بدون نیاز به کدنویسی فراهم می‌کند. این ابزار با یک رابط بصری و قابلیت کشیدن و رها کردن (Drag & Drop) به شما اجازه می‌دهد بخش‌های مختلف یک صفحه را ایجاد کنید، تغییر دهید و ظاهر آن‌ها را شخصی‌سازی کنید.

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

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

چرا باید از المنتور استفاده کنیم؟

یکی از دلایل محبوبیت المنتور، ساده‌تر کردن فرایند طراحی صفحات وردپرس است. در روش‌های سنتی، ایجاد بسیاری از تغییرات ظاهری ممکن است به دانش HTML، CSS یا PHP نیاز داشته باشد؛ اما المنتور بخش قابل‌توجهی از این فرایند را از طریق یک محیط گرافیکی انجام می‌دهد.

مهم‌ترین مزایای استفاده از المنتور عبارت‌اند از:

  • طراحی بدون نیاز به کدنویسی: بسیاری از عناصر صفحه را می‌توان از طریق ویرایشگر بصری ایجاد و تنظیم کرد.

  • ویرایش Drag & Drop: افزودن و جابه‌جایی عناصر صفحه به‌سادگی انجام می‌شود.

  • پیش‌نمایش لحظه‌ای: تغییرات طراحی را می‌توانید هنگام ویرایش مشاهده کنید.

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

  • امکان شخصی‌سازی ظاهر: رنگ‌ها، فونت‌ها، فاصله‌ها، اندازه‌ها و بسیاری از ویژگی‌های ظاهری قابل تنظیم هستند.

  • کتابخانه قالب‌ها و بلوک‌های آماده: می‌توانید برای سرعت بیشتر از طرح‌های آماده استفاده کرده و آن‌ها را مطابق نیاز خود تغییر دهید.

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

  • سازگاری با اکوسیستم وردپرس: المنتور می‌تواند در کنار بسیاری از قالب‌ها و افزونه‌های وردپرسی مورد استفاده قرار گیرد.

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

با المنتور چه سایت‌هایی می‌توان ساخت؟

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

برخی از کاربردهای رایج المنتور عبارت‌اند از:

طراحی صفحه اصلی سایت

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

ساخت لندینگ پیج

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

طراحی سایت فروشگاهی

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

طراحی سایت شرکتی

شرکت‌ها می‌توانند با استفاده از المنتور صفحاتی مانند «درباره ما»، «خدمات»، «تماس با ما»، معرفی تیم و نمونه‌کارها را طراحی کنند و ساختار ظاهری سایت را متناسب با هویت برند تغییر دهند.

طراحی وبلاگ و سایت شخصی

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

ایجاد فرم و پاپ‌آپ

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

المنتور برای چه کسانی مناسب است؟

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

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

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

آیا المنتور برای سئو مناسب است؟

المنتور به‌خودی‌خود یک ابزار سئو نیست، اما استفاده صحیح از آن می‌تواند در ساختاردهی و طراحی صفحات سایت مؤثر باشد. کیفیت سئو یک سایت تنها به صفحه‌ساز وابسته نیست و عواملی مانند محتوای باکیفیت، ساختار سایت، سرعت بارگذاری، تجربه کاربری، لینک‌سازی و بهینه‌سازی فنی نیز اهمیت دارند.

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


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

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

المنتور هم طرح رایگان و هم چندین طرح غیررایگان ارائه می‌دهد. نسخه رایگان آن دارای تمام ویژگی‌هایی است که برای ایجاد یک تجربه کاربری قوی نیاز دارید، از جمله استفاده از انواع ویرایشگرها، بیش از ۳۰ قالب سفارشی و ۴۰ ویجت. برای طراحی سایت با وردپرس حرفه‌ای، نیازی به پرداخت هزینه نیست؛ فقط کافی است از یکی از بهترین قالب‌های فروشگاهی رایگان استفاده کنید.

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

همان‌طور که WPCrafter بیان کرده است:

«با المنتور پرو، پتانسیل کامل طراحی وب را بدون نوشتن حتی یک خط کد آزاد می‌کنید.»

با این ابزار، می‌توانید به راحتی و بدون نیاز به دانش برنامه‌نویسی، وب‌سایت‌های حرفه‌ای و جذاب ایجاد کنید.

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

ویژگی نسخه رایگان نسخه پرو
ویجت‌های پایه
فرم تماس
پاپ‌آپ ساز
Theme Builder
پشتیبانی

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

همان‌طور که WPCrafter بیان کرده است: «با نسخه پرو المنتور، شما به قالب‌ساز، فرم‌ساز، پاپ‌آپ و حتی اسلایدر حرفه‌ای دسترسی دارید. برای کسب‌وکارها، نسخه رایگان کافی نیست.» این نقل‌قول نشان می‌دهد که نسخه پرو برای کسب‌وکارهایی که به ابزارهای پیشرفته‌تر نیاز دارند، یک انتخاب ضروری است.

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

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

نصب افزونه از مخزن وردپرس

مرحله 1: وارد سایت Elementor.com شوید و روی دکمه Get started کلیک کنید.

سایت المنتور

مرحله 2: آدرس ایمیل و رمزعبور خود را برای ایجاد حساب کاربری وارد کنید.

مرحله 3: در مرحله بعد به چند سوال در مورد اینکه وب سایت مورد نظر برای چه کسانی است و چقدر در ساخت وب سایت تجربه دارید پاسخ دهید.

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

مرحله 5: ازآنجایی که elementor از شما می خواهد که یک سایت وردپرس فعال داشته باشید، دامنه وب سایت خود را در بررسی کننده آنها وارد کنید تا مطمئن شوید سایت شما برروی پلت فرم وردپرس است.

مرحله 6: پس از تأیید سازگاری سایت،روی دکمه Install Elementor کلیک کنید.

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

مرحله 7: اگربه صفحه ورود به سیستم مدیریت وب سایت خود هدایت شدید، ادامه دهید و وارد شوید.اگر قبلاً وارد شده اید، مستقیماً به صفحه افزونه Elementor هدایت می شوید. روی Install Now در گوشه سمت راست پایین کلیک کنید.

مرحله 8: پس از آن، به صفحه ای با پیام تأیید وارد خواهید شد. روی Activate Plugin کلیک کنید.

  • حال شما آماده استفاده از ویرایشگر صفحه Elementor هستید!

نصب المنتور از طریق داشبورد وردپرس 

وارد پیشخوان وردپرس بشو.

  1. از منوی «افزونه‌ها» > «افزودن» رو انتخاب کن.

  2. در قسمت جستجو Elementor را وارد کرده و Elementor Website Builder را پیدا کنید..

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

مرحله 3: روی Install Now کلیک کنید و پس از نصب،روی Activate کلیک کنید.

elementor

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

آموزش المنتور

نحوه استفاده از المنتور در wordpress

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

آموزش المنتور :

مرحله 1: برای شروع، یک صفحه یا پست جدید ایجاد کنید و روی Edit with Elementor کلیک کنید.

Edit with Elementor

مرحله 2: وارد ویرایشگر صفحه Elementor می شوید.صفحه شما به این صورت خواهد بود:

صفحه Elementor

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

Elementor

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

آموزش المنتور

مرحله 4: به سادگی روی یک ویجت کلیک کنید، نگه دارید و به جایی که می خواهید ماژول جدید را اضافه کنید بکشید. به عنوان مثال، هنگامی که به پایین صفحه اسکرول می کنید، این گزینه را خواهید داشت که ویجت را به یک منطقه خالی جدید بکشید.

آموزش المنتور

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

elementor

مرحله 6: روی دکمه همبرگر در گوشه سمت چپ و سپس تنظیمات سایت کلیک کنید.در این منو می توانید رنگ ها و فونت های پیش فرض را برای صفحات خود تنظیم کنید.همچنین می توانید تنظیمات جهانی را برای کل وب سایت خود درElementor پیکربندی کنید.

تنظیمات سایت

مرحله 7: در نهایت می توانید روی نماد History در پایین پنل کلیک کنید تا به بخش داخلی Revision History Elementor دسترسی پیدا کنید.در تب Action می توانید تغییرات خود را ردیابی کنید و بین هرعمل به جلو و عقب بروید.در تب Revisions،می توانید بین نسخه های خود جابه جا شده و به نسخه های قبل برگردید.

History of elementor

نصب نسخه پرو المنتور

  • وارد سایت رسمی المنتور شو

  • پکیج مناسب رو بخر

  • فایل .zip افزونه پرو رو دانلود و در وردپرس آپلود کن

  • بعد از نصب، لایسنس رو وارد کن

آموزش المنتور برای طراحی ریسپانسیو

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

برای ریسپانسیو کردن صفحه در المنتور، مراحل زیر را دنبال کنید:

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

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

  3. دستگاه موردنظر را انتخاب کنید. حالت دسکتاپ، تبلت یا موبایل را انتخاب کنید و ظاهر صفحه را در همان اندازه بررسی کنید.

  4. اندازه فونت و فاصله‌ها را تنظیم کنید. در صورت نیاز، اندازه متن، فاصله داخلی و خارجی، عرض عناصر و سایر تنظیمات ظاهری را برای هر دستگاه تغییر دهید.

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

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

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

نکته مهم در طراحی ریسپانسیو با المنتور

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

“Responsive design in Elementor helps your site look great on every device. You can hide or show elements per screen size.”

 

آیا آماده‌اید تا وب‌سایت خود را بسازید؟

 

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

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

  1. یک ردیف تک‌ستونه اضافه کن

  2. ابزارک «عنوان» رو بنداز: درباره ما

  3. ابزارک «ویرایشگر متن» بنداز و داستان برندت رو بنویس

  4. تصویر یا ویدیوی تیم رو اضافه کن

  5. از ویجت‌های شبکه‌های اجتماعی استفاده کن

با اینکار تو هم داری برندتو معرفی می‌کنی، هم حس اعتماد می‌سازی

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

  1. ردیف جدید بساز (دو ستونه)

  2. سمت چپ عکس محصول، سمت راست متن توضیحات

  3. ابزارک «لیست آیکن‌دار» برای ویژگی‌ها عالیه

  4. ابزارک «دکمه» با متن خرید یا ثبت‌نام بنداز

از WPBeginner: «المنتور بهترین ابزار برای ساخت صفحات فرود (Landing Page) در وردپرسه.»

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

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

برای استفاده از قالب‌های آماده در المنتور، مراحل زیر را دنبال کنید:

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

  2. کتابخانه قالب‌های المنتور را باز کنید. در محیط ویرایشگر، روی آیکون مربوط به کتابخانه قالب‌ها کلیک کنید تا به طرح‌های آماده دسترسی داشته باشید.

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

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

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

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

نکته مهم

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

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

1. Elementor Pro

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

  • Theme Builder (هدر/فوتر سفارشی)

  • فرم‌ساز حرفه‌ای

  • ویجت‌های فروشگاهی برای ووکامرس

  • اسلایدر، گالری، تب، پاپ‌آپ، CTA و…

 2. Essential Addons for Elementor

 بیش از 90 ویجت کاربردی مثل تایمر، نمودار، گالری خلاق، نقد و بررسی، کاروسل تیم و…

 لینک رسمی: essential-addons.com

3. Happy Addons

 ویجت‌های تعاملی جذاب مثل کشیدن به چپ و راست، جدول قیمت، نمودار، تایم‌لاین، حالت تیره و روشن

 4. ElementsKit

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

 5. Envato Elements

 کتابخانه عظیم قالب‌ها و بلاک‌های آماده با یک کلیک درج در المنتور

 6. Premium Addons for Elementor

 شامل ویجت‌های حرفه‌ای مثل جدول مقایسه، HotSpot، ویدیوی زمینه، مودال پاپ‌آپ و…

 7. Elementor Custom Skin

برای طراحی قالب‌های آرشیو، نوشته و محصولات با ظاهر اختصاصی

 8. WooLentor (برای سایت فروشگاهی)

 طراحی صفحات محصول، صفحه حساب کاربری، سبد خرید با المنتور

 9. Header, Footer & Blocks for Elementor

افزونه‌ای سبک و کاربردی برای ساخت هدر و فوتر دلخواه

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

سئو صفحات المنتور

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

  1. از افزونه‌های سئو استفاده کنید
    افزونه‌هایی مانند Rank Math و Yoast SEO برای مدیریت بخش‌هایی مانند عنوان سئو، متا دیسکریپشن، نشانی صفحات، اسکیما و سایر تنظیمات سئوی داخلی کاربرد دارند.

  2. ساختار صحیح هدینگ‌ها را رعایت کنید
    برای سازمان‌دهی محتوای صفحه از تگ‌های H1، H2 و H3 به شکل منطقی استفاده کنید. هر صفحه باید یک ساختار عنوان‌بندی واضح داشته باشد و هدینگ‌ها صرفاً برای بزرگ‌تر کردن متن استفاده نشوند.

  3. سرعت و عملکرد صفحه را جدی بگیرید
    استفاده بیش از حد از انیمیشن‌ها، ویجت‌ها، تصاویر حجیم و افزونه‌های غیرضروری می‌تواند عملکرد صفحه را تحت تأثیر قرار دهد. افزونه‌های کش و بهینه‌سازی مانند LiteSpeed Cache، در صورت سازگاری با سرور سایت، می‌توانند برای بهبود عملکرد استفاده شوند.

  4. تصاویر را قبل از انتشار بهینه کنید
    تصاویر حجیم می‌توانند زمان بارگذاری صفحه را افزایش دهند. حجم تصاویر را کاهش دهید، ابعاد مناسب انتخاب کنید و در صورت امکان از فرمت‌های مدرن مانند WebP یا AVIF استفاده کنید. ابزارها و افزونه‌هایی مانند ShortPixel نیز می‌توانند برای فشرده‌سازی و بهینه‌سازی تصاویر مورد استفاده قرار گیرند.

  5. محتوا را برای کاربر و موتور جست‌وجو بهینه کنید
    کلمه کلیدی را به‌صورت طبیعی در بخش‌هایی مانند عنوان، هدینگ‌ها، متن و در صورت نیاز متا دیسکریپشن به کار ببرید؛ اما از تکرار غیرطبیعی کلمات کلیدی خودداری کنید. محتوای مفید و پاسخ دقیق به نیاز کاربر، بخش مهمی از سئوی صفحه است.

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

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

پروژه عملی: ساخت صفحه «درباره ما» با المنتور

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

  1. یک برگه جدید ایجاد کنید
    از پیشخوان وردپرس وارد بخش «برگه‌ها» شوید و یک برگه با عنوان «درباره ما» ایجاد کنید. سپس گزینه «ویرایش با المنتور» را انتخاب کنید.

  2. ساختار صفحه را طراحی کنید
    بخش‌های مختلف صفحه را با استفاده از ابزارک‌هایی مانند Heading، Text Editor، Image، Button و Icon ایجاد کنید. می‌توانید اطلاعاتی درباره برند، تیم، سابقه فعالیت و خدمات مجموعه در این صفحه قرار دهید.

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

  4. اعتماد کاربران را افزایش دهید
    در صورت نیاز، بخش‌هایی مانند معرفی اعضای تیم، ارزش‌های برند، سوابق کاری، دستاوردها یا مزیت‌های مجموعه را اضافه کنید تا کاربر شناخت بهتری از کسب‌وکار پیدا کند.

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

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

  7. صفحه را ذخیره و منتشر کنید
    پس از بررسی نهایی محتوا، لینک‌ها، فرم تماس و نمایش ریسپانسیو، تغییرات را ذخیره کرده و صفحه «درباره ما» را منتشر کنید.

خطاهای رایج المنتور + راه‌حل

    1. تغییرات در المنتور ذخیره یا نمایش داده نمی‌شود
      راه‌حل: ابتدا کش مرورگر، افزونه کش و کش سایت یا CDN را بررسی و در صورت نیاز پاک کنید. سپس افزونه‌ها را موقتاً غیرفعال کنید تا مشخص شود تداخل افزونه‌ای باعث مشکل شده است. همچنین مطمئن شوید نسخه المنتور، وردپرس و قالب سایت به‌روز هستند.

    2. المنتور هنگام بارگذاری صفحه سفید نشان می‌دهد یا ویرایشگر باز نمی‌شود
      راه‌حل: ابتدا افزونه‌ها و قالب را از نظر تداخل بررسی کنید و منابع سرور را افزایش دهید. مقدار حافظه PHP موردنیاز به پروژه و تنظیمات هاست بستگی دارد و بهتر است طبق نیاز فعلی المنتور و محدودیت‌های هاست تنظیم شود؛ بنابراین عدد ثابتی مانند PHP 7.4 برای همه سایت‌ها توصیه نمی‌شود.

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

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

 منابع آموزش المنتور بیشتر ! (به انگلیسی ولی ارزشمنده)

 چند توصیه صادقانه برای بهتر شدن کار

  1. از نسخه نال‌شده المنتور پرو استفاده نکنید! نسخه‌های غیررسمی و دستکاری‌شده می‌توانند امنیت سایت را به خطر بیندازند و حتی باعث نفوذ، اختلال یا افشای اطلاعات کاربران شوند.
  2. قبل از تغییرات مهم، از سایت بک‌آپ بگیرید. پیش از نصب افزونه جدید، تغییر قالب یا ایجاد تغییرات اساسی در صفحات المنتور، یک نسخه پشتیبان کامل تهیه کنید تا در صورت بروز مشکل بتوانید سایت را بازیابی کنید.
  3. در طراحی، سادگی را در اولویت قرار دهید. استفاده بیش از حد از انیمیشن‌ها، رنگ‌ها و عناصر گرافیکی می‌تواند کاربر را سردرگم کند. طراحی باید در کنار زیبایی، مسیر دسترسی به اطلاعات و انجام اقدامات موردنظر را برای کاربر ساده کند.
  4. المنتور جای محتوای باکیفیت را نمی‌گیرد. حتی حرفه‌ای‌ترین طراحی هم بدون محتوای مفید و مرتبط نمی‌تواند تجربه خوبی برای کاربر ایجاد کند. ابتدا روی نیاز مخاطب و کیفیت محتوا تمرکز کنید و سپس ظاهر صفحه را متناسب با آن طراحی کنید.

جمع بندی و نتیجه گیری

صفحه ساز المنتور یکی از جدیدترین و حرفه ای ترین افزونه های حال حاضر وردپرس می باشد.قطعا استفاده از این افزونه در توسعه سایت می‌تواند به زیبایی بصری و ظاهری وب سایت شما کمک شایانی کند.پیشرفت این افزونه به حدی بوده است که می توان آن را یکه تاز افزونه های صفحه سازی وردپرس نام برد.توجه کنید که برای اینکه بتوانید حداکثر بهره را از این افزونه ببرید،نیازمند این هستید که مهارت خوبی در نحوه کار با این افزونه کسب کنید.در مقالات بعدی در مورد نحوه ساخت صفحه با المنتور به طور دقیق توضیح خواهیم داد. اگر از این آموزش لذت بردی، پیشنهاد می‌کنم حتماً سری هم به دوره طراحی سایت با وردپرس وب جامه بزن بزنی؛ چون آموزش المنتور فقط یه بخش از مسیر حرفه‌ای شدنه!

سوالات متداول

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

بله، با تمام تم هایی که از استانداردهای کدنویسی وردپرس پیروی می کنند کار می کند.

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

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

آیا المنتور برای سئو خوب است یا بد؟

اگر Elementor سایت شما را کند کند می‌تواند برای سئو مضر باشد، اما با پیروی از بهترین روش‌ها، مانند فشرده‌سازی تصاویر و محدود کردن اسکریپت بیش از حد، می‌توانید حتی با نصب Elementor یک وب‌سایت سریع داشته باشید.

آیا المنتور برای فروشگاه هم خوبه؟

بله! کاملاً با ووکامرس سازگاره و امکانات فوق‌العاده‌ای داره.

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

فقط اگه تنظیمات درست نباشه یا ویجت‌های سنگین استفاده کنی.

المنتور بهتره یا ویژوال کامپوزر؟

بی‌چون و چرا المنتور! هم رابط کاربری ساده‌تر داره، هم سرعت بهتر.

 

دیدگاهتان را بنویسید

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