300x250
티스토리 모바일 환경에서의 특징은 확대 기능을 지원하지 않는다는 것입니다. 특히나 PC에 비해 화면이 작은 모바일에서는 확대가 필수인데도 불구하고 관련 플러그인이 없어서 불편이 있습니다. 그래서 오늘은 코드 한 줄을 넣어서 모바일 환경에서도 확대를 할 수 있는 내용에 대해 다루어볼까 합니다.
기존 코드 숨기기 / 삭제
우선 "스킨 편집 - html 편집" 순서대로 들어가서 html 코드창으로 들어가야합니다. 보통 코드들이 많아서 검색을 하지만 기존 코드는 최상단에 위치해있기 때문에 검색을 하지 않으셔도 쉽게 찾으실 수 있습니다. 혹시나 못 찾겠다고 하시는 분들은 "Ctrl + F" 를 하신 후에 "Viewport" 코드를 찾아주시면 됩니다.
<!-- <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, maximum-scale=5"> -->
사진에서 6번째 자리에 기존 코드가 있습니다 상단처럼 <!-- 와 --> 로 "숨김 처리"를 해줍니다. 혹은 이미지 코드를 삽입할 것이기 때문에 삭제해주셔도 상관없습니다. 하지만 추후에 어떤 상황이 생길지 모르니 숨김 처리를 하는 것을 추천드립니다.
이미지 확대 코드 삽입
기존 viewport 코드를 숨김 처리 하셨다면 이미지 확대 코드를 삽입할 차례입니다.
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1"/>
상단에 있는 사진과 같이 첨부한 이미지 확대 코드를 복사하여 붙여넣기 해줍니다. 삽입 후 자신의 블로그를 모바일 환경으로 들어가서 코드가 활성화 되었는지 확인해주시면 끝이 납니다. 정말 간단합니다.
모바일 환경에서는 정말 중요한 요소이니 꼭 해보시면 좋을 것 같습니다.
300x250
'블로그' 카테고리의 다른 글
사진 용량 줄이는 무료 최적화 압축 사이트 TinyPNG (7) | 2024.09.06 |
---|---|
블로그 수익화 필수 요소 - 이전 발행 글 링크 설정하는 방법 (0) | 2023.03.28 |
구글 서치 콘솔 도메인 삭제하는 방법 - 색인 생성 문제 해결 (0) | 2023.03.21 |
티스토리 로딩화면 설정으로 체류시간 늘려서 10만원 벌기 (0) | 2023.03.20 |