본문 바로가기

블로그 TIP

티스토리 모바일 웹 확대, 줌인

모바일 기기 화면에서 확대, 줌인

티스토리 블로그 스킨 편집에서 모바일 기기 화면 고정, 확대 수정을 할 수 있습니다. 때문에 티스토리 블로그를 운영하시는 분들은 중 < 스킨 사용 >하시는 분들은 확인하셔서 자신이 원하는 설정으로 바꾸시길 바랍니다.

  • HTML에서 < viewport >으로 모바일 확대/고정 설정이 가능합니다.
  • 모바일에서 자신의 블로그가 어떤 상태인지 확인 하시길 바랍니다.
  • 모바일 화면은 작기 때문에 < 확대가 되는 상태 >를 추천 드립니다.
  • 모바일에서 표, 사진이 짤리면 확대 기능으로 볼 수 있고, 다양한 장점이 있습니다.



HTML 설정

  • [ 관리자 - 꾸미기 - 스킨편집 - HTML편집 ]에서 편집합니다.
  • Ctrl+F 찾기로 viewport 영역을 설정 해줍니다.
  • 상단 부분에 있으니, 사진을 참고하면 쉽게 찾을 수 있습니다.


모바일 확대 OFF (고정)

  • 아래 소스코드를 그대로 복사하여 붙여 넣습니다.
1
<meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, width=device-width">
cs


모바일 확대 ON

  • 아래 소스코드를 그대로 복사하여 붙여 넣습니다.
1
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" />
cs


viewport 영역 설명

  • initial-scale : 초기 줌 배율 설정
  • maximum-scale : 최대 줌 배배 설정
  • minimum-scale : 최소 줌 배율 설정
  • user-scalable : 사용자가 확대/축소 가능여부