본문 바로가기
블로그 관련

티스토리 - 구글 애드센스 광고 달기 1 - 하단 카테고리 옆에 달아보자.

J.hyun. 2017. 4. 15. 21:55

티스토리 - 구글 애드센스 광고 달기 1 - 하단 카테고리 옆에 달아보자.

다양한 정보를 전달해 드리려고 노력하는 블로그!!!

글과 사진 및 이미지 ▶ CopyLeft(C)
◎CopyLeft(C) 는 공유는 하시되 복사 붙여넣기가 아니라 내용을 응용하여 작성해서 가져가셔야 된다는 걸 알려 드립니다.
◎사진과 이미지 일부는 퍼온 것도 있음을 밝힙니다.

목차

애드센스를 하단 카테고리 옆에 달아보자.


티스토리 블로그를 하면 애드센스를 달게 되는데요. 다른 티스토리 블로그에서 보던 카테고리 오른쪽 옆에 애드센스를 달아보겠습니다.



위와 같이 카테고리 옆에 광고가 나오게 된다.

애드센스 HTML 코드를 작성한다.

우선 제일 중요한 것은 애드센스에서 광고코드를 가져와야 한다. 광고 코드에서 ‘개인 식별 코드’와 ‘광고 코드’를 아래의 소스에 적용하여 HTML/CSS 창에 넣어 주면 된다.

  • 아래의 이미지에서처럼 초록색은 개인식별코드 하늘색은 광고코드이다.



  • 아래는 애드센스 카테고리 오른쪽에 넣는 HTML 소스이다.
   <!--애드센스 - 카테고리 - 오른쪽 광고 시작 -->
   <div align="center">
 <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
 <ins class="adsbygoogle adslot_1"

 style="display:inline-block;"

 data-ad-client="ca-pub-개인식별코드"

 data-ad-slot="광고코드"></ins><script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
 </div>
</div>

<!--애드센스 - 카테고리 - 오른쪽 광고 끝 -->

애드센스 HTML 코드를 티스토리에 적용한다.

블로그 관리자에서 꾸미기 ▶ HTML/CSS 편집에 들어간다.
HTML 편집기를 클릭하고 CTRL+F로 “article_rep_desc” 를 검색한다.

아래의 이미지처럼 HTML 소스를 붙여 넣기 한다.



참고로 “article_rep_desc” 기준으로 위쪽은 본문의 상단에 위치할 광고를 넣는 곳이고 아래쪽은 하단 광고를 넣을 때 사용된다.

애드센스 CSS 코드를 적용한다.

  1. 블로그 관리자에서 꾸미기 ▶ HTML/CSS 편집에 들어간다.
  2. CSS를 클릭한다.
  3. 맨 아래쪽으로 내려가서 아래의 코드를 붙여 넣어준다.
    /*애드센스 - 카테고리 - 오른쪽 광고*/

@media (min-width:960px) { div.another_category {display:block;float:left;clear:both;
!important; max-width:495px;margin-top:0px;padding-bottom:5px;}} 
@media (min-width:960px) { .adslot_1 { width: 336px; height: 280px;} }
@media (max-width:960px) { .adslot_1 { width: 468px; height: 280px;} }
@media (max-width:468px) { .adslot_1 { width: 300px; height: 280px;} }
/*애드센스 - 카테고리 - 오른쪽 광고*/

‘max-width:495px’ 여기서 495는 자신의 맞게 사이즈를 조절해서 사용하면 된다. 필자의 경우는 그냥 붙여 넣기 하여 사용하였다.

