본문 바로가기

Q&A/지식백과

티스토리 블로그 검색창 만들기 소스

티스토리 블로그 검색창 소스

 

 

 

① skin.html

<div class="article_search">
  <input type="text" class="article_search_field" name="search" value="" onkeypress="if (event.keyCode == 13) { try{window.location.href='/search/' + document.getElementsByName('search')[0].value.replaceAll('%', '%25');document.getElementsByName('search')[0].value = ''; return false;}catch(e){} }" id="article_search" />
  <input type="submit" class="article_search_submit" value="검색" onclick="try{window.location.href='/search/' + document.getElementsByName('search')[0].value.replaceAll('%', '%25');document.getElementsByName('search')[0].value = ''; return false;}catch(e){}" />
</div>

 

①번 소스는 skin.html 편집화면에서 원하는 위치에 붙여넣기 하면 된다.

 


 

② style.css

 

.article_search{margin:10px auto;text-align:center}
.article_search_field, .article_search_submit{border:solid 5px #0000FF;font-size:1.0em}
.article_search_field{width:85%;height:20px;padding-left:5px;padding-top:2px}
.article_search_submit{width:10%;height:30px;background-color:#0000FF;color:#fff}

 

 

②번 소스는 style.css 편집창의 맨 아래에 붙여준다. 굵은 글씨체는 색상을 의미하는데 다른 색상으로 하려면 색상표를 검색하여 색상코드를 변경하면 된다.