چگونه حالت تاریک را به وب سایت وردپرس خود اضافه کنیم (آسان)

آیا می خواهید حالت تاریک را به سایت وردپرس خود اضافه کنید؟

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

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

Adding dark mode to your WordPress website (easily)

حالت تاریک چیست و چرا آن را به وب سایت خود اضافه می کنیم؟ h4>

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

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

اگر دستگاه iPhone یا Android دارید ، ممکن است بتوانید به سادگی و با استفاده از ضامن به حالت تاریک بروید.

همچنین ، در رایانه خود ، می توانید وب سایت ها را در حالت تاریک با استفاده از برنامه افزودنی Chrome مانند Night Eye مشاهده کنید. نحوه وب سایت WPBeginner با استفاده از آن برنامه افزودنی به شرح زیر است:

The WordPress website viewed using the Chrome 'Night Eye' extension

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

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

Viewing YouTube with the dark theme option switched on

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

ابتدا ، ما می خواهیم نگاهی به اضافه کردن حالت تاریک به وب سایت وردپرس . سپس ، ما اضافه کردن حالت تاریک به داشبورد مدیر WordPress شما را پوشش خواهیم داد.

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

افزودن حالت تاریک به وب سایت وردپرس شما h4>

ابتدا باید افزونه WP Dark Mode . برای جزئیات بیشتر ، به راهنمای گام به گام ما در نحوه نصب افزونه وردپرس .

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

در اینجا ، تنظیم “Enable OS aware Dark Mode” برای شما روشن شده است. این به این معنی است که بازدیدکنندگان به طور خودکار نسخه حالت تاریک سایت شما را هنگام تنظیم دستگاه خود روی حالت تاریک مشاهده می کنند.

تنظیمات “نمایش سوئیچ شناور” نیز روشن شده است. این به این معنی است که کاربران می توانند هر زمان دید خود را در سایت به حالت تاریک تغییر دهند ، حتی اگر گزینه Dark Mode را در دستگاه خود فعال نکرده باشند.

The General Settings page for the WP Dark Mode plugin

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

The dark mode switch is now displaying on the website for visitors p >

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

به عنوان مثال ، برای تغییر سبک سوئیچ شناور فقط باید روی برگه تنظیمات صفحه نمایش کلیک کنید:

Choosing the type of night mode toggle button in the Display Settings p >

همچنین می توانید رنگهای حالت تیره را با استفاده از برگه تنظیمات سبک تنظیم کنید:

Choosing your dark mode color scheme in the Style Settings

پس از انجام هرگونه تغییر حتماً روی دکمه ذخیره تنظیمات کلیک کنید.

توجه: با نسخه رایگان حالت تاریک WP ، شما فقط 2 سبک سوئیچ شناور اول و 2 پیش تنظیم رنگ اول را برای انتخاب دریافت می کنید.

نسخه حرفه ای حالت WP Dark Mode گزینه های بیشتری را برای طراحی ارائه می دهد ، به علاوه امکان روشن کردن حالت تاریک در زمان های خاص و گزینه افزودن کد CSS سفارشی.

افزودن حالت تاریک به سرپرست وردپرس h4>

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

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

به سادگی به صفحه تنظیمات »WP حالت تاریک بروید و روی برگه تنظیمات کلی کلیک کنید. سپس ، کلید “Enable Backend Darkmode” را به موقعیت روشن تغییر دهید. فراموش نکنید که روی دکمه ذخیره تنظیمات در پایین صفحه کلیک کنید:

Switch on the Enable Backend Dark Mode toggle so you can use dark mode in your WordPress admin

اکنون یک سوئیچ جدید در نوار بالای منطقه سرپرست خود مشاهده خواهید کرد:

The toggle switch in your WordPress admin to switch between light (normal) and dark for your admin interface

به سادگی بر روی این کلید کلیک کنید تا فوراً منطقه مدیر خود را به حالت تاریک تغییر دهید.

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

از آنجا که “حالت تاریک” یک طرح رنگ سرپرست نیست ، به راحتی می توانید از آن به همراه یک طرح رنگ مدیر موجود در وردپرس استفاده کنید. برای تنظیم این مورد ، فقط به کاربران »نمایه بروید و روی گزینه ای در Admin Color Scheme کلیک کنید.

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

Selecting an admin color scheme in WordPress, on your user profile page

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

Switching dark mode on in the WordPress block editor

اکنون ، می توانید شبانه بدون اینکه چشم خود را خسته کنید ، به راحتی در وب سایت خود بنویسید و کار کنید.

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

اگر این مقاله را دوست داشتید ، لطفاً مشترک شوید کانال YouTube برای آموزش های ویدئویی وردپرس. همچنین می توانید ما را در Twitter و فیس بوک .

منبع:
https://www.wpbeginner.com/wp-tutorials/how-to-add-dark-mode-to-your-wordpress-website-easy/.

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