Study Everyday :)

티스토리 본문 중간에 광고 쉽게 넣는 법 본문

티스토리

티스토리 본문 중간에 광고 쉽게 넣는 법

은세 2017. 11. 26. 21:38

안녕하세요 ~ 티스토리에서 구글 애드센스를 포스팅 중간에 넣는 법을 쉽게 알려드릴려고 합니다.


블로그 포스팅을 보다보면 본문 중간에 광고가 들어간 글들을 보신 적이 있으실텐데요

광고 넣는 법은 어렵지 않아요 !



1. 구글 애드센스에서 본문 중간에 들어갈 새 광고 단위를 만든다.


구글 애드센스에 가입 되셔서 광고를 만들어보셨다면 금방 만드실 수 있으실거에요.






일단 저는 광고 이름은 포스팅 중간 큰 모바일 배너라고 지었습니다.

어떤 광고 크기를 해도 상관은 없는데 저는 반응형 블로그라서

너무 큰 광고 크기를 하면 모바일에서는 포스팅 글을 볼 때 별로더라고요.


광고 크기는 마음에 드시는걸로 설정하고 만드시면 됩니다.





그렇게 만든 새 광고 단위의 코드를 복사합니다.



2. 블로그 관리자 페이지에서 HTML/CSS 편집을 열어서 코드를 붙여넣기 한다.


HTML 편집 하는 곳에서 </body> 부분 바로 위에


1
2
3
<div id="post_adv">
<!-- 구글 애드센스 코드를 여기에 넣으세요 -->
</div>
cs



구글 애드센스 코드를 <div> 안에 넣습니다.

<div id="post_adv">


부분에서 id 는 원하시는 이름으로 넣으셔도 됩니다.

id="원하는 이름"

저는 임의로 post_adv 이라고 붙여 넣었습니다.



본문에서 광고가 나올때 중간에 위치하게 하고 싶으시면



1
2
3
<div id="post_adv" style="text-align: center;">
<!-- 구글 애드센스 코드를 여기에 넣으세요 -->
</div>
cs



style을 저렇게 넣어주시면 됩니다.





</div> 가 끝나는 곳 아래에   (</body> 위에) 


1
2
3
<script>
  document.getElementById('adv').appendChild(document.getElementById('post_adv'))
</script>
cs



저 코드를 넣습니다.


앞으로 본문 중간에서 광고를 넣으려면 필요한 코드입니다. 

저희는 앞으로 글을 쓸때 id  가 adv 가 들어가는 태그를 넣어서 광고를 중간에 넣을 겁니다.


코드를 다 넣으셨으면 저장을 누릅니다.




3. 블로그 포스팅을 할때 광고를 넣는다.



블로그 포스팅을 할때 중간에 광고를 넣으시면 됩니다.






포스팅을 할 때 HTML을 눌러줍니다.


글을 쓰다가 광고를 넣고싶은 위치에


1
<div id="adv"></div>

cs



저 코드를 넣어줍니다.







저 코드를 넣어줍니다. 라고 쓴 글 밑에 코드를 넣었는데

제 포스팅을 보면 광고가 뜨는 것을 보실 수 있으실 겁니다.



이렇게 블로그 포스팅을 하실때 본문 중간에 광고를 넣으시면 됩니다.

도움이 되셨으면 좋겠어요

좋은 하루 되세요 ~








Comments