처음 카카오 애드핏 광고 승인받아서 너무 기쁜 나머지 부랴부랴 광고 스크립트를 적용한 기억이 난다. 적용한 후 나도 드디어 돈 버나? 하면서 내 블로그 폰으로 보는데.. 이게 멍미.. 광고가 막 잘려서 나오는 거 아닌가.. 블로그가 모바일이란 걸 광고가 인식 못하나?? 라는 생각부터 내가 뭘 잘못했나 까지 오만가지 생각과 신경이 쓰여서 여기저기 찾아보니 먼가 반응형 모바일 블로그에 카카오 광고가 지원을 못하는 그런 느낌을 받았다. 그래서 아래 스크립트를 공유하려고 한다.
모바일 광고 잘림
구글 애드센스는 PC로 보나 모바일로 보나 알아서 크기 딱딱 잡아주는데.. 카카오.. 아직 멀었구나..ㅠㅠ 하반기때 달라지길 기대해본다... ^^
광고 생성(PC/모바일)
먼저 사용할 광고를 생성해야 합니다. KakaoAdFit에 접속 후 광고를 2개 만드셔야 합니다.
- PC용 : 728 X 90
- 모바일용 : 320 X 50
스크립트를 만드면 안에 data-ad-unit 부분을 복사 해 두셔야 합니다. 모바일용/PC용 코드가 다르니 반드시 구분지어서 복사해두셔야 합니다!!
스크립트 만들기
아래 올려놓으신 스크립트를 받으신 후 아까 복사해두신 ID를 붙여 넣으시면 됩니다.
<script>
if (window.matchMedia("( min-width: 1024px )").matches == true) {
document.write(
'<div align="center"><ins class="kakao_ad_area" style="display:none;" data-ad-unit = "PC용 광고 코드 넣기" data-ad-width = "728" data-ad-height = "90"></ins> <script type="text/javascript" src="//t1.daumcdn.net/adfit/static/ad.min.js" async><\/script></div><br>'
);
}
if (window.matchMedia("( max-width: 768px )").matches == true) {
document.write(
'<ins class="kakao_ad_area" style="display:none;" data-ad-unit = "모바일용 광고 코드 넣기" data-ad-width = "320" data-ad-height = "50"></ins> <script type="text/javascript" src="//t1.daumcdn.net/adfit/static/ad.min.js" async><\/script><br>'
);
}
</script>
스크립트 적용
완성된 코드는 블로그 관리 → 플러그인 에 접속 후 Daum AdFit(PC)에서 상/하단 코드 부분에 입력해 주시면 됩니다.
마무리
지금은 이렇게 사용자가 코드로 구분을 해 줘야 하지만 나중에는 알아서 잘 크기가 반영이 되게 반응형 광고가 나오지 않을까 싶습니다. 그때까지만 유용한 방법이길 바라구요. 하루빨리 카카오 애드핏도 애드센스처럼 많은 기능과 수익성이 좋이 지면 좋겠습니다 ^^
[ 티스토리 관리 꿀 TIP 모음 ]
2020/07/28 - [정보/블로그] - 제가 사용하는 스킨은요 (feat. 서브 메뉴 여백 주기)
2020/08/01 - [정보/블로그] - 티스토리 스킨 편집 쉽게하는 팁 (F12의 마법)
2020/08/01 - [정보/블로그] - 티스토리 글 구글 검색 누락 등록 방법 (구글 노출)
2020/08/02 - [정보/블로그] - 티스토리 사진/이미지 가로로 배열하기 (2개 이상 나란히 놓기)
2020/08/03 - [정보/블로그] - 블로그 최적화 도움 사이트 모음 (last updated 20.08.04)
2020/08/04 - [정보/블로그] - 카카오 애드핏 (Kakao AdFit) 가입 신청 및 적용하기
2020/08/05 - [정보/블로그] - 카카오 애드핏 (Kakao AdFit) 심사 하루만에 결과가 나오네요
2020/08/07 - [정보/블로그] - 블로그 후원 서비스 '도네리카노' 적용하기 (티스토리에 기부/후원 버튼 만들기)
2020/08/11 - [정보/블로그] - 티스토리용 블로그 소통/품앗이 창구 - 티스토리 포럼 활용하기!
2020/08/12 - [정보/블로그] - 티스토리 '서식' 기능 활용해서 글 작성 효율 200% 높이기
2020/08/14 - [정보/블로그] - 티스토리 블로그 본문 [테이블 가운데 정렬] & [링크 새창열기] 적용 방법
2020/08/18 - [정보/블로그] - 23일만에 구글 애드센스 한번에 통과했습니다!! (8/11 신청)
2020/08/20 - [정보/블로그] - 구글 애드센스(AdSense) & 카카오 애드핏(AdFit) 한달만에 승인 후기 & 꿀팁 정리
2020/08/23 - [정보/블로그] - 티스토리 블로그 빙(Bing)에 검색 등록 / 노출 시키는 방법
2020/08/28 - [정보/블로그] - 티스토리 블로그 쿠팡파트너스/카카오애드핏 사각형 광고 2개 넣기(PC: 2개, 모바일: 1개)
2020/08/29 - [정보/블로그] - 티스토리 블로그 구글 애드센스 모바일 자동광고 <앵커, 모바일 전면 광고> 넣기
2020/08/29 - [정보/블로그] - 티스토리 블로그 [링크 모음] PC/모바일 본문 너비에 따른 다이나믹 서식 불러오기
'정보 > 블로그' 카테고리의 다른 글
| 티스토리 블로그 구글 애드센스 '광고 노출 관리'를 통한 최적화 및 수입 올리는 방법! (광고 심사 센터 활용) (7) | 2020.09.04 |
|---|---|
| 블로그 8월 결산 - 첫 애드센스/애드핏 수익 후기 (20) | 2020.09.02 |
| 티스토리 블로그 [링크 모음] PC/모바일 본문 너비에 따른 서식 불러오기(feat. 다이나믹 서식) (0) | 2020.08.29 |
| 티스토리 블로그 구글 애드센스 모바일 자동광고 <앵커, 모바일 전면 광고> 넣기(본문 상/하단 팝업 광고, 화면 전환 광고) (0) | 2020.08.29 |
| 티스토리 블로그 쿠팡파트너스/카카오애드핏 사각형 광고 2개 본문/상단/하단 넣기(PC: 2개, 모바일: 1개) (6) | 2020.08.28 |
