본문 바로가기

[ IT ][ PC ][ Mobile ]/팁 & Information

[Tip!] 티스토리 블로그 크기가 제각각인 사진 이쁘고 깔끔하게 나열(배치)하기 -

336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

블로그를 운영하다보면 사진 이미지를 많이 첨부하게 됩니다. 가독성을 높이고 글을 지루하지 않게 하는 목적도 있고 글을 더 잘 설명하기 위한 목적도 있습니다.


그런데 이런 사진들을 첨부하다 보면 크기가 제각각이어서 보기 흉한 경우가 종종 발생을 하곤 합니다. 뭐 저 같은 경우는 정렬을 하는 경우도 있지만 그렇지 않은 경우도 많습니다.


하지만 이쁘게 배치되는 걸 원하시는 분들이라면 크기가 제각각인 이미지가 크게 거슬리고 신경쓰이실 겁니다. 심미적인 부분을 제외 하더라도 이미지의 특성상 여러장의 사진을 붙이거나 정렬하여 첨부해야하는 경우가 있습니다. 앞선 포스팅에서 알려드렸던 포토스케이프를 사용하셔도 되지만 두번의 작업을 거쳐야 하는 번거로움이 있습니다.

물론 포토스케이프로 편집을 하면 더 다양하게 이어붙이기가 가능한 장점도 있습니다.


하지만 이번 포스팅에서는 글쓰기 자체기능을 통해 간단하게 해결하는 팁에 대해 포스팅하고자 합니다.



 티스토리 블로그 기본 글쓰기 기능으로 깔끔하게 사진 배열 정리 배치 하기  


티스토리 블로그 이미지 삽입/수정/편집 완전 공략!!


티스토리 기본 이미지 편집에서는 사진 붙히기를 3가지 모드를 지원합니다. 


2장을 한줄로 붙히기

3장을 한줄로 붙히기

여러장을 슬라이드로 붙히기



 

                                                                                                       

상단 메뉴에서 사진을 클릭하여 업로드 다음 포토업로더로 포스팅에 쓸 이미지를 첨부합니다. 일부러 크기가 제각각인 이미지를 임의로 선택하였습니다.




우측 옵션창에서 이미지를 확인해가면 원하는 이미지/사진을 컨트롤 클릭이나 시프트 클릭으로 중복 선택을 합니다. 위 이미지에서 저는 세장의 이미지를 선택하였고 그에따라 블록처리가 된 모습입니다.


옵션창의 기능은 순서대로

커서위치에 이미지 삽입 / 중간 정렬로 삽입 / 좌측정렬로 삽입 / 우측정렬로 삽입

두장을 일렬로 삽입 / 세장을 일렬로 삽입 / 슬라이드 쇼 삽입 / 오디오 삽입

입니다.


저는 세장의 사진을 선택하였으니 우측에서 세번째에 위치한 세장을 일렬로 가운데 삽입을 선택하겠습니다.


위 이미지에서 보시는 것 처럼 보기 흉하게 들어가 버립니다. 하지만 걱장하지 마시고 이제 각각의 사이즈를 수정해 주시면 됩니다. 

위 첨부된 세장의 이미지의 경우 세로폭이 제각각으로 보기 흉하므로 기준이 되는 이미지의 크기를 선택을 한후 수정을 하시면 되는데 여기서 중요한 것이 가장 작은 것으로 기준을 잡아야 예쁘게 정렬되어 배치가 됩니다. 


세장중에 가장 세로폭이 작은 세번째 사진을 기준으로 이미지크기를 조절해 보겠습니다.


가장 작은 이미지를 클릭하여 선택한후에 세로 높이를 확인합니다. 155px이 나오네요.

기억해 둡니다. 

                                                                                                        



이 부분이 중요합니다. 수정/편집을 하시고 난 후에 옵션창의 확인을 누르시거나 다른 이미지를 클릭하게 되면 편집/수정이 취소가 됩니다.

반드시 글쓰기의 빈공간을 클릭해야 합니다.                                                                                                       



예쁘고 깔끔하게 정렬되어 배치된 이미지입니다. 삽입된 이미지는 본문에서는 클릭시 원본이미지로 보여주게 됩니다.

해당 설정은 관리자모드 > 멀티미디어 > Light TT EX(이미지 크게보기)에서 설정이 선행되어야 합니다.




위의 이미지 편집은 수정이 되더라도 원본자체는 첨부가 되어있습니다. 이 말은 수정된 이미지를 지우더라도 첨부 이미지는 계속해서 남아 있기때문에 잘 못돼더라도 추가로 이미지를 첨부할 필요가 없으며 여러번 반복 가능합니다.

                                                                                                         



이런식으로 크기가 각각 다른 세장의 사진을 보기 좋게 나열하였습니다.



추가 옵션 티스토리 블로그 이미지 정렬하기 2장 배치하기 ▼                                                                                         




추가 옵션 티스토리 블로그 이미지 정렬하기 3장 배치하기   

 

            


추가 옵션 티스토리 블로그 이미지 정렬하기 슬라이드쇼 만들기   



슬라이드 삽입의 경우 글쓰기 편집화면에서 클릭하여 선택한 후에 너비와 높이를 수정할 수 있고 이미지 순서를 배치할 수 있습니다.                                                                                                          




 

◆ 비슷한 글


[Tip!] 포스트 썸네일 대표이미지를 내맘대로 선택해보자 - 블로그 운영팁


[Tip!] 블로그 사이트 방문자수를(방문객) 늘리는 방법


[Tip!] 이미지에 마킹,화살표,글자 쓰기 - 스키치(Skitch)


[Tip!] 온라인에서 gif 생성 및 편집 - EZGIF(gif 자르기,만들기,용량줄이기)


[Tip!] 작지만 강력한 이미지 콜라주 편집 툴 - 피카사


[Tip!] 작지만 강력한 이미지 편집 툴 - 포토스케이프(이어붙이기/페이지/GIF)


[Tip!]가볍지만 강력한 이미지 편집 툴 - 페인트닷넷



더 많은 블로그 / 인터넷 관련 팁을 확인하시려면 블로그 사이드바 상단의 검색창에 "Tip"이라고 검색하시면 됩니다.