검색결과 리스트
WEB에 해당되는 글 28건
- 2022.07.06 모바일웹 사이트 바로가기 아이콘 적용
글
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.
과거에 모바일웹 사이트의 바로가기 아이콘을 적용할 필요가 있었는데,
아래 사이트를 보고 해결했는데 사이트에 정리하여 둔다.
[ICON SIZE]
- 안드로이드 : 72px × 72px (png)
- 아이폰 : 57px × 57px (png)
- 아이패드 : 72px ×72px (png)
(114px ×114px 이미지를 사용하면 아이폰에서 자동으로 크기 리사이징 해 사용)
01. 안드로이드폰 (Android Phones)
<link rel="shortcut icon" href="/png 아이콘파일이 있는 경로/icon.png" />
02. 아이폰 (iOS)
아이폰이 기본으로 제공하는 UI 처리 사용
<link rel="apple-touch-icon" href="/png 아이콘파일이 있는 경로/icon.png" />
아이폰이 기본으로 제공하는 UI 처리 사용 안함
<link rel="apple-touch-icon-precomposed" href="/png 아이콘파일이 있는 경로/icon.png" />
위의 내용을 처리했으면 아래와 같이 스크립트 삽입
<script type="text/javascript">
var userAgent = navigator.userAgent.toLowerCase(); // 접속 모바일 디바이스 정보
// 모바일 홈페이지 바로가기 링크 생성
if(userAgent.match('iphone')) {
document.write('<link rel="apple-touch-icon" href="/{png_path}/icon.png" />');
}
else if(userAgent.match('ipad')) {
document.write('<link rel="apple-touch-icon" sizes="72*72" href="/{png_path}/icon.png" />');
}
else if(userAgent.match('android')) {
document.write('<link rel="shortcut icon" href="/{png_path}/icon.png" />');
}
</script>
var userAgent = navigator.userAgent.toLowerCase(); // 접속 모바일 디바이스 정보
// 모바일 홈페이지 바로가기 링크 생성
if(userAgent.match('iphone')) {
document.write('<link rel="apple-touch-icon" href="/{png_path}/icon.png" />');
}
else if(userAgent.match('ipad')) {
document.write('<link rel="apple-touch-icon" sizes="72*72" href="/{png_path}/icon.png" />');
}
else if(userAgent.match('android')) {
document.write('<link rel="shortcut icon" href="/{png_path}/icon.png" />');
}
</script>
'WEB' 카테고리의 다른 글
| 아파치 분산설정파일 htaccess로 http로 요청 시 https로 변경하기 (0) | 2021.04.13 |
|---|---|
| 이클립스에서 주석을 제외한 한글 전체검색 (0) | 2018.03.12 |
| 유튜브 동영상 썸네일 이용 (0) | 2016.07.29 |
| Private Browsing (0) | 2014.07.01 |
| 웹에서 앱마켓으로 보내기 (0) | 2013.06.07 |
RECENT COMMENT