Hướng dẫn cách đổi màu trình duyệt web trên Mobile

Thay đổi màu nền trên thanh địa chỉ như Facebook

Bạn có nhận thấy rằng khi truy cập vào website của nhiều trang web phổ biến như BBC và Facebook thì thanh địa chỉ trên trình duyệt của bạn chuyển thanh màu trùng với màu thương hiệu đó.

Ví dụ như bạn dùng điện thoại truy cập vào website Facebook thì thanh địa chỉ cũng sẽ đổi sang màu xanh dương. Màu xanh huyền thoại của Facebook.

Điều này làm nổi bật thương hiệu của họ qua màu sắc. Vậy liệu nếu chúng ta sử dụng WordPress để thực hiện thì có đạt được kết quả như họ không. Chúng ta có thể khẳng định thương hiệu của mình như họ không. Đáp án là hoàn toàn có thể.

Tại sau phải chuyển đổi màu nền thanh địa chỉ

Hầu hết hiện nay khi sử dụng WordPress để thiết kế website các trang web đều được tích hợp hiển thị trên nhiều thiết bị với độ co giãn khác nhau.

Vì vậy người truy cập dễ dàng hơn trong việc trãi nghiệm web của bạn. Điều này làm cho trang web của bạn trong tuyệt vời hơn trên thiết bị di động.

Việc kết hợp màu của thanh địa chỉ với trang web WordPress của bạn, mang lại cảm giác giống như ứng dụng gốc. Điều này cải thiện trải nghiệm người dùng, cuối cùng giúp tăng doanh số và chuyển đổi.

Tuy nhiên, điều này còn bị hạn chế bởi vì nó chỉ hoạt động cho trình duyệt web Google Chrome trên thiết bị Android sử dụng Lollipop hoặc các phiên bản mới hơn. Các chuyên gia cũng đang khắc phục hạn chế này.

Cách thay đổi màu nền thanh địa chỉ

Cách làm 1:

Chỉ cần viêt thêm dòng code này và đặt nó vào tệp của theme giao diện chính (Main Theme) hoặc theme con (Child Theme) của header.php  trước </head> thẻ đóng .

Cú pháp câu lệnh như sau:

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

Trong đó: content là màu sắc bạn chọn hiển thị trên thanh địa chỉ trong ví dụ mã màu #ff6600 là MÀU CAM

Dòng này là thẻ meta HTML được Google Chrome sử dụng trên Android để thay đổi màu của thanh địa chỉ trong trình duyệt di động. Trường nội dung có mã hex cho màu bạn muốn sử dụng làm màu chủ đề.

Bạn có thể tham khảo bảng mã màu tại website này: https://www.color-hex.com/

Giá trị màu định dạng theo kiểu HEX. Vì vậy có thể sử dụng các phần mềm chỉnh sửa như Adobe Photoshop, Gimp, Paint, để có được thông số mã màu.

Cách làm 2

Bước 1:

Vào phần Dashboard > Appearence > Editor > Chọn Theme hiện tại bạn đang sử dụng

Bước 2:

Tìm đến mục header.php

Bước 3:

Chọn phần chỉnh sửa [Editor] sau đó nhấn Ctrl + F tìm đến thẻ </head>

Bước 4:

Chèn đoạn mã vào thẻ </head>

< meta name=”theme-color” content=”Mã màu bạn chọn”  />

Cách làm 3

Bạn có thể tải plugin và cài cho website của bạn. Có thể đây là cách dễ dàng nhất nếu như bạn cảm thấy 2 cách trên không thể thực hiện

Plugin Browser Theme Color

 

 

Hãy cho bài viết 1 Like nhé !
Love
Haha
Wow
Sad
Angry
You have reacted on "Hướng dẫn cách đổi màu trình duyệt web trên Mobile" A few seconds ago