%23%20%uD2F0%uC2A4%uD1A0%uB9AC%20-%20%uAD6C%uAE00%20%uC560%uB4DC%uC13C%uC2A4%20%uAD11%uACE0%20%uB2EC%uAE30%201%20-%20%uD558%uB2E8%20%uCE74%uD14C%uACE0%uB9AC%20%uC606%uC5D0%20%uB2EC%uC544%uBCF4%uC790.%0A@%28%24.%uBE14%uB85C%uADF8%29%5BMarxico%2C%20%uD2F0%uC2A4%uD1A0%uB9AC%5D%20%0A%0A%3Cp%3E%3Cfont%20color%3D%22%23ffffff%22%3E%3Cspan%20style%3D%22background-color%3A%20rgb%280%2C%20153%2C%20153%29%3B%20color%3A%20rgb%28255%2C%20255%2C%20255%29%3B%22%3E%uB2E4%uC591%uD55C%20%uC815%uBCF4%uB97C%20%uC804%uB2EC%uD574%20%uB4DC%uB9AC%uB824%uACE0%20%uB178%uB825%uD558%uB294%20%uBE14%uB85C%uADF8%21%21%21%3C/span%3E%3C/font%3E%3C/p%3E%0A%uAE00%uACFC%20%uC0AC%uC9C4%20%uBC0F%20%uC774%uBBF8%uC9C0%20%u25B6%20CopyLeft%28C%29%0A%u25CECopyLeft%28C%29%20%uB294%20%uACF5%uC720%uB294%20%uD558%uC2DC%uB418%20%uBCF5%uC0AC%20%uBD99%uC5EC%uB123%uAE30%uAC00%20%uC544%uB2C8%uB77C%20%uB0B4%uC6A9%uC744%20%uC751%uC6A9%uD558%uC5EC%20%uC791%uC131%uD574%uC11C%20%uAC00%uC838%uAC00%uC154%uC57C%20%uB41C%uB2E4%uB294%20%uAC78%20%uC54C%uB824%20%uB4DC%uB9BD%uB2C8%uB2E4.%20%0A%u25CE%uC0AC%uC9C4%uACFC%20%uC774%uBBF8%uC9C0%20%uC77C%uBD80%uB294%20%uD37C%uC628%20%uAC83%uB3C4%20%uC788%uC74C%uC744%20%uBC1D%uD799%uB2C8%uB2E4.%20%0A%0A---%0A%0A%23%23%20%uBAA9%uCC28%0A%5BTOC%5D%0A%0A%0A---%0A%0A%23%23%23%20%uC560%uB4DC%uC13C%uC2A4%uB97C%20%uD558%uB2E8%20%uCE74%uD14C%uACE0%uB9AC%20%uC606%uC5D0%20%uB2EC%uC544%uBCF4%uC790.%0A%0A%uD2F0%uC2A4%uD1A0%uB9AC%20%uBE14%uB85C%uADF8%uB97C%20%uD558%uBA74%20%uC560%uB4DC%uC13C%uC2A4%uB97C%20%uB2EC%uAC8C%20%uB418%uB294%uB370%uC694.%20%uB2E4%uB978%20%uD2F0%uC2A4%uD1A0%uB9AC%20%uBE14%uB85C%uADF8%uC5D0%uC11C%20%uBCF4%uB358%20%uCE74%uD14C%uACE0%uB9AC%20%uC624%uB978%uCABD%20%uC606%uC5D0%20%uC560%uB4DC%uC13C%uC2A4%uB97C%20%uB2EC%uC544%uBCF4%uACA0%uC2B5%uB2C8%uB2E4.%20%0A%0A%21%5BAlt%20text%5D%28./%uD2F0%uC2A4%uD1A0%uB9AC%20-%20%uCE74%uD14C%uACE0%uB9AC%20%uD558%uB2E8%201.jpg%29%0A%0A%uC704%uC640%20%uAC19%uC774%20%uCE74%uD14C%uACE0%uB9AC%20%uC606%uC5D0%20%uAD11%uACE0%uAC00%20%uB098%uC624%uAC8C%20%uB41C%uB2E4.%20%0A%0A%23%23%23%23%20%uC560%uB4DC%uC13C%uC2A4%20HTML%20%uCF54%uB4DC%uB97C%20%uC791%uC131%uD55C%uB2E4.%0A%uC6B0%uC120%20%uC81C%uC77C%20%uC911%uC694%uD55C%20%uAC83%uC740%20%uC560%uB4DC%uC13C%uC2A4%uC5D0%uC11C%20%uAD11%uACE0%uCF54%uB4DC%uB97C%20%uAC00%uC838%uC640%uC57C%20%uD55C%uB2E4.%20%uAD11%uACE0%20%uCF54%uB4DC%uC5D0%uC11C%20%27%uAC1C%uC778%20%uC2DD%uBCC4%20%uCF54%uB4DC%27%uC640%20%27%uAD11%uACE0%20%uCF54%uB4DC%27%uB97C%20%uC544%uB798%uC758%20%uC18C%uC2A4%uC5D0%20%uC801%uC6A9%uD558%uC5EC%20%20HTML/CSS%20%uCC3D%uC5D0%20%uB123%uC5B4%20%uC8FC%uBA74%20%uB41C%uB2E4.%0A%0A*%20%20%uC544%uB798%uC758%20%uC774%uBBF8%uC9C0%uC5D0%uC11C%uCC98%uB7FC%20%uCD08%uB85D%uC0C9%uC740%20%uAC1C%uC778%uC2DD%uBCC4%uCF54%uB4DC%20%uD558%uB298%uC0C9%uC740%20%uAD11%uACE0%uCF54%uB4DC%uC774%uB2E4.%0A%0A%21%5BAlt%20text%5D%28./%uD2F0%uC2A4%uD1A0%uB9AC%20-%20%uCE74%uD14C%uACE0%uB9AC%20%uD558%uB2E8%202.jpg%29%0A%0A*%20%uC544%uB798%uB294%20%uC560%uB4DC%uC13C%uC2A4%20%uCE74%uD14C%uACE0%uB9AC%20%uC624%uB978%uCABD%uC5D0%20%uB123%uB294%20HTML%20%uC18C%uC2A4%uC774%uB2E4.%0A%0A%0A%3C%21--%uC560%uB4DC%uC13C%uC2A4%20-%20%uCE74%uD14C%uACE0%uB9AC%20-%20%uC624%uB978%uCABD%20%uAD11%uACE0%20%uC2DC%uC791%20--%3E%0A%0A%0A%20%20%20%20%20%20%20%3C%21--%uC560%uB4DC%uC13C%uC2A4%20-%20%uCE74%uD14C%uACE0%uB9AC%20-%20%uC624%uB978%uCABD%20%uAD11%uACE0%20%uC2DC%uC791%20--%3E%0A%20%20%20%20%20%20%20%3Cdiv%20align%3D%22center%22%3E%0A%20%20%20%20%20%3Cscript%20async%20src%3D%22//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js%22%3E%3C/script%3E%0A%20%20%20%20%20%3Cins%20class%3D%22adsbygoogle%20adslot_1%22%0A%0A%20%20%20%20%20style%3D%22display%3Ainline-block%3B%22%0A%0A%20%20%20%20%20data-ad-client%3D%22ca-pub-%uAC1C%uC778%uC2DD%uBCC4%uCF54%uB4DC%22%0A%0A%20%20%20%20%20data-ad-slot%3D%22%uAD11%uACE0%uCF54%uB4DC%22%3E%3C/ins%3E%3Cscript%3E%28adsbygoogle%20%3D%20window.adsbygoogle%20%7C%7C%20%5B%5D%29.push%28%7B%7D%29%3B%3C/script%3E%0A%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%3C/div%3E%0A%20%20%20%20%0A%20%20%20%20%3C%21--%uC560%uB4DC%uC13C%uC2A4%20-%20%uCE74%uD14C%uACE0%uB9AC%20-%20%uC624%uB978%uCABD%20%uAD11%uACE0%20%uB05D%20--%3E%0A%0A%23%23%23%23%20%uC560%uB4DC%uC13C%uC2A4%20HTML%20%uCF54%uB4DC%uB97C%20%uD2F0%uC2A4%uD1A0%uB9AC%uC5D0%20%uC801%uC6A9%uD55C%uB2E4.%0A%0A%uBE14%uB85C%uADF8%20%uAD00%uB9AC%uC790%uC5D0%uC11C%20%uAFB8%uBBF8%uAE30%20%u25B6%20%20HTML/CSS%20%uD3B8%uC9D1%uC5D0%20%uB4E4%uC5B4%uAC04%uB2E4.%0AHTML%20%uD3B8%uC9D1%uAE30%uB97C%20%uD074%uB9AD%uD558%uACE0%20CTRL+F%uB85C%20%22article_rep_desc%22%20%uB97C%20%uAC80%uC0C9%uD55C%uB2E4.%20%0A%0A%uC544%uB798%uC758%20%uC774%uBBF8%uC9C0%uCC98%uB7FC%20HTML%20%uC18C%uC2A4%uB97C%20%uBD99%uC5EC%20%uB123%uAE30%20%uD55C%uB2E4.%20%0A%0A%21%5BAlt%20text%5D%28./%uD2F0%uC2A4%uD1A0%uB9AC%20-%20%uCE74%uD14C%uACE0%uB9AC%20%uD558%uB2E8%203.jpg%29%0A%0A%3E%20%uCC38%uACE0%uB85C%20%22article_rep_desc%22%20%uAE30%uC900%uC73C%uB85C%20%uC704%uCABD%uC740%20%uBCF8%uBB38%uC758%20%uC0C1%uB2E8%uC5D0%20%uC704%uCE58%uD560%20%uAD11%uACE0%uB97C%20%uB123%uB294%20%uACF3%uC774%uACE0%20%uC544%uB798%uCABD%uC740%20%uD558%uB2E8%20%uAD11%uACE0%uB97C%20%uB123%uC744%20%uB54C%20%uC0AC%uC6A9%uB41C%uB2E4.%0A%0A%23%23%23%23%20%uC560%uB4DC%uC13C%uC2A4%20CSS%20%uCF54%uB4DC%uB97C%20%uC801%uC6A9%uD55C%uB2E4.%0A%0A1.%20%uBE14%uB85C%uADF8%20%uAD00%uB9AC%uC790%uC5D0%uC11C%20%uAFB8%uBBF8%uAE30%20%u25B6%20%20HTML/CSS%20%uD3B8%uC9D1%uC5D0%20%uB4E4%uC5B4%uAC04%uB2E4.%0A2.%20CSS%uB97C%20%uD074%uB9AD%uD55C%uB2E4.%0A3.%20%uB9E8%20%uC544%uB798%uCABD%uC73C%uB85C%20%uB0B4%uB824%uAC00%uC11C%20%uC544%uB798%uC758%20%uCF54%uB4DC%uB97C%20%uBD99%uC5EC%20%uB123%uC5B4%uC900%uB2E4.%0A%0A%60%60%60%0A%20%20%20%20/*%uC560%uB4DC%uC13C%uC2A4%20-%20%uCE74%uD14C%uACE0%uB9AC%20-%20%uC624%uB978%uCABD%20%uAD11%uACE0*/%0A%0A@media%20%28min-width%3A960px%29%20%7B%20div.another_category%20%7Bdisplay%3Ablock%3Bfloat%3Aleft%3Bclear%3Aboth%3B%0A%21important%3B%20max-width%3A495px%3Bmargin-top%3A0px%3Bpadding-bottom%3A5px%3B%7D%7D%20%0A@media%20%28min-width%3A960px%29%20%7B%20.adslot_1%20%7B%20width%3A%20336px%3B%20height%3A%20280px%3B%7D%20%7D%0A@media%20%28max-width%3A960px%29%20%7B%20.adslot_1%20%7B%20width%3A%20468px%3B%20height%3A%20280px%3B%7D%20%7D%0A@media%20%28max-width%3A468px%29%20%7B%20.adslot_1%20%7B%20width%3A%20300px%3B%20height%3A%20280px%3B%7D%20%7D%0A/*%uC560%uB4DC%uC13C%uC2A4%20-%20%uCE74%uD14C%uACE0%uB9AC%20-%20%uC624%uB978%uCABD%20%uAD11%uACE0*/%0A%60%60%60%0A%3E%20%27max-width%3A495px%27%20%uC5EC%uAE30%uC11C%20495%uB294%20%uC790%uC2E0%uC758%20%uB9DE%uAC8C%20%uC0AC%uC774%uC988%uB97C%20%uC870%uC808%uD574%uC11C%20%uC0AC%uC6A9%uD558%uBA74%20%uB41C%uB2E4.%20%uD544%uC790%uC758%20%uACBD%uC6B0%uB294%20%uADF8%uB0E5%20%uBD99%uC5EC%20%uB123%uAE30%20%uD558%uC5EC%20%uC0AC%uC6A9%uD558%uC600%uB2E4.%0A%0A


저작자표시 비영리 동일조건

'블로그 관련' 카테고리의 다른 글

티스토리 - 구글 애드센스 광고 달기 3 - 본문 상단 오른쪽에 달아보자.  (0) 2017.04.15
티스토리 - 구글 애드센스 광고 달기 2 - 본문 상단 오른쪽에 반응형을 달아보자.  (0) 2017.04.15
티스토리 블로그 애드센스 승인을 받다.  (0) 2017.04.10
티스토리 - 구글번역과 검색엔진 등록으로 방문자늘리기  (0) 2017.03.30
에버노트는 나에게 어떤 의미일까?  (0) 2017.03.27

'블로그 관련' Related Articles

티스토리툴바