안녕하세요~ 오늘은 다음 애드핏을 pc 그리고 모바일에서 다른 사이즈의 광고가 송출되는 방법에 대해 알아보도록 하겠습니다. 이 방법은 애드핏 광고 뿐만 아니라 애드센스 광고도 적용이 가능합니다. 다른 타사 광고도 물론 가능하겠죠~자 그럼 지금부터 시작하도록 하겠습니다.
<!-- 에드핏 광고시작 -->
<br>
<div align="center">
<style>
.myads1 { display:none; }
.myads2 { display:block; }
@media(max-width: 729px) {
.myads2 { display:none; }
.myads1 { display:block; }
}
</style>
<span class="myads1">
<!-- 여기에 모바일용 광고코드를 삽입하세요-->
</span>
<span class="myads2">
<!--여기에 pc용 광고코드를 삽입하세요-->
</span>
</div>
<!-- 에드핏 광고끝-->
사용방법
1. 모바일용 광고를 300*250 사이즈로 하나 생성합니다.
2. 데스크탑용 광고를 728*90 사이즈로 하나 생성합니다.
3. 위 소스에서 <!-- 여기에 모바일용 광고코드를 삽입하세요--> 라는 주석 바로 아래에 모바일용 소스를 통째로 붙여넣으세요.
4. 위 소스에서 <!-- 여기에 pc용 광고코드를 삽입하세요--> 라는 주석 바로 아래에 데스크탑용 소스를 통째로 붙여넣으세요.
5. 여러분의 스킨에서 적당한 위치에 완성된 코드를 삽입하시면 됩니다.
이렇게 해서 다음 애드핏 광고를 반응형으로 설치하는 방법에 대해 알아보았습니다. 이 소스를 응용하면 다양하게 반응형으로 광고를 생성하실수가 있을겁니다. 바로 앞전에는 애드센스를 반응형으로 다는 방법을 알아보았는데요 그 방법은 자바스크립트를 이용했습니다. 이번 방법은 css 를 이용한 방법이라는게 차이점이겠네요~ 다음에는 더 유용한 자료로 찾아올것을 약속드리며 이만 줄이겠습니다~ ^^
공감♥ 은 고래도 춤추게 합니다~ ^^
댓글