[티스토리 애드센스 수익화 준비 시리즈3편] 반응형 광고 삽입하는 법 – 모바일에서도 깔끔하게 보이게!

광고를 붙이긴 했는데…
모바일에서 글보다 광고가 더 커 보여서 불편하다거나,
광고가 깨지거나 짤려 보이는 문제를 겪으신 적 있나요?

이런 문제는 대부분 ‘반응형 광고’가 제대로 설정되지 않았을 때 생깁니다.
이번 글에서는 PC/모바일 모두에서 자연스럽게 노출되는 반응형 광고 삽입법을 알려드릴게요!

---

1. 반응형 광고란?

기기의 화면 크기에 따라 광고 크기가 자동 조절되는 광고 형식이에요.

구분	고정형 광고	반응형 광고
크기	정해진 사이즈만 보여짐	화면에 맞춰 자동 조절
디자인	깨지거나 밀릴 수 있음	자연스럽고 깔끔함
추천도	낮음	매우 높음 (추천)

특히 요즘은 모바일 방문자가 더 많기 때문에,
반응형 광고는 사실상 필수입니다!

 

---

2. 반응형 광고 단위 생성 방법

1. 애드센스 접속 > [광고] > [광고 단위 만들기]
2. 광고 유형: 디스플레이 광고
3. 크기: 반응형(R) 선택
4. 이름 입력 > 코드 복사

이제 이 코드를 티스토리에 삽입하면 되는데,
스킨 구조나 스타일에 따라 약간의 CSS 조절이 필요할 수도 있어요.

---

반응형

3. 티스토리에 반응형 광고 삽입하기

기본적으로는 2편에서 설명한 방식과 같아요.
단, 디자인이 깨지지 않게 하려면 아래처럼 박스(div)로 감싸는 게 좋습니다.

```html

4. 광고가 너무 커보일 때? 이렇게 수정하세요!

문제: 모바일에서 광고가 너무 커서 글 흐름을 방해함

해결: max-width 속성을 추가해서 크기를 제한

 

5. 반응형 광고 삽입 팁

• 글 중간 삽입 시: 문단 끝과 자연스럽게 연결되도록 위치 조절
• 모바일 미리보기로 반드시 확인
• 광고 위치별 수익 분석은 추후 애드센스에서 확인 가능 수익이 왜 안 나는지 분석하는 팁들을

 

 

초보 눈높이에 맞춰 알려드릴게요!