본문 바로가기
N잡러/블로그 운영

티스토리 블로그 모바일에서 이미지 확대/축소 방법

by 스마트머니 2021. 9. 9.
반응형

모바일에서 글이나 이미지를 크게 보고 싶을 때, 두 손가락으로 화면을 늘이고 줄이고 하는 기능은 우리에게 이제 매우 익숙해졌습니다. 그래서 이 기능이 정상적으로 작동하지 않는다면 매우 불편합니다. 저는 주로 PC를 이용하여 블로그를 작성하기 때문에 잘 몰랐었는데, 모바일로 작성된 글을 보다 보니 이미지가 크게 확대가 되지 않는 문제점이 관찰되었습니다. 

 

이미지 확대 축소하기
이미지 확대 축소하기

 

블로그를 운영하다 보면 다양한 정보를 효과적으로 전달하기 위해서는 이미지 사용이 필수인데요. 모바일은 PC에 비해서 상대적으로 화면이 작다 보니, 이 확대하는 기능이 제대로 작동하지 않는다면 이미지 속의 내용을 제대로 확인할 수 없고 글의 가독성이 떨어져 많은 불편함을 유발할 것입니다. 

 

그래서 이번에는 블로그를 모바일에서 볼 때, 두 손가락을 이용하여 화면을 확대 또는 축소하는 방법에 대하여 알아보겠습니다. 

 

 

■ 티스토리 블로그에서 이미지 확대/축소 기능 사용하기

티스토리 플러그인(LIGHT TT EX) 사용하기

일단 "블로그 관리" 페이지로 들어가서, "플러그인" 메뉴로 들어갑니다. 

여러 가지 플러그인들이 쭉 나타나게 될 텐데요. 이 중에서 "LIGHT TT EX"를 찾습니다. (아래 이미지 참조)

설명을 보면 "이미지 크게 보기"라고 되어 있습니다. 이 플러그인을 눌러주세요. 

티스토리 플러그인
티스토리 플러그인

 

다음과 같은 화면이 나타날 텐데요. 여기서 아래쪽에 보면 "이미지를 창 크기에"라고 되어 있는 부분에 "맞춥니다"라고 선택해줍니다. 그러고 나서 "변경사항 저장" 버튼을 눌러주세요.

Light TT EX 플러그인 적용화면
Light TT EX 플러그인 적용화면

 

그러고 나서 "블로그 관리" 메뉴에서 "꾸미기" Section에서 "스킨 편집"으로 들어갑니다.

"html 편집"이 보이는데, 눌러서 들어갑니다. 

 

<head> </head> 구역을 잘 보시면 아래와 같은 meta tag 가 있는 것이 보일 겁니다.

잘 찾아지지 않으신다면 단축기 ctrl+F 를 눌러서 viewport를 검색하시면 됩니다. 

 

viewpoint 코드
viewpoint 코드

위와 같은 tag를 찾아서 아래와 같이 변경해줍니다.

(기존에 있던 Tag는 "<!-- ~~~ -->"처리를 해서 숨김 처리해주셔도 되고, 아니면 여기 블로그에 기존의 tag가 박제되어 있기 때문에 삭제해주셔도 무방합니다. 

 

viewpoint 코드 수정하기
viewpoint 코드 수정하기

 

위와 같이 변경 후, "적용" 버튼을 누르고 빠져나와 주면 완료되었습니다.

 

참고로, 여기서 사용되는 viewport의 경우 다른 기능들도 적용해줄 수 있습니다.

"initial-scale"이라고 되어 있는 부분은 초기 배율을 의미합니다.

"maximum-scale"은 최대 비율을 적용하는 부분입니다.

"minimum-scale"은 최소 비율을 적용하는 부분입니다.

또한 위에는 나타나 있지 않지만, "user-scalable=YES" 또는 "user-scalable=NO"를 통해서 유저가 스케일 조절이 가능하거나 불가능하게 설정할 수도 있으니 참고하여 적용하여 주시면 됩니다. 

 

반응형

 

■ 티스토리 앱과 티스토리 모바일 간의 차이점

그리고 또 하나 알아두셔야 할 점이 있는데, 모바일로 티스토리 블로그를 하는 방법은 2가지가 있습니다.

 

1) 모바일 버전 Tistory

Tistory 주소 뒤에 "m"이 붙어 있는 모바일 버전입니다. (예를 들어, https://OOOO.tistory.com/m)

여기서는 html tag를 통한 각종 기능이 정상적으로 작동되기 때문에 위에서 적용한 바와 같이 이미지 확대/축소가 원활하게 사용 가능합니다. 

 

티스토리

티스토리 앱도 사용해 보시겠어요? 앱을 설치하시면 더욱 편리한 블로그 생활이 가능합니다.

www.tistory.com

 

2) Tistory 앱

두 번째 방법은 Tistory 앱을 사용한 블로그 이용입니다.

Tistory 앱은 html 기반의 프로그램이 아닌 관계로, 위에서 적용한 html 기능은 앱에서는 정상 작동하지 않습니다. 따라서 현재 Tistory 앱에서는 이미지 확대가 제대로 되지 않는 문제가 있는데요. 이 부분은 Tistory 측에서 별도로 개선을 해주셔야 할 것 같습니다. 현재 앱으로 블로그를 읽을 때는 이미지 사이즈가 작아서 매우 불편합니다. 

 

앱에서도 이미지를 크게 볼 수 있는 방법을 알게 되면 공유하겠습니다. 

 

감사합니다.

반응형