المنتور چیست؟ معرفی افزونه المنتور Elementor

المنتور چیست؟ معرفی افزونه المنتور Elementor

جلسه 1
آموزش نصب المنتور و بررسی پیش نیازهای آن

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

جلسه 2
تنظیمات اولیه المنتور برای شروع طراحی سایت

تنظیمات اولیه المنتور برای شروع طراحی سایت

جلسه 3
آموزش نصب افزونه المنتور پرو

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

جلسه 4
اضافه کردن فونت به المنتور [افزودن فونت به المنتور]

اضافه کردن فونت به المنتور [افزودن فونت به المنتور]

جلسه 5
نصب افزونه وبکیما المنت | فارسی‌ساز المنتور

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

جلسه 6
آموزش طرح بندی و تنظیمات صفحه در المنتور

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

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

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

جلسه 8
آموزش 3 تب اصلی تنظیمات در المنتور

آموزش 3 تب اصلی تنظیمات در المنتور

جلسه 9
آموزش مفهومی تم بیلدر (پوسته ساز) المنتور

آموزش مفهومی تم بیلدر (پوسته ساز) المنتور

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

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

جلسه 11
آموزش طراحی منو موبایل در المنتور

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

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

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

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

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

جلسه 14
طراحی سکشن دوم در صفحه اصلی المنتور

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

جلسه 15
طراحی بخش خدمات ما در صفحه اصلی

طراحی بخش خدمات ما در صفحه اصلی

جلسه 16

شما در حال مشاهده
جلسه 17 هستید

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

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

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

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

جلسه 18
آموزش نمایش نظرات مشتریان در المنتور

آموزش نمایش نظرات مشتریان در المنتور

جلسه 19
آموزش نمایش لوگو مشتریان در المنتور

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

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

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

جلسه 21
طراحی بخش عضویت در خبرنامه در المنتور

طراحی بخش عضویت در خبرنامه در المنتور

جلسه 22
آموزش ریسپانسیو در المنتور (ریسپانسیو در موبایل و تبلت)

آموزش ریسپانسیو در المنتور (ریسپانسیو در موبایل و تبلت)

جلسه 23
آموزش افزودن دکمه بازگشت به بالا در المنتور

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

جلسه 24
آموزش ساخت هدر چسبان در المنتور | Sticky هدر

آموزش ساخت هدر چسبان در المنتور | Sticky هدر

جلسه 25
آموزش طراحی صفحه نوشته ها با المنتور

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

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

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

جلسه 27
آموزش ساخت صفحه 404 در المنتور

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

جلسه 28

مدرس دوره

نبی عبدی

زمان ویدیو

11:29 دقیقه

برو به دیگر جلسات

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

دانلود ویدیو

وارد شوید

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

منتشر شده در تاریخ : 5 مرداد 1401
باید لاگین کنید!

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

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

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

سکشن نمایش نمونه کارها طراحی شده در این جلسه

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

سکشن نمایش نمونه کارها طراحی شده در این جلسه

قطعه کد پس زمینه سکشن

در زیر می‌توانید قطعه کد css که برای افزودن پس زمینه گرادینت به سکشن نمونه کارها استفاده کردیم را کپی کرده و در طرح خودتان استفاده کنید.

selector{
    background: linear-gradient(249.46deg, #FFEBD8 5.04%, #FFD9EB 56.39%, #FFD8D0 103.64%);
}

قطعه کد تنظیم عنوان در یک خط

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

selector h3 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

جمع بندی

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

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

5/5 - (3 امتیاز)

دیدگاه و پرسش

  1. lyklhr581 میگوید:

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

      • lyklhr میگوید:

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

      • پشتیبانی میگوید:

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

      • lyklhr میگوید:

        ممنون از راهنمایی شما
        تشکر

  2. pooneh میگوید:

    سلام وقت بخیر
    چطوری میتونم تنظیمات خلاصه مقالات درست کنم؟
    تعداد کلمات از تنطیمات المنتور کم یا زیاد می کنم تاثیری توی تعداد کلمات نمایشی نداره

    • پشتیبانی میگوید:

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

  3. آرمان میگوید:

    وقتی توی المنتور کد css رنگ گرادینت رو میزنم اعمال میشه توی المنتور ولی توی سایت اصلی اصلا اعمال نمیشه
    مشکل چیه؟

    • پشتیبانی میگوید:

      کش مرورگر خود را پاک کنید.

  4. فائزه میگوید:

    سلام.ممنون از اموزش های خوبتون.اگه میشه دوره های المنتور پیشرفته تر(مثلاسری جت ) رو هم بزارید.

  5. سارا میگوید:

    جالب بود تیتر 1 خط شد
    چکیده رو چطور ب N خط محدود کنیم؟

    • پشتیبانی میگوید:

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

  6. harethgh میگوید:

    با سلام و احترام استاد عزیز و گرامی تا این جای دوره و دوره جدید منتشر شده در یوتوب هر چقدر از شما تشکر کنم جبران نمی کنه ممنون.

    • پشتیبانی میگوید:

      درود بر شما، ممنون از اینکه همراه آکادمی وبکیما هستید.

  7. fatemeh میگوید:

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

  8. آرین نصیری راد میگوید:

    سلام ی سایت برای دانلود عکس و رسانه های SVG معرفی میکنید؟
    و اینکه چطوری ایکون های SVGرا با روشی که گفتید دانلود کنیم
    در کدام بخش گفتید؟

  9. آرین نصیری راد میگوید:

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

    • پشتیبانی میگوید:

      درود، اگر می‌توانید گرادیانت مورد نظر خود را با خود المنتور پیاده کنید، خیر نیازی به کد ندارید.

  10. noghre میگوید:

    سلام من هرچی تو Custom Css تایپ میکنم هیچی نوشته نمیشه میشه بگید چیکار کنم؟
    سپاسگزارم

    • پشتیبانی میگوید:

      سلام، احتمالا به درستی بخش Custom CSS را انتخاب نمی کنید، چند بار صفحه را رفرش کرده و مجددا تست کنید.

  11. پریسا میگوید:

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

    • پشتیبانی میگوید:

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

  12. mohsen میگوید:

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

    • پشتیبانی میگوید:

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

آموزش‌های ویدیویی جدید یوتیوب رو از دست ندی!

بزن بریــم!