티스토리 검색창 글자 크기변경하는 방법

2012. 2. 7. 20:10컴퓨터/블로그 만들기

반응형
티스토리 블로그 스킨은 처음 배우기는 어렵지만 스킨을 적용하여
화면에 나타나는 결과를 보면 재미 있는 일이기도 합니다.

제가 블로그 검색창을 사이드바에 달아 놓았다 드롭다운 메뉴바가 있어
굳이 사이드바가 필요 없을 것 같아 검색창을 본문에 넣기도
하였답니다.

본문에 넣었던 글 바로가기 :
애드센스 상단 2개 광고를 응용한 다양한 스킨 적용
 
그러나 문제는 본문에 넣은 검색창이 저의 블로그의 글들을 검색을 할  수 없는
 아무런 반응이 없었답니다. 즉 검색창에 글자는 입력이
되는데 검색버튼을 클릭하면 검색으로
글을 찾지 못한 것을 발견하고
발행한 그 글에 정정사항으로
알려드렸답니다.

본문에 넣은 검색창은 어느 하나의 글과 같은 글에 불과하므로 다른 글을
그글에서 가져오지 못하나 봅니다. 더구나 박스안에 묶어 넣어 두었으므로
 원인은 잘 알지 못하지만 이런 경험도 하게 되었답니다.

그런데 구글 맞춤 검색창은 본문에서 박스 밖에 넣어 두었는지 모르지만
검색이 됩니다.(자기 블로그에서 검색하면 안되지만 실험으로
한번 검색하여보았답니다.)

오늘 말씀드리려는 요점은 티스토리 검색창의 글자 크기를 변경하는
방법을 알아봅니다. 저의 블로그에 검색창 박스는 사이즈가
23px정도의 크기였는데 8px 크지로 나타나
아주 불편했답니다.

그문제를 해결하기 위해 style.css에 cursor:pointer; font-size:23px 를 추가하여
티스토리 검색창의 글자의 크기변경하는 방법을 알게 되었답니다.
저의 스킨은 여러번 변경하며 이어져 왔기 때문에 아래와 
같은 searchBox에 cursor:pointer; font-size:23px

를 추가하니 검색창에 정상으로 나타납니다.

style.css의 검색창 소스
searchBox {  text-align:right; }
#searchBox input         { width: 250px; height:30px; border:2px solid #0000FF; margin-bottom: 3px; vertical-align: middle;cursor:pointer;
 font-size:23px
;}
#searchBox .submit       { background:url(images/검.gif) no-repeat; width: 60px;  height:28px; text-indent:-5000px; border:14; cursor:pointer; vertical-align: middle; }
style.css

스킨을 삽입하거나 조절 할때는 반드시 미리보기합니다.


티스토리 블로그는 스킨마다 style.css의 검색창 소스나 그외 여러가지 소스가
전부 동일하지 않으므로 나타나는 결과는 아주다르게 나타 나기 때문에
숙달되지 않으면 함부로 바꾸면 안됩니다.

다만 검색창의 사이즈나 오늘 말씀드린 검색창의 글자크기등은 숫자만 바꾸어 주면
되기 때문에 검색창을 저와 같이 크기를 변경 할 경우  style.css에서
cursor:pointer; font-size:23px를 찾아 23px 에서
필요한 숫자만 바꾸면 됩니다.

현재 녹색주택 블로그 검색창



또 한가지 말씀드리는 것은 검색창이 저의 블로그처럼 중앙에 오게 하려면  
skin.html에서 searchBox를 찾아 <center>, </s_search>를
넣어 중앙에 오게합니다.
이 소스 역시 블로그 스킨을 수정하면서 주의 하시기 바랍니다.

저의 경우 footer아래 검색창 모듈을 넣어 답니다.
<div id="footer">
<!-- 검색 모듈 -->
<div id="searchBox">
<center> 
<s_search>
<input type="text" name="" value=""
 onkeypress="if (event.keyCode == 13) { }"/>
<input value="검색" type="buttonh_" onclick=""
class="submit"/>
</s_search>
</div>
</center><br>  

<center>와 </s_search>로 검색창을 감싸면 검색창이 중앙으로 옵니다.

제가 스킨에 관한 글을 올려드리는 것은 전문적인 지식으로 알려드리는 것이
 아닙니다. 다만 스킨을 수정하거나 정정하면서 이 부분은 
티스토리 운영자들이 알고 있으면 다양한 스킨에 응용
 할 수 있을 것같아 부족하지만 말씀드렸습니다.   

검색창.txt


반응형