개별 게시판에 검색창 달기 > 그누보드5 팁자료실

그누보드5 팁자료실

개별 게시판에 검색창 달기 정보

개별 게시판에 검색창 달기

본문

게시글의 내용물이 장문일 때 개별 게시판에 검색창을 다는 소스입니다.

 

view.skin.php 에서 아래의 소스를 찾습니다. 본문 부분이지요.

 

<div id="bo_v_con"><?php echo get_view_thumbnail($view['content']); ?></div>

 

상단이나 하단에 아래의 소스를 첨가합니다.

 


<script>
searchZone = "bo_v_con"; 
startMode = true;
function basicData() {
    if (startMode) {
        startHtml = this[searchZone].innerHTML;
        delete startMode;
    }
}
function searchData() {
    if (searchInput.value.trim() != "") {
        this[searchZone].innerHTML = startHtml.split(searchInput.value.trim()).join("<strong style=color:#c00000>" + searchInput.value.trim() + "</strong>");
        searchDiv.innerHTML = "<strong style=color:#c00000>" + (startHtml.split(searchInput.value.trim()).length - 1) + "</strong>개 검색";
    }
}
function startData() {
    this[searchZone].innerHTML = startHtml;
    searchInput.value = searchDiv.innerHTML = '';
}
</script>
<table cellpadding=10 cellspacing=0>
    <td><input id=searchInput></td>
    <td><button style=cursor:pointer onmouseover=basicData() onclick=searchData()>검색하기</button></td>
    <td style=width:100px><div id=searchDiv></div></td>
    <td><button style=cursor:pointer onmouseover=basicData() onclick=startData()>처음으로</button></td>
</table>

 

현재 꾸미기는 목불인견 수준이니 css 는 본인들이 알아서 꾸며 쓰세요.ㅜㅠ...

 

988289629_1625145218.0138.jpg

 

개별 게시판별로 달리 적용하고 싶으면...

여분필드로 체크박스나 라디오버튼을 만들어 값을 넘기고 view.skin.php 에서 조건문으로 통제해 주면 되겠습니다. 

 

---------------------

 

2021년 7월 2일 09시 45분에 좀 더 활용하기 편한 소스로 바꾸었습니다.

추천
15
  • 복사

댓글 17개

김철용 홈페이지 자기소개 아이디로 검색 전체게시물 회원게시물 21.07.02 01:48:23
좋은 기능 공개해주셔서 감사합니다.
코드중에 <table>부분은 좀 해보겠는데, 자바스크립트는 제 능력 밖이라는 생각이 듭니다.
공개해주신 코드를 자유게시판(free)  view.skin.php 파일의
<div id="bo_v_con"><?php echo get_view_thumbnail($view['content']); ?></div>
윗부분에 붙여넣기 하니까 검색창이 게시글 윗부분에 나타나고 검색이 잘 됩니다.
http://pws.co.kr/bbs/board.php?bo_table=free&wr_id=28
그런데, 비타주리님의 성경보기스킨(bible_basic)의 view.skin.php파일의
<div id="bo_v_con"><?php echo get_view_thumbnail($view['content']); ?></div>
이 부분 앞에 붙여넣기해도 맨 아래에 검색창이 나타납니다.
성경보기에서는 검색기능이 잘 되지 않습니다.
올려주신 이미지를 보면은 성경보기에서 검색기능이 잘 되는데요.
테스트를 해보고 올리신 것이라 생각이 됩니다
제가 적용을 잘 못한 것 같습니다
아래 둘레아빠님도 잘 되는데요....
스킨을 본다고 어디 잘못 건드린 것 같다는 생각이 듭니다
감사합니다.^^
http://pws.co.kr/bbs/board.php?bo_table=bible_update&wr_id=2

비타주리 자기소개 아이디로 검색 전체게시물 회원게시물 21.07.02 10:01:06

소스를 보면...
이건 bo_v_con 이라는 아이디를 가진 엘레먼트 내의 정보를 검색하여 총 갯수를 토해내고 검색어를 <strong style=color:#c00000>검색어</strong> 로 html 을 치환하겠다는 의미입니다.

일반게시글을 사용할 때 그 게시글은 <div id=bo_v_con></div> 이라는 div 안에서 표현됩니다. 따라서 일반게시글(아마도 99%)의 경우는 위 소스로 사용을 하는 게 맞구요.

제 성경게시판이나 아니면 <div id=bo_v_con></div> 이외의 엘레먼트에서 표현되는 컨텐츠는 그 아이디를 찾으셔야지요.

제 성경게시판에서 인클루드된 list.php 나 sample.php 의 소스를 보면...
textBible 이라는 아이디를 가진 td 에서 성경텍스트가 표현되기 때문에... 공개 소스 중 두번째 줄 searchZone = "bo_v_con"; 를 아래처럼 고쳐야 합니다.

searchZone = "textBible";

그리고 그 위치도 view.skin.php 에서 인클루드 코드가 있는 아래의 부분을 찾아서

<?php
$bible_txt = $view['file'][0]['path']."/".$view['file'][0]['file'];
$bible_image = $view['file'][1]['path']."/".$view['file'][1]['file'];
include_once($board_skin_path."/".$view['wr_1']);
?>

이 로직의 상단이나 하단에 이 게시글의 소스를 붙여넣어야 이치적으로 맞습니다.

들레아빠님은 이 소스에서 그걸 간파하시고 엘레먼트의 아이디 부분을 본인이 바꾸어 사용하셨고 그 위치도 인클루드 코드 위로 빼 주신 거에요.
김철용 홈페이지 자기소개 아이디로 검색 전체게시물 회원게시물 21.07.02 11:21:32
자세한 설명 감사합니다. 설명해주신대로 searchZone = "textBible";로 바꾸고, 붙여넣는 위치도 변경하니까 잘됩니다.
저처럼 혼자서 하는 사람에게는 비타주리님의 스킨과 자세한 설명이 큰 도움이 됩니다.
^^
man7777 자기소개 아이디로 검색 전체게시물 회원게시물 21.07.03 09:44:25
유용한 팁 감사합니다. 
검색된 검색어 칼라(#c00000)와 칼라텍스트가 많은 본문의 다른 텍스트들과 구분을 명확히 하기 위해 글크기를 크게 한다든지 검색된 텍스트옆에 기호로 표시한다든지 하면 더 좋을것 같다는 생각입니다.
비타주리 자기소개 아이디로 검색 전체게시물 회원게시물 21.07.03 12:55:17
소스를 보시면... 아래 부분이 있습니다. 이 부분을 고쳐주세요.
("<strong style=color:#c00000>" + searchInput.value.trim() + "</strong>");

예를 들어 글자를 파란색으로 하고 글자 크기를 20px 로 키우면서 [검색어] 이렇게 대괄호로 싸고 싶으시면 아래처럼 주면 됩니다.
("<strong style=color:blue;font-size:20px>[" + searchInput.value.trim() + "]</strong>");

또 스타일을 클래스로 정의해 줘도 되구요.
가장 상단에 아래처럼 주고
<style>
.seachFont { color:blue; font-size:20px; }
</style>

이렇게요
("<strong class=seachFont>[" + searchInput.value.trim() + "]</strong>");

제가 설명글에서 css 는 본인의 취향대로 수정해 쓰라는 것이 바로 이런 경우까지를 포함하고 있습니다.
목록
문의 PC 버전
© SIRSOFT
현재 페이지 제일 처음으로