[5초만에 해결] 티스토리 모바일 화면에서 광고 깨질 때 대처법

반응형

[5초만에 해결] 티스토리 모바일 화면에서 광고 깨질 때 대처법

모바일에서 애드센스 광고가 깨져 보이거나 화면을 밀어내는 현상, 겪어보셨죠?
CSS 한 줄로 광고 박스를 반응형으로 만들어 깨짐을 예방해보세요! 📱✨

💻 광고 영역 반응형 설정 CSS 코드

아래 코드를 CSS 편집에 삽입하면 모바일에서도 광고가 자연스럽게 줄어듭니다.

.revenue_unit_wrap, ins.adsbygoogle {
  max-width: 100%;
  height: auto !important;
  box-sizing: border-box;
  overflow: hidden;
}

• max-width: 화면 폭을 넘지 않게 제한
• height: auto: 광고 비율 유지
• overflow: hidden: 잘린 광고 숨김 처리

---

📌 적용 위치는?

• 관리자 > 꾸미기 > 스킨 편집> html 편집> CSS 편집
• 맨 아래에 위 코드 붙여넣고 저장!

---

📱 광고 가로폭 고정이 필요할 때

광고 크기를 고정하고 싶다면 아래처럼 width를 직접 지정해도 돼요.

ins.adsbygoogle {
  width: 320px;
  max-width: 100%;
  display: block;
  margin: 0 auto;
}

❓ 자주 묻는 질문 (FAQ)

Q. 이 코드를 넣으면 광고가 안 나올 수도 있나요?
A. 아닙니다. 광고 출력은 유지되며 레이아웃만 반응형으로 조절됩니다.

Q. 스킨마다 다르게 적용되나요?
A. 북클럽, 오디세이 등 주요 스킨에서는 동일하게 작동하나, class명이 다를 수 있으니 개발자 도구로 확인해보세요.

🔗 함께 보면 좋은 글

• [5초만에 해결] 글 폭 조절하는 방법
• [5초만에 해결] 마우스 우클릭 방지 코드

💡 파워걸의 팁!
광고 영역을 너무 좁게 설정하면 클릭률이 떨어질 수 있어요.
항상 PC + 모바일 미리보기로 함께 확인하고 적용하세요.

이 글이 도움 되셨다면?
공감 💙과 공유로 파워걸을 응원해주세요!

💗 공감하기 📤 공유하기