티스토리 블로그에 구글 애드센스 맞춤검색 사이드바 추가하기

티스토리 블로그에 구글 애드센스를 적용하면서 항상 레이아웃 배치라던지 다른 블로그는 왜 저것들을 놓았을까? 하면서 의문을 품기도 하는데요. 얼마 전에 웹서핑을 하다가 블로그 사이드바에 구글 맞춤검색이 추가 되어있는 것을 보고 호기심이 생겼습니다. 처음에는 구글 맞춤검색 엔진이라는 사이트에서 맞춤 검색바를 만들어서 사이드바에 추가를 해보았는데요. 생각처럼 모양이 예쁘게 나오지 않고 볼품없이 나오는 것을 보고 조금 더 연구를 하기 시작했습니다. 지금 PC로 블로그를 보시는 분들은 우측 상단 사이드바에 구글 맞춤검색 엔진이 잘 들어가 있다는 것을 확인하실 수 있습니다.

티스토리 블로그에 구글 애드센스 맞춤검색 사이드바 추가하기

아마 어느정도 검색을 해보신 분들이라면 제가 밟았던 전철처럼 구글 맞춤검색 사이트를 통해서 적용을 시키시고 있으실텐데요. 애드센스 사이트에서도 해당 맞춤검색엔진을 만들어서 코드를 가져올 수 있습니다. 구글 애드센스 사이트를 자주 들어가서 둘러보는 편이지만 그 사이트에 있을줄은 꿈에도 몰랐던 것 같아요.

애드센스 사이트에 들어가시면 아무리 둘러봐도 자연스럽게 내 광고에 있는 콘텐츠 말고는 아무것도 없는 것 같습니다. 도대체 구글 맞춤검색엔진은 어디에서 만들고 코드를 가져갈 수 있는 것일까요? 저도 체음에는 한 5분 정도 헤매다가 겨우 찾았는데요. 구글에서 왜 이렇게 사이트를 만들었는지 모르지만 위의 사진에 보시는 것처럼 열려있는 콘텐츠 카테고리 클릭해서 닫아주시면 다른 목록들을 확인하실 수 있습니다. 

콘텐츠를 접어주니 위의 이미지처럼 AdMob, 검색, 광고스타일처럼 아까와는 다른 목록들을 확인할 수 있습니다. 저희는 이 중에서 구글 맞춤검색 엔진을 만들 것이기 때문에 검색 => 맞춤검색 엔진 => 새 맞춤검색 엔진을 클릭 해줍니다. 예전에도 딱히 사용했던 기억이 나지는 않는데 아마 애드센스를 처음 연동했을 때 만들어놓은 듯한 검색 엔진이 하나 등록이 되어있는 것으로 확인되는데요. 지금 블로그에 맞게 다시 만들어야하니 과감히 패스하겠습니다.

맞춤 검색엔진의 이름, 국가 또는 지역, 사이트언어를 기본적으로 설정해주시구요. 사용용도에 따라 검색창 스타일을 수정해주시면 되는데요. 저와 같은 Fastboot 스킨을 사용하시는 분들은 텍스트상자 길이를 25자 정도로 해주시면 좋습니다. 처음에 기본 세팅에는 55자로 세팅되어있어서 텍스트상자 길이가 넘쳐버리는 현상때문에 여러번 수정을 했던 기억이 나네요. 다 입력하셨다면 저장 및 코드 생성버튼을 클릭하셔서 코드를 복사 해놓으시구요.

코드를 복사하셨다면 티스토리 블로그 관리 페이지로 이동하셔서 꾸미기 => 사이드바로 들어가셔서 HTML 배너출력을 사이드바에 하나 추가를 해주시구요. 복사 해놓으신 소스를 붙여넣어 주시면 됩니다.
저의 경우에는 Fastboot 스킨을 이용하기 때문에 Fastboot를 이용하시는 분들은
<s_sidebar_element>
<div class="panel panel-default">
<h4 class="panel-heading"><i class="fa fa-comments"></i> Google Search</h4>
<div class="panel-body" style="text-align:center;">
<--구글 애드센스 코드 위치-->
</div>
</div>
</s_sidebar_element>

위와 같이 넣으시면 제가 사용하는 것처럼 동일하게 활용이 가능하십니다. 일일히 타이핑하시기에는 어려울 수 있으니 텍스트 파일로 첨부를 해드리니 참고하셔서 적용하시면 되실 듯해요. Google Search가 들어가 있는 타이틀 부분은 자유롭게 변경하시면 되구요. 이미지 배너출력이나 HTML 배너출력이 나오지 않으신 분들은 플러그인에 들어가셔서 활성화를 시켜주시면 됩니다.

Fastboot_구글_애드센스_맞춤검색_엔진_소스.txt

적용을 완료하셨다면 위의 이미지처럼 블로그 사이드바에 구글 맞춤검색이 적용되어 나타난다는 사실을 확인하실 수 있습니다. 그래도 Fastboot 스킨을 사용해서 타이틀 덕에 그나마 어울리는데요. 그냥 사이드바에 덩그러니 배치하려고 하신다면 미관상 보기 좋지 않을 것이기 때문에 안 넣는게 더 나을것 같기도 합니다. 구글 애드센스에서 맞춤검색 엔진을 제공하기 때문에 이곳에서 검색을 할 경우에도 일부의 수익이 있을 것이라는 생각이 드는데요. 적용한지 하루 밖에 되지 않아서 과연 어느정도나 도움이 될지는 모르겠지만 기대해보겠습니다.
이만 포스팅을 마치겠습니다.
안녕.

-관련글
[햄릿슈의 생활 정보] - 파비콘이란? 티스토리 블로그 파비콘(favicon) 만들기 및 적용 방법
[햄릿슈의 생활 정보] - 구글 애드센스 결제수단 추가 방법 (구글 애드센스 수익금 지급받는 방법)
[햄릿슈의 생활 정보] - 구글 드라이브 PC용 다운로드 및 사용법
[햄릿슈의 생활 정보] - 블로그에 유트부 동영상 자동재생, 반복재생으로 올리는 방법
[햄릿슈의 생활 정보] - 블로그에 활용가능한 저작권이 없는 해외무료이미지사이트
[햄릿슈의 생활 정보] - 티스토리 블로그 글씨체(폰트) 나눔고딕으로 간단하게 변경하기