본문 바로가기

블로그 이야기/애드센스

티스토리 포스트 중간에 애드센스 광고를 적용시켜보자!

안녕하세요 토로토 입니다.



저번에 애드센스 광고 신청 및 티스토리 블로그에 광고를 적용시키는 방법에 대해서 알려드렸는데요, 오늘은 포스트 중간에 광고를 넣는 방법에 대해서 알려드리려 합니다. 포스트 중간에 광고를 넣기 위해서는 플러그인이 아니라 HTML/CSS 기능을 사용해야하기 때문에 조금 더 복잡합니다.



먼저 html/css 를 수정하기 전에 준비해야할 준비물이 필요합니다. 

당연하게도 새로운 광고 단위가 필요합니다. 만약 광고단위 만드는 방법을 모르시는분은 이전 글을 참조하시기 바랍니다.


그 다음 아래 첨부파일을 받아주세요

열어보면 아래 사진과 같이 되어있을겁니다.

여기에서 "여기에 광고 코드를 복사해 주세요" 부분에 광고단위 코드를 복사해주시면 됩니다.


그 다음에는 티스토리 블로그 관리페이지로 가서 "꾸미기" > "HTML / CSS 편집" 으로 들어가 줍시다.


이렇게 생겼습니다.


여기에서 "

안녕하세요 토로토 입니다.



저번에 애드센스 광고 신청 및 티스토리 블로그에 광고를 적용시키는 방법에 대해서 알려드렸는데요, 오늘은 포스트 중간에 광고를 넣는 방법에 대해서 알려드리려 합니다. 포스트 중간에 광고를 넣기 위해서는 플러그인이 아니라 HTML/CSS 기능을 사용해야하기 때문에 조금 더 복잡합니다.



먼저 html/css 를 수정하기 전에 준비해야할 준비물이 필요합니다. 

당연하게도 새로운 광고 단위가 필요합니다. 만약 광고단위 만드는 방법을 모르시는분은 이전 글을 참조하시기 바랍니다.


그 다음 아래 첨부파일을 받아주세요

열어보면 아래 사진과 같이 되어있을겁니다.

여기에서 "여기에 광고 코드를 복사해 주세요" 부분에 광고단위 코드를 복사해주시면 됩니다.


그 다음에는 티스토리 블로그 관리페이지로 가서 "꾸미기" > "HTML / CSS 편집" 으로 들어가 줍시다.


이렇게 생겼습니다.


여기에서 "" 을 찾아줍시다 ("Ctrl + F " 를 사용하시면 편합니다.).

아까 만든 코드를  아래에 붙여넣기 해 줍시다. 



이제 기본 준비가 끝났습니다.

이제는 포스트를 작성하면서 원하시는 위치에 광고를 삽입해 주는 일만 남았습니다.


먼저, 편의를 위해서 광고를 넣을 위치에 표시를 해 둡시다.

저는 aaa 를 적어 넣었습니다.

그 다음 우측 상단에 있는 "HTML" 버튼을 클릭해 줍시다.


그러면 이렇게 html 창이 뜨는데요, 여기서 아까 적었던 표시 (aaa) 를 찾아 줍시다.

aaa 대신 <div id="adsense"></div> 라고 적어넣어주면 광고 삽입이 됩니다.


글쓰기 창에서는 나타나지 않지만 발행을 하고 나면 이렇게 광고가 원하는 나타납니다.


다만 여기서 아쉬운점은 모든 포스트마다 이렇게 일일이 작업을 해주어야 한다는 것 입니다. 아직까지는 티스토리에서 따로 플러그인을 만들어주지 않아서 매번 이렇게 번거롭게 작업을 해야합니다. 만약 글을 쓸때 html 창에서 코드를 삽입하는것을 까먹으셨다면 포스트 제일 하단에 광고가 하나더 추가로 뜨게 될것입니다. 만약 까먹으셨다면 언제든지 포스트를 수정하시면 됩니다.



이상으로 포스팅을 마치겠습니다.



댓글과 공감은 큰 힘이 됩니다!

도움이 되셨다면 아래 공감 버튼을 꾹! 눌러주세요!

" 을 찾아줍시다 ("Ctrl + F " 를 사용하시면 편합니다.).

아까 만든 코드를 

안녕하세요 토로토 입니다.



