티스토리 사이드바 광고 사이즈 조절[크기 조절하기]

티스토리 사이드바에 광고 추가하는 방법에대해 알아보았습니다.

 

그런데 몇일이지나 핸드폰(모바일)으로 블로그 구경을해보니 사이드바에 추가한 광고가 게시글을 덮어버리는 현상이 발생되더라구요.

 

고민끝에 해결을하고 그 해결방법을 공유드리고자 왔습니다!!!

 

아래 사진은 모바일 접속시 사이드바 광고가 게시물의 일부를 덮어버린 상태입니다.

 

 

제목도 가려졌고 스크롤을 아래로내리면 내용도 다 가려집니다^^

 

이래서는 제가 올린 정보글들이 다 가려져 무용지물이 되겠죠?ㅎㅎ

 

저와같은 증상이 있으시다면 아래 순서를 보시고 차례로 따라해보시기 바랍니다^^

 

1. 모바일이아닌 데스크탑, 노트북을 이용하여 해당 블로그에 접속한뒤 사이드바에 있는 광고를 우측클릭하여 속성을 클릭한다.

 

 

2. 속성안에 픽셀크기를 확인합니다.

 ㄴ 가로크기가 299라는 자동광고가 삽입되었는데요, 광고 크기를 더 줄이면 해결되지않을까싶습니다. 

 

 

3. 애드센스에 접속한뒤 내광고 -> 광고단위 -> 새광고 단위를 순서대로 클릭한다.

 

애드센스 주소 :  https://www.google.co.kr/adsense/start/#/?modal_active=none

 

 

4. 그러면 아래사진처럼 애드센스 광고를 만들수있는 광고분류가 나타납니다.

1) 텍스트 및 디스플레이 광고를 선택해 줍니다. 

 

 

5. 그러면 이름, 광고크기, 광고유형을 선택할수있는 창이 생성됩니다.

1) 이름은 원하시는제목 넣으시고 광고크기의 게재 -> 권장크기를 클릭합니다.

2) 그다음 직사각형을 눌러주시고, 336*280, 300*250, 250*250, 200*200, 180*150중이서 250*250을 선택하여 줍니다.

3) 저장 및 코드 생성을 클릭합니다.

 

 

 

 

 

6. 그러면 광고 코드가 생성되는데 광고코드 안에있는 코드를 전체선택하여 복사 및 닫기를 눌러줍니다.

 

 

7. 광고는 생성하였으니, 블로그에 기존광고를 수정하여줍니다.

1) 블로그 관리에 접속한후 좌측 중간에 있는 꾸미기 -> 사이드바를 클릭합니다.

 

 

8. 화면 우측에 사이드바1 -> HTML 배너출력의 편집을 클릭합니다.

 

9. 기존 HTML 소스를 삭제한후 복사한 250*250 광고코드를 붙여넣기한후 확인을 클릭합니다.

 

 

10. 아래의 사진처럼 광고 크기가 변경된것을 확인하실수 있습니다.

 

 

 

첫번째 사진은 PC버전에서 접속한 사진입니다.

기존 좌측에서 변경된 우측광고크기가 보이시죠?

빨간 테두리만큼 크기가 줄어들었습니다^^

 

두번째 사진은 모바일(핸드폰)에서 접속한 사진입니다.

기존 좌측에서 변경된 우측사진을 보시면 튀어나온 광고가 감쪽같이 사라졌습니다^^

 

이로써, 모바일(핸드폰)으로 보시는 방문자들이 조금더 정확한 정보를 볼수있게 되었습니다^^

 

위 순서대로 해주신다면, 큰 어려움없이 해결하실수있으시며, 궁금한 사항은 댓글 달아주시면 친절히 답해드리겠습니다.

 

그럼, 오늘도 좋은하루 보내시기 바랍니다^^