3/9/15

[Hướng dẫn] Tạo website thân thiện với di động bằng touch icon apple (iphone/ipad/ipod touch)

5:30 PM


Với Safari trên IOS bạn không chỉ đơn thuần bookmark trang web mà còn có thể tạo 1 icon ngoài màn hình Home để truy cập nhanh. Chỉ với vài bước đơn giản để website của bạn thân thiện hơn với các thiết bị thông minh từ Apple. Cùng thực hiện nhé!

Hiện tại có 3 màn hình khác nhau thích ứng với các thiết bị của Apple: iPad, iPhone 4,5,6 và các iPhone đời trước. Kích thước 76px cho các iPhone cũ (iphone 4 trở về trước), 120 px cho iPad  và 152 px cho iPhone 6 và loại mới hơn. H

Đây là đoạn code mà bạn sẽ cần thêm vào cho phần đầu của file HTML. (trong thẻ <head>)
<link rel="apple-touch-icon" href="touch-icon-iphone.png">
<link rel="apple-touch-icon" sizes="76x76" href="touch-icon-ipad.png">
<link rel="apple-touch-icon" sizes="120x120" href="touch-icon-iphone-retina.png">
<link rel="apple-touch-icon" sizes="152x152" href="touch-icon-ipad-retina.png">
Lưu ý thay thế bằng link ảnh của bạn nhé!

Done! Bạn refesh lại trên trình duyệt safari là có thể bookmark hoặc add to home :) Chúc bạn thành công.

Người viết

Nếu thích mấy thứ tớ viết , nhớ nhắn mấy chú, mấy thím với mấy chế, ghé đến ngó mấy cái đó, nhé mấy bác! :v

0 comments:

Post a Comment

 

© 2016 MAXO. All rights resevered. Designed by Templateism

Back To Top