티스토리 뷰

연동이라고는 할 수 없고 티스토리 내에 제로보드를 끼워넣는 형식으로 어쨌든 성공했다!
크게 어려운 건 없었는데 제대로 이해를 못해서 약간 헤맸다는...

사실은 개인홈 따로 블로그 따로 어정쩡하게 유지 했었는데
개인 홈은 얼마 전에 만들었지만 뭐 오는 사람이 거의 없는 관계로 통·폐합(이라고 하기엔 거창한)을 마음 먹었다.

개인 홈페이지, 아래와 같음-


여기서 사실 내 소개도 할 필요 없는 데다가 소개 할 꺼리도 없는 관계로 이 메뉴는 삭제.
note도 사실 주저리 주저리 별 쓸말도 없는 관계로 삭제.
진짜 쓸만한 건 foto와 works 메뉴인데 이 부분을 블로그 내에 삽입 시키기로 했다.
you라는 이름의 메뉴는 방명록인데 어짜피 블로그 내에 있으므로 이것도 패스.


전체적으로 메뉴만 이런 식으로 바뀌었다.
덕지덕지 이미지 파일 있는 걸 싫어하는 성격이라 깔끔하게 폰트만 사용했었지만
살짝 변화를 줬더니 뭔가 산뜻해졌다 :)

아무튼, 티스토리 내에서 제로보드 연동하는 방법을 검색해서 찾아보던 중
http://gum2.tistory.com/11 ☜ 요기를 발견. 시도해보았다.

티스토리 스킨 파일과 제로보드 footer 내에 스크립트를 삽입하라는 말은 알았는데
변경하고자 하는 위치에 iframe 소스를 넣어주라는게 무슨 소린지 몰라서
우선 skin.html 파일에 넣어봤더니 블로그 들어오자마자 제로보드가 뜨는 것 아닌가!
완전 당황스러웠다. 다행히 스킨 백업파일이 있었길래 망정이지...

다시 꼼꼼히 게시글을 읽어보던 중, 주인장님이 "위치로그를 사용하지 않아서"라는 말에 힌트를 얻고!
위치로그 출력 명령 대신 위의 소스를 삽입하니 위치로그 클릭 시 게시판으로 연결되더군.
그래서 위치로그 메뉴 이름을 foto 게시판으로 수정하고 notice 부분을 works로 바꿔주었다.
여차저차 그리하여 성공!

그치만 아직 해결하지 못한 부분이 있다.
works 메뉴를 누르면 최하단에 블로그 페이징이 계속 삽입되어있다.
이거 자칫 잘못하면 제로보드 내 소스까지 수정해야하는 번거로움이 있을 것 같아서
우선은 이대로 냅둘란다. 귀찮다. 후우~
이렇게 쉬운 원리였다는 걸 이제야 깨달았는지... 으이구!!!

아무튼 그동안 몇 장 올리진 않았지만 나름 마음에 들었던
일본의 포토로그(fotologue.jp/johyuna) 사이트 대신 제로보드를 이용해야겠다.
(자체적으로 관리하니까 백업도 자유롭고 말이야~)

안타까운건 티스토리와 제로보드 회원 연동이 안되니 댓글 남길 때 번거로울 것 같고.
아무래도 손님도 댓글을 남길 수 있도록 수정해야겠구나...
그러려면 스팸댓글부터 차단시켜야지 흑흑ㅜㅜ

위와 같은 시행착오를 다른 분들이 겪지 않도록
그 방법을 속시원하게(?) 알려드릴란다.

아래의 스크립트는 skin.html에 넣어주세요. 저는 </header>앞부분에 넣어줬어요.

<script Language='javascript'>
var ifrmHeight;
var objFrame;
var str;
var cstr;
function init() {
try{
objFrame = document.all["ifrm"];
str = window.clipboardData.getData("Text");
cstr = str.split("|");
ifrmHeight= eval(cstr[1]);
}catch(e){
}
}
function reSize() {
try{
if (ifrmHeight > 240) {
objFrame.style.height = ifrmHeight;
}else{
objFrame.style.height = 240;
}
}catch(e){
}
}
function init_iframe() {
reSize();
setTimeout("init_iframe()",100);
}
init_iframe();
</script>

변경하고자 하는 위치에 아래의 iframe 소스를 넣어 주세요.

<iframe src="게시판 주소" name="ifrm" width="100%" height="100%" marginwidth="0" marginheight="0" frameborder="no" onload="init()" scrolling="no"></iframe>

추가설명
여기서 변경하고자 하는 위치란?
티스토리 내의 기본 메뉴 중 자기가 사용하지 않는 메뉴가 있을 경우에
그 메뉴 대신 제로보드를 사용하고자 할 때 소스를 삽입해주어야 하는 위치를 말해요.
그러려면 skin.html 내의 소스를 수정해주어야 합니다.


자기가 블로그 내 media 메뉴를 사용하지 않는다 치고 소스 수정하는 법입니다.
아래의 소스에서 '게시판 주소'를 본인이 사용할 '제로보드의 주소'로 바꿔주시고
변경한 위의 소스를 skin.html 내에 있는
<s_media>와 </s_media>사이에 있던 소스들을 지우고 넣어주세요.
여기서 주의할 점은 소스를 수정하기 전 skin.html을 백업해두셔야 한다는 것이구요.
자, 바꿔주셨나요?
그리고나서 제로보드 게시판 관리에 들어가셔서
게시판 하단에 출력될 내용에 아래 소스를 추가해 줍니다.

<script language="javascript">
window.clipboardData.setData('Text', document.body.scrollWidth+"|"+document.body.scrollHeight);
</script>


마지막으로 최종 마무리 입니다.
이것 역시 skin.html 부분에서 윗부분에 보시면
<a href="[ ##_blog_link_## ]media">가 있을 꺼예요. (여기서 [와 # 사이는 붙여주세요.)
(찾기 힘드시면 Ctrl+f를 이용해서 찾아보세요.)
그러면 위의 <a href="[ ##_blog_link_## ]media"> 부분과 </a> 부분 사이의 이름을 바꿔주시면 되요.
가령 연동하고자 하는 게시판이 사진 게시판이라면
윗 부분에 들어갈 메뉴 이름을 photo로 해주시던가...
설명이 참 복잡해졌는데, 이해가 가시나 모르겠네요.
아마 스킨 자주 만져보시는 분들은 이게 무슨 말인지 잘 아실듯...

아무튼 여기까지가 수정 방법입니다.
간단한 설명을 원하시는 분들은 위에 제가 링크한 사이트에 가보세요.

성공하신 분 있다면 손~
제가 소스들을 옮기는 도중에 오타가 있을 수도 있으니
꼭 제가 링크한 사이트에 가셔서 다시 한 번 확인해보세요~

혹시 저와 같은 방법으로 제로보드를 연동하고 계신 분, 좋은 팁 있으면 공유 부탁드리구요,
위의 방법을 시도하고 계신 분이 있다면 막히는 점이 생기셨을 때 문의 주시면 성의껏 답해드릴께용 :)


댓글