카카오 애드핏 광고가 석 달 동안 안 뜬 이유 — 광고 칸 폭이 0이었다

7월에 블로그 글 본문에 카카오 애드핏 광고 자리를 두 곳 만들었다. 그 뒤 석 달 가까이 수익이 0원이었다. 방문자가 적어서 그렇다고 생각했고, 그 판단으로 글 하나를 정리하기도 했다.

틀린 판단이었다. 9월 말 다른 페이지에 같은 광고를 붙이다가 원인을 찾았다. 광고 칸의 폭이 0이었다. 광고 요청은 매번 나갔지만, 요청에 적힌 광고 칸 폭이 0이라 애드핏이 광고를 줄 수 없었다.

결론부터 적는다.

증상	원인	고친 것
요청은 나가는데 광고가 안 옴	광고 칸 부모가 display:flex 가운데 맞춤	부모를 블록으로, 광고 칸에 폭 300px
나중에 만든 광고 칸이 비어 있음	스크립트가 처음 로드될 때만 칸을 찾음	로드 뒤 adfit.render(칸) 직접 호출

1. 어떻게 알아냈나

광고가 안 뜰 때 먼저 볼 곳은 브라우저 개발자 도구의 네트워크 탭이다. 애드핏은 광고를 받을 때 serv.ds.kakao.com 으로 요청을 보낸다. 요청이 아예 없으면 스크립트 문제이고, 요청이 있으면 그 안의 값을 봐야 한다.

우리 경우는 요청이 있었다. 요청 주소 안에 이런 값이 들어 있었다.

containerwidth=0

광고 칸 요소의 크기를 재 보니 블로그 글의 광고 칸 두 개가 모두 0×0이었다. 광고 안에 들어가는 iframe 은 하나도 없었다. 300×250 광고를 폭 0짜리 칸에 넣을 수는 없으니, 광고가 오지 않는 게 당연했다.

2. 왜 폭이 0이 됐나

광고 칸을 가운데에 두려고 부모 요소에 이렇게 적어 두었다.

.ad-slot {
  display: flex;
  justify-content: center;
}

흔한 가운데 맞춤이다. 문제는 그 안의 광고 칸(<ins class="kakao_ad_area">)이 처음에는 비어 있다는 점이다. 광고가 들어오기 전의 빈 요소가 flex 아이템이 되면, 내용 폭만큼 줄어든다. 내용이 없으니 0이 된다.

그런데 애드핏 스크립트는 광고를 요청하기 전에 칸의 폭을 잰다. 0을 재서 보내면 들어갈 광고가 없다고 판단한다. 광고가 와야 칸이 커지고, 칸이 커야 광고가 오는데, 순서가 거꾸로 막혀 있었다.

3. 고친 방법

부모를 블록으로 바꾸고, 광고 칸에 폭을 직접 적었다.

.ad-slot {
  display: block;
  text-align: center;
}
.ad-slot ins.kakao_ad_area {
  width: 300px;
  margin: 0 auto;
}

가운데 맞춤은 margin: 0 auto 로 똑같이 된다. 차이는 광고가 오기 전에도 칸이 300px 이라는 것 하나다.

4. 두 번째 함정 — 나중에 만든 칸

블로그 글의 광고 칸은 글을 그린 뒤 코드로 끼워 넣는다. 그런데 애드핏 스크립트(ba.min.js)는 불러오는 순간 페이지에 있던 칸만 찾아서 채운다. 그 뒤에 생긴 칸은 지나친다.

그래서 스크립트를 불러온 다음, 칸마다 직접 그리라고 알려 줬다.

script.onload = () => {
  document
    .querySelectorAll("ins.kakao_ad_area")
    .forEach((ins) => window.adfit?.render(ins));
};

React 나 Next.js 처럼 화면을 나중에 그리는 페이지라면 이 함정에 걸리기 쉽다.

5. 결과

같은 수정을 먼저 적용한 페이지에서 300×250 광고가 실제로 떴다. 블로그 글에도 같은 수정을 넣었다. 지금은 요청에 폭이 제대로 실려 나간다.

다만 요청이 정상이라고 매번 광고가 차는 건 아니다. 광고를 채울지는 애드핏이 정한다. 한 번 비어 있다고 버그는 아니다. 확인할 건 "요청의 폭이 0이 아닌가"까지다.

6. 확인할 때 주의할 것 두 가지

• 자동화 브라우저로는 확인이 안 된다. Playwright 같은 자동화 브라우저에서는 애드핏이 요청조차 하지 않았다. 확인은 평소 쓰는 브라우저로 했다.
• 내 광고를 새로고침으로 반복 확인하지 않는다. 본인이 광고를 반복해서 띄우거나 누르면 무효 트래픽으로 잡힐 수 있다. 한두 번 열어 네트워크 탭의 요청 값만 본다.

정리 — 광고가 안 뜰 때 볼 순서

순서	볼 것	이렇게 나오면
1	네트워크 탭에 광고 요청이 있나	없으면 스크립트 로드·칸 생성 순서 문제
2	요청의 containerwidth	0이면 칸 폭 문제(부모 flex 의심)
3	광고 칸 요소 크기	0×0이면 칸에 폭을 직접 준다
4	칸을 코드로 나중에 만드나	그렇다면 로드 뒤 adfit.render
5	위가 모두 정상인데 비어 있나	애드핏 배정 쪽 결정 — 기다린다

석 달 동안 "방문자가 적어서"라고 생각했다. 숫자가 0일 때는 적은 게 아니라 막힌 것일 수도 있다. 0이 나오면 먼저 요청 하나를 열어 본다.