Iris Tips
Iris TipsHow to change status bar color to match website in Lollipop?
Như các bạn đã biết từ Android 5.0 Lollipop trở đi Google đã hỗ trợ việc đồng bộ màu của ứng dụng với màu sắc của thanh status. Vậy làm thế nào để đồng bộ màu sắc website của bạn và thanh trạng thái trên Android, hãy xem cách thực hiện ở bài viết bên dưới nhé.
Đồng bộ màu sắc Status bar với website
1Cách thực hiện rất đơn giản bạn hãy vào Mẫu >> Chỉnh sửa HTML và thêm thẻ meta bên dưới vào sau thẻ <head><meta content='#fff' name='theme-color'/>
<meta content="#fff" name="msapplication-navbutton-color"/>
<meta content="#fff" name="apple-mobile-web-app-status-bar-style"/>Chỉnh sửa:#fff thành mã màu website của bạn. Bạn có thể tra cứu bảng mã màu hệ hexa tại liên kết bên dưới.
Kết quả:
Chỉnh sửa biểu tượng cho website
2Bạn cũng có thể tùy chỉnh icon website khi hiển thị trên trang recent page hoặc trang bookmark trên các trình duyệt di động. Bằng cách thêm đoạn code bên dưới cũng sau thẻ <head><link href="url-icon-website.png" sizes="192x192" rel="icon" >Lưu ý: Định dạng ảnh là PNG. Kích thước biểu tượng phải là 192x192.
Đối với hệ điều hành iOS chúng ta cần quy định rõ từng icon cho mỗi loại màn hình khác nhau.
<link href="url-icon-iphone.png" rel="apple-touch-icon">
<link href="url-icon-ipad.png" sizes="76x76" rel="apple-touch-icon">
<link href="url-icon-iphone-retina.png" sizes="120x120" rel="apple-touch-icon">
<link href="url-icon-ipad-retina.png" sizes="152x152" rel="apple-touch-icon">Kết quả:
Nếu có bất kỳ vấn đề khó khăn hay câu hỏi gì, bạn đừng ngần ngại, hãy để lại bình luận ở form bên dưới nhé.
Chúc bạn thành công!
Created by Iris Tips
Mẹo nhỏ khi bình luận