جستجو برای:
سبد خرید 0
  • حساب کاربری (پنل کاربری)
  • ورود / عضویت
  • محصولات حرفه ای
  • مطالب آموزشی رایگان
  • آموزش وردپرس (رایگان)
  • آموزش ووکامرس (رایگان)
  • استخدام
  • مشاوره کسب و کار اینترنتی
  • تبلیغات در شهر وردپرس
  • قوانین و مقررات
 

ورود

رمز عبور را فراموش کرده اید؟

هنوز عضو نشده اید؟ عضویت در سایت
شهر وردپرس

شهر وردپرس

  • آموزش وردپرس
  • آموزش کسب و کار اینترنتی
    • وبینار
  • مطالب رایگان
  • درباره ما
    • تماس با ما
    • قوانین و مقررات
    • ثبت شکایات و انتقادات
  • مشاوره
  • سفارش تولید محتوا
Smiley face
جستجو برای:
0
ورود / عضویت
شهر وردپرس > وبلاگ > آموزش افزونه های وردپرس > چگونه دارک مود (dark mode) را به وبسایت اضافه کنیم؟
جستجو برای:

چگونه دارک مود (dark mode) را به وبسایت اضافه کنیم؟

مدت زمان مطالعه و یادگیری: 4 دقیقه
دارک مود

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

در این مقاله به شما آموزش می‌دهیم که به راحتی این قابلیت را هم برای قسمت فرات اند (frotend) سایت (قسمتی که کاربران به ان دسترسی دارند) و هم برای  بخش ادمین سایت اضافه کنید.

حالت تیره چیست و چرا باید این قابلیت را فعال کرد؟

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

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

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

علاوه بر این، با استفاده از کامپیوتر می‌توانید وب‌سایت‌ها را از طریق مرورگر کروم در وضعیت مود تیره مشاهده کنید و به وبگردی بپردازید. برای این کار نیاز به افزونه Night Eye دارید؛ با استفاده از این افزونه سایت‌ها اینگونه به نظر می‌رسند:

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

سایت‌های عمومی مانند یوتیوب هم حالت رنگ تیره را در تنظیمات خود دارد و این امکان را به کاربران می‌دهد تا برای تماشای ویدئو در هنگام شب تجربه راحت‌تری داشته باشند.

قابلیت دارک مود در یوتیوب

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

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

چگونگی فعال کردن دارک مود برای کاربران سایت وردپرسی

اول از همه نیاز است پلاگین وردپرسی دارک مود را از این آدرس اجرا و فعال نمایید:

https://wordpress.org/plugins/wp-dark-mode/

بالای قسمت Activation به قسمت Settings> WP Dark mode  در قسمت ادمین وردپرس بروید و بر روی تب General settings کلیک کنید.

اینجا، تنظیمات “enable os aware dark mode” در حالت روشن قرار دارد. این یعنی کاربران به صورت خودکار و هر زمان که تمایل داشتند می‌توانند گوشی یا کامپیوتر خودشان را در حالت مود تیره قرار دهند و سایت شما را در این حالت مشاهده ‌کنند.

تنظیمات “show floating switch” نیز روشن شده است. این یعنی کاربر هر موقع می‌تواند به دارک مود سوییچ کند؛ حتی اگر دیوایس او قابلیت دارک مود را نداشته باشد.

فعال کردن دارک مود در وردپرس

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

حالت تیره در وردپرس

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

دارک مود در وردپرس

به عنوان مثال، با کلیک بر روی Display settings می‌توانید شکل و شمایل کلید اصلی مود مشکی را تغییر دهید.

فعال کردن دارک مود برای وبسایت

همچنین می‌توانید با استفاده از Style settings رنگ‌های آن را تغییر دهید.

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

فعال کردن مود تیره برای قسمت پیشخوان وردپرس ادمین

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

به قسمت settings> WP Dark Mode بروید و بر روی General settings کلیک کنید. سپس کلید Enable Backend Darkmode را بر روی موقعیت on قرار دهید. یادتان نرود که در انتهای صفحه گزینه save را هم از قلم نیندازید.

فعال کردن دارک مود در پیشخوان وردپرس

وقتی این کار را انجام دادید، یک کلید جدید در بالای قسمت دشبورد ادمین وردپرس خواهید دید.

فعال کردن حالت تیره در پیشخوان وردپرس

این سوییچ دو حالت Light (normal) و Dark دارد که همان مود تیره را به رابط کاربری دشبورد اضافه می‌کند.

با کلیک کردن بر روی حالت دارک می‌توانید به راحتی مود مشکی را به قسمت دشبوردتان اضافه کنید.

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

همچنین به راحتی می‌توانید به غیر از ویژگی مود مشکی از طیف رنگی قسمت دشبورد استفاده کنید؛ برای تنظیم به قسمت Users>profile بروید و بر روی یک گزینه در زیر قسمت Admin color scheme کلیک کنید.

