آیلین وب

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

حالت شب در المنتور چه کاربردی داره؟

حالت شب ویژگی بسیار کاربردی هست که امروزه در تمامی وب سایت ها و اپلکیشن های موبایلی قرار داده میشه و کاربر میتونه فعال یا غیرفعالش کنه، اگر به طور مثال شما تلگرام رو در نظر بگیرید می بینید که حالت شب و روز داره که میتونید با یک کلیک فعالش کند و به طوری که ظاهر سایت رنگش عوض میشه و چشم کاربر رو با رنگ های شفاف اذیت نمیکنه.

nightmode elementor - آموزش ساخت حالت شب در المنتور + فیلم آموزشی اختصاصی
ساخت بخش دکمه شب و روز در وردپرس

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

ساخت حالت شب و روز در المنتور

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

افزونه های مورد نیاز :

هر دوی افزونه های بالا رایگان می باشند.

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

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

مرحله دوم: نصب افزونه WP Night Mode

در این مرحله باید افزونه دومی رو نصب کنید که افزونه WP Night Mode هستش و همانند افزونه های دیگه میتونید براحتی از مخزن وردپرس نصب و فعالش بکنید، برای نصب افزونه در وردپرس حتما از مقاله و ویدئوی آموزشی (آموزش نصب افزونه در وردپرس) استفاده کنید.

مرحله سول: تنظیمات افزونه

وقتی شما افزونه های بالا رو نصب و فعال کردید باید تنظیمات افزونه رو انجام بدید، برای این کار به مسیر “نمایش » سفارشی سازی” بروید.

night mode aylinweb - آموزش ساخت حالت شب در المنتور + فیلم آموزشی اختصاصی
تنظیمات night mode در المنتور

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

night mode elementor - آموزش ساخت حالت شب در المنتور + فیلم آموزشی اختصاصی
حالت شب و روز در افزونه المنتور

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

  • Night Mode As Default : اگر تیک این گزینه رو بزارید، حالت شب و این تنظیمات به صورت پیشفرض روی سایت اعمال میشه و سایت در حالت پیشفرض در حالت شب نمایش داده میشه.
  • Toggle Style : در این قسمت می توانید استایل مربوط به دکمه تغییر حالت به شب رو انتخاب کنید، این گزینه شامل 5 استایل پشفرض هست و میتوانید از این 5 استایل استفاده کنید.
  • Toggle Size : در این بخش هم میتوانید اندازه دکمه تغییر حالت به شب رو تنظیم کنید. یعنی اندازه دکمه
  • Body Background : در این بخش میتوانید رنگ بنده سایت و قالب رو نتخاب کنید، این برای حالتی هست که شما حالت شب رو انتخاب میکنید.
  • Text Color : این هم رنگ متون هستش و میتوانید یک رنگ دلخواه انتخاب کنید.
  • Link Color : رنگ لینک ها رو میتوند انتخاب کنید.
  • Link Hover Color : در این بخش هم رنگ لینک ها در حالت هاوور موس رو میتوند انتخاب کنید.

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

مرحله چهارم : نمایش دکمه حالت شب و روز در المنتور

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

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

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

shortcode elementor - آموزش ساخت حالت شب در المنتور + فیلم آموزشی اختصاصی
شورت کد در المنتور

بعد از این که ابزارک شورت کد رو به بخش مورد نظر کشیدید و قرار دادید باید شورتکد افزونه Night Mode رو توی این بخش قرار بدید.

  • [wp-night-mode-button] : شورت کد نمایش دکمه با استایل پیشفرضی که شما در تنظیمات افزونه انتخاب کردید.
  • [wp-night-mode-button style="4"] : شورتکد مربوط نمایش دکمه با استایل هایی که شما انتخاب میکنید. در کنار Style یک عدد قرار دارد که این اعداد نشان دهنده استایل مورد نظر دکمه هستش که میتوانید از 1 تا 5 قرار بدید.

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

insert shortcode elementor - آموزش ساخت حالت شب در المنتور + فیلم آموزشی اختصاصی
قرار دادن شورتکد در افزونه المنتور

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

ezgif 5 290f662e83e3 - آموزش ساخت حالت شب در المنتور + فیلم آموزشی اختصاصی
آموزش ساخت حالت شب در المنتور | Night Mode

سوالی دشتید میتوانید در قسمت دیدگاه ها ثبت کنید.

فیلم آموزشی

2 دیدگاه دربارهٔ «آموزش ساخت حالت شب در المنتور + فیلم آموزشی اختصاصی»

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

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

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

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

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

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

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

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

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

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

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

دوره آموزش (🥉مبتدی) قالب فلت سام Flatsome

دوره آموزش (🥉مبتدی) قالب فلت

دوره آموزش مبتدی قالب فلت سام Flatsome دوستان گلم، تصمیم گرفتم که

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