모바일 안드로이드(Android)와 아이폰(iOS) 에서 브라우저 주소창이 나오는
상단바의 배경색을 설정할 수 있습니다.
meta 태그를 이용해서 자신의 웹 사이트의 테마 색상과 일치시키면 방문자에게 만족스러운
모바일 서비스를 제공할 수 있습니다. 취향에 따라 색상을 마음대로 설정할 수
있습니다. 블로그에 적용하고 싶다면 아래 단계를 따라 적용해보세요.
Blogger 대시보드에서 테마를 클릭하고 아래와 같이 HTML 편집을 클릭하십시오. 다른 플랫폼의 경우 HTML 편집 모드에서 편집하시면 됩니다.
HTML 편집 모드에서 <head> 코드를 찾습니다.
그 다음 <head> 코드의 아래쪽에 다음 코드를 붙여 넣으십시오.
<!-- Chrome, Firefox, Opera -->
<meta content='#232323' name='theme-color'/>
<!-- Windows Phone -->
<meta content='#232323' name='msapplication-navbutton-color'/>
<!-- iOS Safari -->
<meta content='#232323' name='apple-mobile-web-app-status-bar-style'/>
<meta content='yes' name='apple-mobile-web-app-capable'/>
Header의 배경색과 어울리도록 위의 코드에서 표시된 HEX 코드를 적절하게 변경해주세요! 그리고 테마를 저장합니다.
이제 스마트폰에서 크롬 또는 사파리 브라우저를 사용하여 블로그를 열어보세요. 변경된 사항을 확인 할 수 있습니다.
주소창과 상단바의 색상이 헤더 메뉴의 색상이 변경되었습니다. 또한 브라우저의 탭 테두리 색상도 함께 변경되며 화면 아래로 스크롤을 내리면 상태바의 색깔이 유지됩니다.
