질문이 있길래 제가 사용하는 방법을 올려봅니다.
평상 시에는 버튼만 보이다가 버튼클릭 시 버튼 좌측으로 전체검색창을 보이게 하는 방법입니다.
한 번 더 클릭을 하면 검색창이 사라집니다.
그냥 차례대로 놓고 사용하셔도 됩니다.

1.
<!-- 검색창은 기본적으로 안 보이게 스타일설정 -->
<style>
#hd_sch #sch_stx { display:none; }
</style>
<!-- 검색창은 기본적으로 안 보이게 스타일설정 -->

2.
<!-- 토글에 대한 스크립트 삽입 -->
<script>
var now_layer_id = '';
function display_popLayer(id){
$("#"+id).toggle();

var obj = $('#'+id);
if(obj.css('display') == 'none'){
new_display = 'block';
now_layer_id = id;
}else if(obj.css('display') == 'block'){
new_display ='none';
now_layer_id = '';
}
}
</script>
<!-- 토글에 대한 스크립트 삽입 -->

3.

그리고, img폴더에 search.png 파일을 넣으신 후 사용하시면 됩니다.
search.png 파일도 첨부하였습니다.

        <fieldset id="hd_sch">
            <legend>사이트 내 전체검색</legend>
            <form name="fsearchbox" method="get" action="<?php echo G5_BBS_URL ?>/search.php" onsubmit="return fsearchbox_submit(this);">
            <input type="hidden" name="sfl" value="wr_subject||wr_content">
            <input type="hidden" name="sop" value="and">
            <label for="sch_stx" class="sound_only">검색어<strong class="sound_only"> 필수</strong></label>
            <input type="text" name="stx" id="sch_stx" maxlength="20" placeholder="">
            <input type=image onClick="display_popLayer('hd_sch #sch_stx');" src="<?php echo G5_IMG_URL ?>/search.png" width="22" height="20" border=0 onfocus="blur()" alt="전체검색" title="전체검색">
            </form>

            <script>
            function fsearchbox_submit(f)
            {
                if (f.stx.value.length < 1) {
                    //alert("검색어는 두 글자 이상 입력하십시오.");
                    f.stx.select();
                    f.stx.focus();
                    return false;
                }

                // 검색에 많은 부하가 걸리는 경우 이 주석을 제거하세요.
                var cnt = 0;
                for (var i=0; i<f.stx.value.length; i++) {
                    if (f.stx.value.charAt(i) == ' ')
                        cnt++;
                }

                if (cnt > 10) {
                    alert("빠른 검색을 위하여 검색어에 공백은 한 개만 입력할 수 있습니다.");
                    f.stx.select();
                    f.stx.focus();
                    return false;
                }

                return true;
            }
            </script>
        </fieldset>

4. 2023년 1월 1일 내용 추가 : 허접한 팁 하나 더~

참고로 다음과 같은 조치를 해주면 다른 영역에 클릭을 하게 되면 검색창이 보이지 않게 됩니다.

default.css에서 
/* 전체 검색 */
#hd_sch #sch_stx {padding-left:7px;width:200px;height:24px;border:0;background:#fff;line-height:1.9em;background: none}을

다음처럼 추가해주시면 됩니다.
#hd_sch #sch_stx {padding-left:7px;width:200px;height:24px;border:0;background:#fff;line-height:1.9em;;background:#fff;border:0px solid #ccc}

감사합니다.