티스토리 블로그에 검색창(네이버,다음,구글) 넣는 방법

자신이 운영중인 블로그에 '검색창'이 없는 블로그는 거의 본적이 없을꺼에요^^

 

사실 티스토리 블로그 스킨들도 그 나름대로의 검색창 기능을 제공해주고 있지만 검색내용들이 해당 검색어을 포함한 목록보여주기에 지나지 않습니다. 사실 모양도 그렇게 예쁘거나 화려하지도 않구요.

 

 

그래서 혹시 우리가 흔히 사용하는 포털사이트..네이버, 다음, 구글 등의 검색창을 가져와서 블로그에 집어넣어볼 수는 없을까? 하고 생각했었는데..역시 방법이 있더라는 ㅎㅎ

 

이 소스들을 사용한 검색창으로 검색을 하면 자신의 블로그속 글들이 해당 포털사이트에서 제대로 검색되고 있는 파악까지 가능하답니다.

 

그럼 먼저 국내 최대 포털사이트 '네이버' 검색창을 티스토리 블로그로 넣는 방법에 대해서 알아보도록 하죠..

 

위와 같이 실제로 네이버와 똑같은 검색창처럼 보여졌으면 참 좋았을텐데..그 소스는 없는 것 같습니다. 물론 html에 대해서 잘아시는 분은 똑같이 만들 수도 있겠지만요.

 

이 소스가 네이버 검색창 소스라고 합니다.. 제일 윗부분에 보면 seach.naver라고 보이시죠? 이 소스에서 우리가 수정해져야 하는 부분은 '블로그주소'하나뿐이에요^^

 

저기 보이는 '블로그주소'에 'http://티스토리 블로그 주소'를 넣어주고 원하는 위치에 이 소스를 삽입만 하면 되겠죠.

 

그리고 검색창 오른쪽에 있는 검색버튼위에 노출되는 글자도 변경이 가능합니다..'검색'이라고 된 부분을 원하는 글자로 바꿔주면 되니까요.

 

현재 이 블로그 오른쪽 상단에 있는 검색창의 모습입니다..

 

네이버, 다음, 구글 검색창 소스 모두..실제로 적용하면 이런 모습이라서 사실 검색하기 전에는 구분하기가 어려워요 ㅎㅎ 그 중에서도 네이버 검색창 소스를 적용해두었습니다.

 

예를 들기위해서 '엑셀'이라는 검색어를 검색해보면 위와 같이 네이버 블로그탭의 검색결과 페이지가 나타납니다..

 

위에서 이야기 했지만 이렇게 검색창을 설정해두면 자신이 정성스럽게 쓴 블로그 글이 해당 검색어로 제대로 노출되고 있는지 파악이 가능합니다.

 

게다가 방문자가 검색을 해서 다시 또 다른 포스팅으로 들어와 페이지뷰가 상승할 가능성도 자연스럽게 커지게 되겠죠.

 

그리고 이건..포털사이트의 검색창을 적용하기 이전에 있던 기본 검색창이에요~ 검색버튼도 없고 아주 심플하죠? 가운데 seach라는 글자만 보일뿐..

 

티스토리 블로그에 검색창(네이버,다음,구글) 넣는 방법

 

 

기본 검색창의 소스를 살펴보면 위와 같습니다. 이 소스는 너비크기에 따라서 자동적으로 길이가 맞춰지더라구요..직접 너비 조정이 가능한지는 모르겠군요.

 

빨간 밑줄친 부분은 검색창 내부에 기본적으로 표시되는 글자입니다.. seach라고 써도 되고 검색이라고 써놔도 상관없다는~

 

이번에는 '다음'검색창입니다..역시 이렇게 원래의 다음 검색창처럼 나오게 만들수 있으면 좋을텐데..아직 없는 것 같습니다.

 

티스토리 블로그에 넣을 수 있는 다음 검색창 소스를 보면..네이버 검색창 소스와 거의 동일해요^^ 다른 점이 있다면 '블로그고유숫자'가 필요하다는 사실이죠.

 

그외 블로그주소는 당연히 바꿔줘야하구요..검색버튼 이름도 원하는대로 만들 수 있습니다.

 

블로그 고유 숫자는요 티스토리 블로그 html/css 편집화면에서 '파일업로드' 부분으로 가서 미리보기에 보이는 임의의 사진의 주소를 보면 쉽게 알 수 있어요.

 

해당 이미지의 url을 복사해서 메모장으로 옮겨보았는데..중간쯤에 보면 6자리 숫자가 보입니다..이게 바로 블로그 고유번호라고 하네요~ 이걸 복사해서 아까 봤던 다음 검색창 소스에 넣어주면 되겠죠.

 

그리고 마지막으로 구글 검색창입니다.. 개인적으로 저렇게 돋보기 모양의 버튼이 붙은 검색창을 만들고 싶은데..능력이 안되서 그 부분은 잘 모르겠습니다.

 

구글의 검색창 소스는 네이버, 다음과는 조금 구조가 다른 것 같더군요..

 

위 소스를 자세히 보면 site: 다음에 자신의 블로그 주소를 넣는 부분이 있는데~여기서 주의해야 할 사항은 http://를 반드시 뺀 주소를 넣어줘야 한다는 거죠..

 

그리고 input size라고 표시된 부분은 검색창의 길이구요.. 검색버튼 이름도 수정할 수 있습니다

 

여기까지 티스토리 블로그에 검색창(네이버,다음,구글)넣는 방법에 대한 이야기였는데요..종합해보면..이 검색창 소스들은 특정 포털사이트에서 자신의 블로그내 글들만 검색하게 해주는 기능입니다.

 

하지만 해당 소스를 적용했을때 곁모양은 모두 동일하고..검색결과 페이지로 바로 넘어가 버리기 때문에 새창으로 팝업하도록 할 수 없다는 사실..꼭 참고하세요~

 

블로그를 운영하는 본인의 취향에 따라 선택 적용하면 될듯합니다.^^

 

검색창소스모음.txt

다운로드

 

✅티스토리의 미래와 우려

티스토리의 미래와 우려

✅티스토리 반응형 스킨 '표만들기' 오류 해결법

티스토리 반응형 스킨 '표만들기' 오류 해결법

✅따라다니는 '플로팅배너' 만들기(반응형 블로그)

따라다니는 '플로팅배너' 만들기(반응형 블로그)

 

✅구글애드센스 블로그 상단,하단 '오른쪽'에 넣는 방법

구글애드센스 블로그 상단,하단 '오른쪽'에 넣는 방법