저번에 애드센스 광고 신청 및 티스토리 블로그에 광고를 적용시키는 방법에 대해서 알려드렸는데요, 오늘은 포스트 중간에 광고를 넣는 방법에 대해서 알려드리려 합니다. 포스트 중간에 광고를 넣기 위해서는 플러그인이 아니라 HTML/CSS 기능을 사용해야하기 때문에 조금 더 복잡합니다.



먼저 html/css 를 수정하기 전에 준비해야할 준비물이 필요합니다. 

당연하게도 새로운 광고 단위가 필요합니다. 만약 광고단위 만드는 방법을 모르시는분은 이전 글을 참조하시기 바랍니다.


그 다음 아래 첨부파일을 받아주세요

열어보면 아래 사진과 같이 되어있을겁니다.

여기에서 "여기에 광고 코드를 복사해 주세요" 부분에 광고단위 코드를 복사해주시면 됩니다.


그 다음에는 티스토리 블로그 관리페이지로 가서 "꾸미기" > "HTML / CSS 편집" 으로 들어가 줍시다.


이렇게 생겼습니다.


여기에서 "" 을 찾아줍시다 ("Ctrl + F " 를 사용하시면 편합니다.).

아까 만든 코드를  아래에 붙여넣기 해 줍시다. 



이제 기본 준비가 끝났습니다.

이제는 포스트를 작성하면서 원하시는 위치에 광고를 삽입해 주는 일만 남았습니다.


먼저, 편의를 위해서 광고를 넣을 위치에 표시를 해 둡시다.

저는 aaa 를 적어 넣었습니다.

그 다음 우측 상단에 있는 "HTML" 버튼을 클릭해 줍시다.


그러면 이렇게 html 창이 뜨는데요, 여기서 아까 적었던 표시 (aaa) 를 찾아 줍시다.

aaa 대신 <div id="adsense"></div> 라고 적어넣어주면 광고 삽입이 됩니다.


글쓰기 창에서는 나타나지 않지만 발행을 하고 나면 이렇게 광고가 원하는 나타납니다.


다만 여기서 아쉬운점은 모든 포스트마다 이렇게 일일이 작업을 해주어야 한다는 것 입니다. 아직까지는 티스토리에서 따로 플러그인을 만들어주지 않아서 매번 이렇게 번거롭게 작업을 해야합니다. 만약 글을 쓸때 html 창에서 코드를 삽입하는것을 까먹으셨다면 포스트 제일 하단에 광고가 하나더 추가로 뜨게 될것입니다. 만약 까먹으셨다면 언제든지 포스트를 수정하시면 됩니다.



이상으로 포스팅을 마치겠습니다.



댓글과 공감은 큰 힘이 됩니다!

도움이 되셨다면 아래 공감 버튼을 꾹! 눌러주세요!

아래에 붙여넣기 해 줍시다. 



이제 기본 준비가 끝났습니다.

이제는 포스트를 작성하면서 원하시는 위치에 광고를 삽입해 주는 일만 남았습니다.


먼저, 편의를 위해서 광고를 넣을 위치에 표시를 해 둡시다.

저는 aaa 를 적어 넣었습니다.

그 다음 우측 상단에 있는 "HTML" 버튼을 클릭해 줍시다.


그러면 이렇게 html 창이 뜨는데요, 여기서 아까 적었던 표시 (aaa) 를 찾아 줍시다.

aaa 대신 <div id="adsense"></div> 라고 적어넣어주면 광고 삽입이 됩니다.


글쓰기 창에서는 나타나지 않지만 발행을 하고 나면 이렇게 광고가 원하는 나타납니다.


다만 여기서 아쉬운점은 모든 포스트마다 이렇게 일일이 작업을 해주어야 한다는 것 입니다. 아직까지는 티스토리에서 따로 플러그인을 만들어주지 않아서 매번 이렇게 번거롭게 작업을 해야합니다. 만약 글을 쓸때 html 창에서 코드를 삽입하는것을 까먹으셨다면 포스트 제일 하단에 광고가 하나더 추가로 뜨게 될것입니다. 만약 까먹으셨다면 언제든지 포스트를 수정하시면 됩니다.



이상으로 포스팅을 마치겠습니다.



댓글과 공감은 큰 힘이 됩니다!

도움이 되셨다면 아래 공감 버튼을 꾹! 눌러주세요!