آیلین وب

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

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

elementor plugin install - آموزش ساخت و طراحی قسمت هدر وب سایت با المنتور
نصب و پیکربندی اولیه افزونه elementor

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

edit by elementor aylinweb - آموزش ساخت و طراحی قسمت هدر وب سایت با المنتور
ویرایش گردن صفحه در المنتور

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

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

page settings elementor - آموزش ساخت و طراحی قسمت هدر وب سایت با المنتور
page settings in elementor plugin

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

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

header website design - آموزش ساخت و طراحی قسمت هدر وب سایت با المنتور
طراحی و ساخت هدر وب سایت در افزونه المنتور

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

ایجاد تصویر هدر و فرم جستجو

با استفاده از بخش های تصویر و فرم جست و جو میتوانید به راحتی یک فرم زیبا همانند دوره آموزش المنتور برای خود ایجاد کرده و از آن طریق محتوای خود را به نمایش بگذارید و با ایجاد یک بخش جست وجوی جذاب امکان جست و جو را به کاربران در صفحات Landing Page خود بدهید و از آن برای طراحی بخش های بسیار جذاب خود استفاده نمایید.

بدین منظور همانند ویدئوی آموزشی از منوی سمت راست تصویر را انتخاب کرده و یک تصویر زیبا و کشیده را برای این بخش انتخاب کنید، حال بعد از آن و تنظیمات اولیه تصویر پس زمینه اقدام به ایجاد فرم جستجو کرده و از طریق آن به راحتی ویرایش های لازم مانند، گرد کردن گوشه های فرم، تغییر رنگ دکمه، تغییر اندازه و… را بر روی آن اعمال نمایید.
search form design in elementor - آموزش ساخت و طراحی قسمت هدر وب سایت با المنتور
ساخت قسمت جستجو در المنتور

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

مقالات پیشنهادی : 

 

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

ویدئوی آموزشی طراحی قسمت هدر در المنتور

23 دیدگاه دربارهٔ «آموزش ساخت و طراحی قسمت هدر وب سایت با المنتور»

  1. با سلام و عرضه خسته نباشید خدمت شما مهندس عزیز
    یعنی به این راحتی می شود طراحی کرد؟
    نیازی به علم php نیست؟

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

  2. سلام وخسته نباشید
    من وقتی سربرگ رو فعال میکنم تو قسمت منوها زیرمنوهای فهرستمو تو سایتم باز نمیکنه چرا؟

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

  3. با سلام
    چرا این پلاگین گزینه منو رو نداره برای من؟ آیا باید پولیش رو خریداری کنم؟! بعضی المان ها کلا مثل اینکه نیست

    1. سلام ممنونم
      چرا میتونید ویدئو ها رو دانلود کنید. در زیر ویدئو یک دکمه چرخ دنده هستش اون رو بزنید و دانلود رو بزنید تا ویدئو از سایت پارات دانلود بشه.

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

    1. بدون لایسنس نمیتونید از کتابخونه المنتور استفاده کنید
      توصیه من این هست که از کتابخونه استفاده نکنید چون طرح هاشون تکراری هستن و توی مقاله بیش از 1500 تا دموی آماده قرار دادم میتونید از اونها استفاده کنید
      در ضمن برای تهیه لایسنس باید از سایت رسمی اقدام کنید

  5. مرسی از سایت خوبتون، یه سوال دیگه چطور میتونم از اون 1500 طرح و قالب اماده ای که گذاشتین استفاده کنم تو المنتور؟

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

    1. سلام
      این یک تابع محتوا هست که باید در قالب موجود باشه ولی گاهی اوقات چندبار رفرش کنید صفحه رو درس میشه و اگه درس نشد مطمعنا تابع the_content در قالب موجود نیست.

  7. سلام و خسنته نباشید من المنتور رو دانلود و نصب و فعال سازی کردم ولی موقع افزودن برگه ویرایش با المنتور رو میزنم این ارور رو میده لطفا راهنمایی کنید ممنون میشم.
    به منظور عملکرد صحیح المنتور میبایست تابع the_cnotent را در برگه پوشه فراخوانی کنید.
    مشکل از چیه به زبان ساده توضیح بدبد ممنون میشم.

    1. سلام
      این یک تابع محتوا هست که باید در قالب موجود باشه ولی گاهی اوقات چندبار رفرش کنید صفحه رو درس میشه و اگه درس نشد مطمعنا تابع the_content در قالب موجود نیست.

  8. هستی مزینانی

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

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

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

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

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

پیشنهاد میکنیم این مقالات را هم بخوانید
آموزش انتخاب بهترین کلمات کلیدی (Keywords) برای محتوا + فیلم آموزشی

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

آموزش انتخاب بهترین کلمات کلیدی برای سایت و محتوا، موضوع این جلسه

هاست ویندوز و هاست لینوکس : کدوم رو انتخاب کنم؟

هاست ویندوز و هاست لینوکس

قبل از راه اندازی و ساخت سایت با وردپرس  باید حتما قبلش

آموزش ساخت مگامنو در المنتور (رایگان) + 📽فیلم آموزشی

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

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

کپی کردن صفحات المنتور به صورت کامل از یک سایت به سایت دیگر + (فیلم آموزشی)

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

شاید برای خیلی از شماها پیش اومده که توی طراحی صفحات با

مطالب داغ
اسکرول به بالا