블로그 정보들

HTML CSS, 애드센스 상단광고박스 색상변환

香港 2015. 7. 15. 13:29
반응형

 

6월말에 구글 애드센스 광고를 2차승인까지 받은 후에 다양한 방법으로 광고위치와 사이즈를 변경하면서 고수익을 올리기 위한 준비작업을 하고 있네요.

 

검색노출도 제대로 되지 않는 티스토리 블로그에 광고부터 신경을 쓰고 있다는 것은 참 못난 짓이나 다름없죠. 사실 이런 시간에 포스팅 갯수를 늘리고 방문자 유입에 더 신경을 써야 하는데 말입니다.

 

그걸 알면서도 광고수익에 대한 욕심이 강하고 나도 한번 멋지게 운영해서 최소한 아내가 일하는 금액만큼은 애드센스로 수익을 올려서 집에서 쉴 수 있도록 해주는 것이 목표이기 때문에 마음만 너무 앞서 가고 있습니다. 

 


애드센스 상단광고 2개 배치시 박스색상?


 

 

애드센스 자체광고의 박스색상에 문제가 있는 것은 아니고요. 기존 애드센스 고수분들이 가장 최적의 광고배치 조합중에 하나라고 하는 상단2개+하단1개 광고조합을 다른 블로그에 설치를 하였습니다.

그런데 내 블로그의 광고박스의 바탕색은 회색(Grey)으로 여간 신경이 거슬리는게 아녔어요. 아래 그림을 보면 알겠지만 광고2개를 배치한 박스의 바탕색이 회색인 것을 알 수 있을겁니다.

 

 

 

위 빨간색 박스안의 애드센스 광고 사이의 색상을 보면 회색바탕으로 실제 화면에서는 더 선명하게 보이게 됩니다.

 

앞서 포스팅을 보셨으면 알겠지만 현재 메인블로그 1개를 제외한 서브블로그는 애드센스 광고게재 사이트승인에 약간 문제가 있는지 제대로 구현이 안되고 노출도 잘 안되는 터인데 이런 것 까지 신경을 쓰게 만들으니 머리가 뽀개지네요.

 

 

그래서 아래와 같이 센스코리아에 바턍색을 하얀색으로 바꿔주는 방법을 질문을 했어요.

 

<센스코리아 질문>

 

 

하루가 지난 후에 센스코리아를 검색해보니 여타 실력자분들이 리플을 2개나 남겨주셨네요. 한번 확인해 보겠습니다.

<질문에 대한 답변>

 

티스토리 블로그의 언어체계인 html  및 css 를 배워야 겠다는 마음을 먹고 있는데 이런 답글들을 보고 가만히 있을 수가 없었죠. 당장 관리프로그램으로 들어가서 스킨 html과 css 소스코드를 편집을 해보기로 했어요.

 

 


 

티스토리 블로그 html css 스킨 소스 편집


 

 

힌트는 위에 리플 답글 2개이기 때문에 티스토리 스킨의 css 코드를 보아도 어디에 회색 바탕색을 지정했는지 알길이 전혀 없었어요. 그러나 궁즉통이라고 궁하면 통한다고 합니다.

 

background : #white 라는 말에 힌트를 얻어 <컨트롤+F>키를 누르고 background 를 찾아보니 CSS 소스 코드에 여러개의 background 가 뜨네요. 할 수 없이 일일히 색상을 바꾸고 미리보기를 누르면서 테스트를 해 보았습니다.

 

<드디어 찾아낸 애드센스 광고박스의 바탕색 회색의 주범>

 

 

#eee가 회색을 의미하는 색상코드가 맞았어요. 이 문제를 해결하기 위해 html 및 css의 색상코드표를 열심히 검색했는데 회색 코드는 올려놓은 곳이 없었거든요.

 

<화이트색상 코드인 #fff 를 기입하고 미리보기를 누른다>

 

검정색이 #fff 라는 것을 잘 몰랐지만 경험을 통해 #ffffff 는 화이트를, #000000 은 블랙이라고 생각했는데 eee가 3글자이므로 fff로 교체를 했습니다.

 

 

 

회색바탕을 백색으로 변경한 후 미리보기를 누른 상태의 애드센스 박스의 모습입니다. 자세히 보시면 바탕에 회색이 없어지고 스킨의 원래 바탕색인 화이트로 통일되었습니다.

 

 


html css 편집으로 애드센스 바탕색 테스트 


 

 

위와 같은 방법으로 애드센스 상단에 광고2개를 배치할 경우 박스의 바탕색을 변환해 줄 수 있다는 것을 알았어요. 그래서 내친 김에 다른 색상으로 바꾸는 것도 테스트를 해볼겸 해서 검정색 바탕으로 변환을 해보았어요.

 

<검정바탕용 #000 으로 편집>

 

 

<박스 바탕색이 검정색으로 변함>

 

html 및 css를 공부하는 사람들의 묘미가 이런 것 같습니다. 단순히 숫자 몇개를 바꿔주었을 뿐인데 이렇게 박스 안의 색상이 내가 원하는 대로 변환된다는 사실이 참 재미있군요.

 

앞으로도 더 열심히 html css 의 기초를 습득해서 내가 운영하는 블로그의 기본 설치 원리를 이해하고 어느정도 변경하고 운용할 수 있는 능력을 키워보려고 합니다. 앞으로도 좋은 실험이 있으면 자주 소개하겠습니다.

 

반응형