تغییر رنگ آدرس بار در مرورگر موبایل برای هماهنگ شدن با قالب

440 بازدید
دوشنبه ۹ فروردین ۱۳۹۵
تغییر رنگ آدرس بار در مرورگر موبایل برای هماهنگ شدن با قالبReviewed by جواد نبوی on Mar 28Rating: 3.5

تغییر رنگ آدرس بار مرورگر موبایل

سلام دوستان؛ آیا تا به حال سایت های بزرگی مانند فیسبوک و BBC را در موبایل باز کرده اید؟ اگر توجه کرده باشید هنگام باز کردن این سایت ها در موبایل, رنگ آدرس بار (نوار آدرس) مرورگرتان به رنگ دیگری در می آید که هماهنگ با قالب آن سایت است. در این مطلب به شما نشان میدهیم که چگونه می توانید رنگ آدرس بار را در مرورگر های موبایل تغییر دهید تا با قالب سایتتان هماهنگ شود. با این آموزش از وب تستر همراه باشید.

چرا باید رنگ آدرس بار را با قالب هماهنگ کنیم؟

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

تغییر رنگ آدرس بار برای هماهنگ شدن با قالب, میتواند سایت شما را به شکلی در بیاورد که به کاربر حس بودن در یک اپلیکیشن اختصاصی را بدهد. این عمل تجربه لذت بخش بودن مرور سایت را برای کاربر بیشتر می کند و باعث رونق کسب و کار شما می شود.

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

تغییر رنگ آدرس بار در مرورگر موبایل برای هماهنگ شدن با قالب سایت

کد زیر را به فایل header.php قالب یا Child theme تان اضافه نمایید (توجه داشته باشید که کد زیر باید قبل از بسته شدن تگ <head/> قرار بگیرد).

<meta name="theme-color" content="#ff6600" />

این قطعه کد یک متاتگ اچ تی ام ال است که توسط گوگل کروم در آندروید برای تغییر رنگ آدرس بار مرورگر موبایل استفاده می شود. در فیلد content باید به جای عبارت ff6600 کد رنگ مورد نظرتان را قرار دهید (کد رنگ به صورت hex باید باشد).

نمیدانید چطور کد hex رنگ مورد نظرتان را به دست بیاورید؟

شما میتوانید به آسانی, کد hex رنگ دلخواهتان را از طریق هر نرم افزار ویرایش تصویری مانند فتوشاپ, پینت, گیمپ و … بدست آورید.

تغییر رنگ آدرس بار مرورگر موبایل

همچنین برای انتخاب رنگ میتوانید از ابزار آنلاین انتخاب رنگ HTML استفاده نمایید.

اگر میخواهید کد hex یک رنگ موجود در صفحه ی وب را بیابید میتوانید از یک اکستنشن مانند ColorZilla استفاده کنید.

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

تبلیغات

نویسنده (مدیر سایت)

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

پاسخ دهید

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