구글 애드센스 검색 폼 자유롭게 꾸미기
|
|
구글 애드센스 검색 폼 자유롭게 꾸미기
구글 애드센스 검색 폼 자유롭게 꾸미기
구글 애드센스 검색 폼 자유롭게 꾸미기
기존 구글 애드센스 검색 폼을 자유로운 방법으로 수정해서 사이트와 좀 더 잘 어울리게 꾸미는 방법을 알려드리고자 합니다.
기존 검색 폼 코드는 아래와 같이 텍스트박스 가로 크기만 쉽기 수정할 수 있는데 CSS 코드에 적용해서 텍스트박스 크기를 좀 더 자유롭게 수정할 수 있습니다.
<form action="http://www.google.co.kr" id="cse-search-box" target="_blank">
<div>
<input type="hidden" name="cx" value="partner-pub-?" />
<input type="hidden" name="ie" value="UTF-8" />
<input type="text" name="q" size="55" />
<input type="submit" name="sa" value="?" />
</div>
</form>
먼저 위에 있는 div는 아무것도 없이 비어있는데 여기에 일단 이름을 지어주는 겁니다.
<div class="adsence">
길지 않는 단어를 지정해 주고 CSS 수정란에서 새로운 코드를 삽입해 주면 되는 거죠.
.adsence 를 적으면 검색 폼 전체에 해당되는 부분을 수정 할 수 있고
.adsence .text 를 적으면 텍스트박스만 수정 할 수 있습니다.
아래와 같이 CSS 수정란에 입력해 주면 가로 사이즈를 좀 더 세밀하게 px 단위로 조절할 수 있습니다. 그리고 기존에 있던 size="55"는 지워 줍니다.
이 방법 외에도 CSS에서 사용되는 여러 가지 코드로 수정할 수 있지만 적용되지 않는 부분이 많아 보이는데 외부적으로 더 꾸미려면 테이블 소스를 이용하면 좋을 거 같습니다. (단, 너무 과도하게 변형해서 구글 애드센스 정책에 위반되는 수준까지는 만들지 않는 것이 좋겠죠.?)
.adsence {margin:0px 0px 0px 0px;}
.adsence .text {width:100px;}
구글 애드센스 검색 폼으로 많은 수익을 얻을 수 있는 부분은 아니겠지만 사이트에 좀 더 잘 어울리게 적용해서 방문자들이 적극 활용할 수 있도록 도와주는 것도 나쁘지 않은 방법이라고 생각합니다.
구글 애드센스 검색 폼 자유롭게 꾸미기