티스토리 블로그_사이드바에 배너 넣기

1. 배너로 사용할 이미지 파일 만들기

먼저 배너로 사용할 이미지 파일이 필요합니다. 저는 포토 스케이프 X를 이용하여 아래와 같은 이미지를 제작해 보았습니다.

가로 230 * 세로 101 px로 제작하였습니다. 가로 사이즈는 사용 중인 스킨의 사이드바 가로 사이즈에 맞춰서 제작하시면 됩니다. (사용 중이신 스킨 사이드바 가로 사이즈를 모르신다면 아래 1-2의 글을 참고하세요.) 세로 사이즈는 본인의 취향껏 넣으시면 됩니다.

1-1. PhotoScape X

포토 스케이프 X는 무료 툴이고, 윈도우뿐만 아니라 맥 버전의 프로그램도 배포하고 있습니다. 다른 이미지 생성 툴 쓰시는 게 있다면 그걸로 디자인을 하셔도 되고, 저처럼 포토 스케이프를 사용하는 것도 좋습니다.

PhotoScape X 다운로드 바로가기

PhotoScape X for Mac and Windows 10

History There is a mouse issue in macOS ( Mojave 10.14.0 ~ 10.14.3 and Catalina 10.15 ). A fix for this will be available shortly. --> * Version 4.2.1 (Jan 21, 2022) * Version 4.2 (Jan 16, 2022) (PhotoScape X 4.2 for Windows 10 will be released very soon)

x.photoscape.org

1-2. 내 스킨에 맞는 배너 사이즈 확인하기

사용 중인 스킨의 사이드바 너비를 모르시는 경우, 아래 블로그 글을 참고하세요.

티스토리 블로그_내 스킨에 맞는 배너 가로 사이즈 초간단 확인 방법

안녕하세요? 돈굴 파는 돈더지입니다. 내 티스토리 블로그에 배너를 추가하려고 보니, 적절한 배너 사이즈가 뭔지 알아야겠더라고요. 내가 넣고자 하는 위치의 가로(혹은 세로) 사이즈를 쉽게

moneymole.tistory.com

2. 이미지 발행하기

이미지 제작이 완료되었다면 블로그에 이미지를 업로드한 후 발행해 주세요. "이미지 주소"를 얻기 위해 발행하는 것입니다. 발행한 글로 들어가 해당 이미지를 오른쪽 클릭한 후 "이미지 주소 복사"를 눌러주세요.

3. 사이드바에 배너 넣기

3-1. 플러그인

사이드바에 배너를 넣으려면 "배너 출력" 플러그인을 사용하고 있어야 합니다. "블로그 관리" - "플러그인"에서 "배너 출력" 플러그인을 "적용"해줍니다.

3-2. 사이드바에 배너 넣기

"블로그 관리" - "꾸미기" - "사이드바"에 들어갑니다. "[플러그인] 이미지 배너출력" 옆의 + 버튼을 누르면 사이드바 1, 2, 3 중 원하는 위치를 선택할 수 있습니다. 배너를 넣고자 하는 위치를 골라 클릭합니다.

"이미지 배너출력"이라는 팝업창이 뜹니다. "이름"은 내가 알아보기 쉬운 이름을 적당히 넣어주세요. "이미지 URL"에는 아까 발행한 이미지 우클릭으로 복사해 두었던 "이미지 주소"를 붙여 넣어 주면 됩니다. "연결할 URL"에는 배너를 클릭했을 때 이동할 사이트 주소를 넣어주시면 됩니다. "사용자 모듈에 저장"에 체크하면 저장한 값이 "사용자 모듈"로 추가되어 삭제 후 재등록할 때 같은 상황에 용이합니다. 칸을 다 채워주셨다면 "확인" 버튼을 눌러주세요.