
외부 이미지는 태그를 사용해서 본문에 삽입할 수 있으나, 불편하기 그지 없다. 다음은 이미지박스를 이용해 그 불편을 더는 방법이다.


1) 우선 다음 링크에 있는 팁을 적용하여 자동링크 소스를 패치하자.

http://reedyfox.com/bbs/zboard.php?id=building&no=74



2) 제로보드 디렉토리에 있는 image_box.php 를 연다. 134행 이하에 스크립트가 길게 있는 것을 볼 수 있다. 공간을 마련해 다음을 삽입하도록 하자.

function putouterStr() {
        var img_str="";
        var img_url="";
        var img_align="";
        var img_vspace="";
        var img_hspace="";
        var img_border="";
        if(opener.window.document.all["write"]&&opener.window.document.all["write"].subject) {
                img_url=document.imageList.i_url.value;
                img_vspace=document.imageList.i_vspace.value;
                img_hspace=document.imageList.i_hspace.value;
                img_align=document.imageList.i_align.value;
                img_border=document.imageList.i_border.value;
                img_str = "[outerimg:"+img_url+",align="+img_align+",vspace="+img_vspace+",hspace="+img_hspace+",border="+img_border+"]";
                if(img_align=="") {
                        img_str = "\n"+img_str;
                }
                opener.document.write.memo.value = opener.document.write.memo.value + img_str;
        } else {
                alert ("글쓰기 화면에서만 사용하실수 있습니다");
        }
        var obj=document.all['inputTable'];
        obj.style.visibility='hidden';
}



그리고 다음 부분을 찾아

                                <td nowrap><b>여백지정</td>
                                <td width=100%>
                                        수평 : <input type=input value="0" size=3 class=input name=i_hspace style=height:16px> px  
                                        수직 : <input type=input value="0" size=3 class=input name=i_vspace style=height:16px> px  
                                </td>
                                <td nowrap><a href="javascript:void(putStr())"><img src=images/im_input.gif border=0></a> <a href=# onclick=inputTable.style.visibility='hidden'><img src=images/im_close.gif border=0></a></td>
                        </tr>
                        </table>

                        <img src=images/t.gif border=0 height=3><br><img src=images/im_underline.gif border=0 width=100% height=2><br><img src=images/t.gif border=0 height=3><br>
                        

아래와 같이 내용을 추가해주자.

                                <td nowrap><b>여백지정</td>
                                <td width=100%>
                                        수평 : <input type=input value="0" size=3 class=input name=i_hspace style=height:16px> px  
                                        수직 : <input type=input value="0" size=3 class=input name=i_vspace style=height:16px> px  
                                </td>
                                <td nowrap><a href="javascript:void(putStr())"><img src=images/im_input.gif border=0></a> <a href=# onclick=inputTable.style.visibility='hidden'><img src=images/im_close.gif border=0></a></td>
                        </tr>
                        </table>

                        <img src=images/t.gif border=0 height=3><br><img src=images/im_underline.gif border=0 width=100% height=2><br><img src=images/t.gif border=0 height=3><br>
                        
                        <table border=0 cellspacing=0 cellpadding=4 width=100%>
                        <tr>
                                <td nowrap height=30><b>외부경로</td>
                                <td width=100%>
                                        <input type=text name=i_url class=input style=width:100%>
                                </td>
                                <td nowrap><a href="javascript:void(putouterStr())"><img src=images/im_input.gif border=0></a></td>
                        </tr>
                        </table>
                        
                        <img src=images/t.gif border=0 height=3><br><img src=images/im_underline.gif border=0 width=100% height=2><br><img src=images/t.gif border=0 height=3><br>
                        
                        
                        
3) include/list_check.php 를 열어 // 이미지 박스 사용을 위해서 정규표현식 사용 라고 된 부분을 아래와 같이 수정한다.

                // 이미지 박스 사용을 위해서 정규표현식 사용
                if($data[ismember]) {
                        $imageBoxPattern = "/\[img\:(.+?)\.(jpg|gif|png)\,align\=([a-z]+){0,}\,width\=([0-9]+)\,height\=([0-9]+)\,vspace\=([0-9]+)\,hspace\=([0-9]+)\,border\=([0-9]+)\]/i";
                        $data[memo]=preg_replace($imageBoxPattern,"<img style=\"cursor:hand\" onclick=window.open(this.src) src='icon/member_image_box/$data[ismember]/\\1.\\2' align='\\3' width='\\4' height='\\5' vspace='\\6' hspace='\\7' border='\\8'>", stripslashes($data[memo]));
                        
                        $outerimageBoxPattern = "/\[outerimg\:(.+?)\.(jpg|gif|png)\,align\=([a-z]+){0,}\,vspace\=([0-9]+)\,hspace\=([0-9]+)\,border\=([0-9]+)\]/i";
                        $data[memo]=preg_replace($outerimageBoxPattern,"<img style=\"cursor:hand\" onclick=window.open(this.src) src='\\1.\\2' align='\\3' vspace='\\4' hspace='\\5' border='\\6'>", stripslashes($data[memo]));
                } else {
                        $data[memo]=stripslashes($data[memo]);
                }
                
                

4) outlogin.php 를 열어

                        if($data[ismember]) {
                                $imageBoxPattern =.................어쩌구 저쩌구 라고 된 부분을 찾아
                                
                                
                        // 이미지 박스 사용을 위해서 정규표현식 사용
                        if($data[ismember]) {
                                $imageBoxPattern = "/\[img\:(.+?)\.(jpg|gif|png)\,align\=([a-z]+){0,}\,width\=([0-9]+)\,height\=([0-9]+)\,vspace\=([0-9]+)\,hspace\=([0-9]+)\,border\=([0-9]+)\]/i";
                                $memo=preg_replace($imageBoxPattern,"<img style=\"cursor:hand\" onclick=window.open(this.src) src='".$_zb_url."icon/member_image_box/$data[ismember]/\\1.\\2' align='\\3' width='\\4' height='\\5' vspace='\\6' hspace='\\7' border='\\8'>", stripslashes($memo));
                        
                                $outerimageBoxPattern = "/\[outerimg\:(.+?)\.(jpg|gif|png)\,align\=([a-z]+){0,}\,vspace\=([0-9]+)\,hspace\=([0-9]+)\,border\=([0-9]+)\]/i";
                                $memo=preg_replace($outerimageBoxPattern,"<img style=\"cursor:hand\" onclick=window.open(this.src) src='\\1.\\2' align='\\3' vspace='\\4' hspace='\\5' border='\\6'>", stripslashes($memo));
                        }
                        
                        
로 수정한다.




5) 사용방법

이미지박스를 열어 아무 이미지나 클릭하고 '외부경로'라고 된 인풋박스에 이미지의 경로(URL)를 붙여넣는다. 이미지 사이즈는 적용되지 않고 나머지는 모두 변경가능하다.