به یاد داشته باشید برای اینکه رنگ‌های مختلف Admin Color Scheme را ببینید، باید مود تیره را خاموش کنید.

تنظیمات دارک مود در پیشخوان وردپرس

 

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

حالا می‌توانید به راحتی در هنگام شب بنویسید و کار کنید؛ بدون اینکه چشمان‌تان اذیت شوند.

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

امیدواریم این مقاله به شما کمک کرده باشد تا به آسانی بتوانید این ویژگی را در وردپرس فعال کنید.

دانلود pdf آموزش وردپرس
میخواهید همیشه این مقاله را همراه داشته باشید؟
با دانلود فایل پی دی اف مقاله همیشه میتوانید به این آموزش دسترسی داشته باشید
فایل شما آماده دانلود است روی دکمه زیر کلیک کنید
perm_identity ارسال شده توسط زهرا عزیزی
folder_open آموزش افزونه های وردپرس ، وردپرس
access_time۲ آبان ۱۳۹۹
visibility 549 بازدید
اشتراک گذاری:
درحال ارسال
امتیاز دهی کاربران
0 (0 رای)
امتیاز نظرات 0 (0 امتیاز دهی)
نظر شما در مورد این مطلب چیست؟
با دادن امتیاز به مطالب مارا در خدمت رسانی بیشتر یاری کنید و اگر از این مطلب راضی بودید با امتیاز بالا به نویسندگان سایت قوت قلب بدهید و اگر رضایت نداشتید حتما در نظرات همین مطلب اعلام کنید و به ما در این مسیر کمک کنید.
Telegram-Chanell-ShahrWpما را در تلگرام دنبال کنید ورود
Instagram-ShahrWpما را در اینستاگرام دنبال کنید ورود
مطالب زیر را حتما بخوانید
  • همه چیز درباره pwa در وردپرس-ساخت اپلیکیشن وردپرس بدون یک ریال هزینه

    883 بازدید

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

    731 بازدید

  • آموزش افزونه المنتور فارسی
    آموزش افزونه المنتور فارسی

    766 بازدید

  • بررسی کامل تنظیمات المنتور (نسخه پرو و رایگان)

    733 بازدید

  • راه اندازی افزونه همکاری در فروش ووکامرس
    راه اندازی افزونه همکاری در فروش ووکامرس + افزونه جانبی مورد نیاز

    514 بازدید

emtiaz

پاسخی بگذارید لغو پاسخ

درحال ارسال

جستجو برای:
هاست
بخش های این مطلب
1 حالت تیره چیست و چرا باید این قابلیت را فعال کرد؟
2 چگونگی فعال کردن دارک مود برای کاربران سایت وردپرسی
3 فعال کردن مود تیره برای قسمت پیشخوان وردپرس ادمین
نوشته‌های تازه
  • همه چیز درباره pwa در وردپرس-ساخت اپلیکیشن وردپرس بدون یک ریال هزینه
  • نمایش محصولات مرتبط در ووکامرس به آسان ترین روش ممکن
  • بهترین افزونه سئو وردپرس در کنار ۸ گام ساده بهبود رتبه
  • لیست شورت کد های ووکامرس
  • آموزش افزونه المنتور فارسی

ارتباط با شهر وردپرس

تلفن گویا : ۹۱۰۳۵۱۵۶-۰۲۱

کانال تلگرام ◄

صفحه اینستاگرام ◄

صفحه آپارات ◄

اینستاگرام امیر حسین احمدی ◄

جدیدترین مطالب
  • همه چیز درباره pwa در وردپرس-ساخت اپلیکیشن وردپرس بدون یک ریال هزینه ۲ آبان ۱۳۹۹
  • نمایش محصولات مرتبط در ووکامرس به آسان ترین روش ممکن ۲ آبان ۱۳۹۹
  • بهترین افزونه سئو وردپرس در کنار ۸ گام ساده بهبود رتبه ۲ آبان ۱۳۹۹
  • تبلیغات در شهر وردپرس
logo-samandehi
پیاده سازی شده با عشق ♥، تمامی حقوق برای شهر وردپرس محفوظ است.
نسخه چهارم شهر وردپرس ، (درباره ما)
حالت شب: به سلامت چشم و خوانایی بهتر مطالب به شما کمک میکند (روی آیکون کلیک کنید)
keyboard_arrow_up
ورود ×
کد تایید
لطفاً کد تأیید ارسال شده را تایپ کنید
ثبت
رمز عبور را فراموش کرده اید؟
ورود با کد یکبارمصرف
ارسال مجدد کد یکبار مصرف(00:60)
آیا حساب کاربری ندارید؟
ثبت نام
ارسال مجدد کد یکبار مصرف(00:60)
برگشت به ورود

ارسال مجدد کد یکبار مصرف (00:60)
برگشت به ورود
  • (+98) ایران