본문에 추가한 광고들을 CSS 한줄로 안보이게 하기...

안녕하세요. 행복을 노래하는 초매입니다.

요즘 블로그머니에서 게시글을 작성하거나 댓글을 작성하면서, 인맥과 여러 정보들을 얻으면서, 수익도 얻고 있는데요. 블로그 머니 회원분이 자유게시판에 이런 글을 올리셨더라구요.

 

구글 애드센스에서도 '광고 삭제'가 있었으면 좋겠어요.
모바일에 넣었던 광고를 일일이 다 지워버리는 게 정말 일이네요. 모바일에서 뺴고 싶으면…
'광고 삭제'가 있으면 기존에 있는 광고도 다 삭제가 될텐데 말이죠...

본문에서 삽입한 스크립트를 일괄적으로 삭제하는 방법은 없습니다.

 

만약 자신이 운영하는 사이트가 있고, 본문의 내용이 DB화되어 있어서 일괄적으로 수정할 수 있다면 가능하겠지만, 티스토리나 네이버 블로그처럼 정형화된 사이트는 이러한 기능이 없죠. ( 혹시나 있으면 따끔하게 충고해주세요... ㅎㅎㅎ )

 

그러면, 본문에 나오는 광고를 삭제할 수 없다면, 일괄적으로 안보이게 할 수는 없을까?

 

있습니다.... 있을껄요? ^^ㆀ

 

▶ 본문에 나오는 광고에 class나 id 를 지정하자

제 블로그를 예를 들어 설명하겠습니다. 수익형 블로그인 티스토리의 경우 광고를 추가하는 경우가 많은데요. 글이 어느 정도 마무리가 되고, 광고성 스크립트를 추가하여, 포스팅에 대한 노력의 보상을 간접적으로 받는다고 해야 할까요? 광고성 글을 본문에 추가하는 경우가 많은데, 요즘 늘어나는 모바일 접속자들을 위한 배려가 아닐까 생각하네요. ㅎㅎㅎ 아무튼 우측 상단 HTML 을 눌러서 스크립트를 추가할 준비를 합니다.

 

 

▲ 스크립트를 추가하기 위해 HTML 모드를 선택합니다.

 

저는 보통 본문 최하단에 스크립트를 위치시켜, 본문 하단에 광고가 보이도록 설정을 하는데요. 보통 추가할 때 태그 혹은 스크립트만 복사하는 경우가 많습니다. 그렇게 되면 메인 HTML/CSS 에서 이 광고에 대해서 컨트롤 할 수가 없겠죠? 이런 광고들을 컨트롤 하고 싶다면, 각각 광고마다 div 태그로 감싼다음, class 혹은 id 를 지정해주면, 메인 HTML/CSS 에서도 컨트롤 할 수가 있습니다.

▲ 스크립트를 본문에 추가합니다.

 

참고로 HTML, Tag, CSS, Script 라는 용어를 모르신다면, 죄송하지만 어느 정도 개념을 잡고 포스팅을 보시는게 좋을 듯 합니다. ( 죄송합니다... 넘 건방 떨었죠? ^^ㆀ )

 

일단 저는 DIV 태그에 CSS class를 각각 nesker_bottom, rc_square1 이라고 지정해두었습니다. 그러면, 이러한 스크립트는 어떠한 모양으로 보이게 될까요?

 

▲ 네스커와 리얼클릭 광고

 

위 이미지와 같이 네스커가 먼저 나오고, 리얼클릭 광고가 나오게 되어 있습니다. 태그나 스크립트의 경우 순서대로 실행되는 것이 원칙이니까 말이죠. 자~! 그럼... 리얼클릭 광고를 더 이상 노출하기 싫을 때는 어떻게 할까요? 본문에 추가했던 모든 광고 스크립트를 일일이 HTML 모드에서 삭제하는 방법도 있지만, 저는 메인 HTML/CSS 에서 보이지 않게 설정하는 방법을 택하겠습니다. 일단 안보이게 하고 나서 시간 될 때마다 하나씩 삭제하는 재미도 쏠쏠하거든요...ㅎㅎㅎ

 

▶ 관리자 메뉴의 HTML/CSS 에서 CSS 한줄을 추가하자

일단 메인 HTML/CSS 로 들어가기 위해서는 관리자 메뉴로 접근을 해야 겠죠? 티스토리의 경우 관리자 버튼으로 들어간 다음 좌측에 HTML/CSS 편집 이라는 링크가 있고, 그것을 누르면 HTML과 CSS를 수정할 수 있는 편집 화면이 나오실 겁니다.

 

▲ 관리자 메뉴 - HTML/CSS 편집

 

참고로 skin.html 은 화면을 구성하고 있는 뼈대와 살을 모아둔 것이며, style.css 는 이러한 뼈대와 살에 옷을 입히는 과정이라고 보시면 됩니다. 어설픈 비유가 더 어려우신가요? 그럼 PASS ~ 

 

▲ CSS 한줄 추가

 

자... 리얼클릭 광고를 안보이게 하기 위해서 style.css 에 한줄을 추가해보도록 하겠습니다. 예전에도 비슷한 글을 작성했었는데요. 바로 display 스타일이 핵심이죠. 리얼클릭 광고 스크립트를 div 로 감싸고 class를 지정했잖아요. CSS 부분에 .rc_square1 이라는 클래스 스타일 정보에 display : none; 스타일을 지정해두면, 리얼 클릭 광고는 더이상 보이지 않을 것입니다. 아래 이미지를 보세요.

 

▲ 화살표 위치에 있어야 할 광고가 사라졌습니다.

짜잔~ 본문에 일일이 들어가서 광고를 삭제를 하는 것보다 훨씬 쉽죠~잉... 이것이 바로... 꼼수...ㅋㅋㅋ 이렇게 시간을 번 다음, 삭제 하고 싶은 날이나 시간에 본문에 들어가서 스크립트를 깔끔하게 삭제해 주시면 되겠습니다.

 

블로그머니의 회원님이 살짝 요청하셔서, 잠은 오지만 급하게 정리해봤네요. 부족하거나 살짝 궁금한 내용이 있으시면, 댓글 남겨주세요. 너무 기초적인것은 시간이 많이 걸리니 PASS ... ^^

 

이상, 초매였습니다.