• 회원가입
  • 로그인
  • 구글아이디로 로그인

[money] 구글 애드센스 반응형 광고 크기 설정법

3,701  
화면 폭당 정확한 광고 크기의 예

반응형 사이트에 가장 잘 맞는 기기별 정확한 광고 단위 크기를 알고 있는 경우, 
CSS3 미디어 쿼리를 활용해 반응형 광고 단위의 크기를 설정 (조절, 통제)할 수 있습니다. 
다음 예를 통해 CSS3 미디어 쿼리를 사용하여 광고 코드를 수정하는 방법을 알아봅니다.


<style type="text/css">
.adslot_1 { width: 320px; height: 100px; }
@media (min-width:500px) { .adslot_1 { width: 468px; height: 60px; } }
@media (min-width:750px ) { .adslot_1 { width: 728px; height: 90px; } }
</style>
<ins class="adsbygoogle adslot_1"
    style="display:inline-block;"
    data-ad-client="ca-pub-1234"
    data-ad-slot="5678"></ins>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>


@media 규칙은 CSS3 구문이며, 모든 최신 브라우저에서 지원됩니다.
Internet Explorer 7 이하 버전과 같은 이전 브라우저를 지원하려면 먼저 기본 크기를 지정해야 합니다.
그러면 미디어 쿼리가 지원되지 않을 때도 광고가 게재됩니다.
외부 스타일시트에서 CSS로 광고 코드의 크기를 설정하는 기능은 공식적으로 지원되지 않습니다.

- 구글 애드센스 설명서 - 

분류 제목
vote 사이드메뉴 어느쪽이 좋을까? 3 설문 중
talk (비밀번호 : 1234) 클릭하라! 질러라! 클릭하면 행복하리라! 2
web 불법 복제물 링크 행위는 저작권법 위반 아니다.
web 의뢰자견적과 작업자견적 차이 (= 의뢰인과 제작자의 견적차이 = 개발자임금 = 작업임금 = 의뢰가격 = 의뢰…
life 삼성 갤럭시 스마트폰 국제전화 수신 차단
site 아미나 - 부트스트랩3 기반 (그누보드5・영카트5) 반응형 홈페이지빌더
web PHP - 중괄호로 변수를 감싸서 문자열 중간에 넣지 말기
pc 유튜브 플레이어 등 동영상 화면이 작업표시줄 위로 올라오는 증상 해결법
talk 크롬 최신버전으로 업데이트 - 한글버그 수정완료.
web 캐시제거 새로고침
talk 자꾸 누가 제 귤을 훔쳐 먹습니다. ㅡㅡ;; 3
web 코딩 야학 & 생활코딩 좌표 (코야 & 생코)
web (빌더・테마・스킨) 판매 라이선스 종류 (= 라이센스 종류) 및 가격표 (License Price)
news MBC 뉴스 홈페이지 개편 1
pc 장명옥 발송 저작권 위반 협박 이메일 첨부파일 주의보
money 구글 애드센스 반응형 광고 크기 설정법
dance 냥뇽녕냥 님의 섹시퀸 댄스
talk 환혼 그림자 살수 「낙수」 이름 유래
money 웹하드 파트너 활동 그만둘 때, 해촉증명서 받아야 하는 이유
life 올바른 공부 방법 (= 전교 1등이 공부 잘 하는 이유)
122/163
목록
찾아주셔서 감사합니다. Since 2012