데스크탑으로 티스토리를 볼 때는 모니터가 크므로 사진이나 글씨를 볼 때 큰 불편함이 없지만,
핸드폰으로 포스팅을 볼 때 사진을 확대해서 보고 싶으면, 사진을 클릭해서 두 손가락으로 확대해서 보게 됩니다.
그래서 저는 티스토리에서 당연히 사진이 확대가 되는 줄 알았습니다.
그런데 알아보니, 티스토리에서는 기본세팅이 사진 확대가 안되게 되어있어, 사진을 터치 후 손가락으로 확대해도 확대가 되지 않습니다.
오늘은 html 코드를 변경하여 모바일에서 사진 및 글씨 확대할 수 있게 하는 법을 알아보겠습니다.
글자 및 사진 코드 수정
전에는 사진을 확대할 수 있는 플러그인이 있었던 것 같은데, 이유는 모르겠지만, 보이지 않았습니다.
그래서 html에서 직접 코드를 수정해야 합니다.간단하므로, 누구나 쉽게 할 수 있습니다.
1. 기존 viewport 코드 주석처리
티스토리에서 블로그관리홈 > 꾸미기 > 스킨편집 으로 갑니다.
오른쪽 스킨편집에 html편집을 선택합니다.
HTML에서 ctrl + F를 눌러 viewport를 검색합니다.
그러면
meta name="viewport" content="user-scalable=no.............. width=device-width">
라고 나오는데요, 그 부분을 주석처리 합니다.
html의 주석처리는
코드의 맨 앞에 <!--
코드의 맨 뒤에 -->
를 입력하면 됩니다.
따라서 아래와 같이 빨간색 부분을 입력하면 됩니다.
<!--meta name="viewport" content="user-scalable=no.............. width=device-width"> -->
2. 새로운 viewport 코드입력
기존의 설정을 주석처리하여 작동하지 않게 하였으므로,
이제 사진이나 글자가 확대할 수 있게 하는 코드를 추가합니다.
그냥 아래 코드를 복사하여 붙여넣기 하면 됩니다.
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1"/>
저는 언제, 왜 코드를 주석처리 했는지 표시하기 위해 주석에 약간의 내용을 적어줍니다.
ex. <!--사진확대 코드추가 2022.08.12-->
그래서 저는 아래 그람과 같이 기존코드를 주석처리 하였고, 새로운 코드를 넣었습니다.
그리고 적용을 누르고, 모바일에서 내 글을 확인해 보면, 사진 및 글자가 손가락으로 확대가 되는 것을 볼 수 있습니다.
'유용한 정보 궁금~' 카테고리의 다른 글
IC운전면허증 및 모바일면허증 발급 후기 (0) | 2022.09.28 |
---|---|
안전난간대 설치기준, 법령, 적합 사례 사진, 부적합 사례 사진 (0) | 2022.09.21 |
2021년 가장 많이 팔린 파이류 TOP 10 (0) | 2022.08.12 |
관광기업 취업멘토링 행사 참가자 모집 (0) | 2022.08.11 |
병원성대장균으로 인한 식중독 예방을 위한 안전수칙 (0) | 2022.08.09 |