Skip to content

블로그 댓글 및 방명록에 BBCode 사용가능하도록 변경

우연히, 뜬금없이, 가당찮게, 할 일 없어서 등의 이유로 텍스트큐브 플러그인 사이트에 접속했는데, 눈에 띈 플러그인이 있었으니 다름 아닌 BBCode plugin for Textcube 1.1이란 플러그인이었다. 평소 댓글 등에 BBCode를 사용할 수 있게 만든 블로그를 방문하면 부러워했었는데, 그 부러움을 상쇄시켜줄만한 매력으로 다가와 직접 설치해봤다.

설치 결과는? 좋다!([{물론, 댓글이나 방명록이 많은 블로그가 아니라서 실제 효율성은 떨어질 수도 있으나 개인적으로 보기에는 좋다.}])

먼저 이 플러그인 관련 정보는 아래와 같다.
- 최초로 플러그인 만드신 분: okto님으로 알고 있었으나 실제는 inureyes
- 수정하신 분: okto
- 관여해주신 고마운 분들: inureyes님, okto님 등등 여러분들
- 원 글: TC용 BBCode plugin + 버튼바

적용하면서 몇 가지를 수정했는데, 왜냐하면 현재 본인의 블로그에 적용된 스킨이 hi8ar님의 whiteBoard for Textcube란 스킨이기 때문이다. 그래서 이와 관련해서 적용한 내역은 아래와 같다.

  • screen.css 변경
    /* ------------------------------------------------------------------- */
    /* BBCode Helper */
    /* ------------------------------------------------------------------- */
    .emoticonborder { border-style: solid; border-width: 1px; border-color: #cbcbcb; padding: 3px; margin: 0 0 -2px 0; height: 21px; }
    .emoticons { cursor:pointer; float: left; margin:2px 2px 1px 0; }
    .emoticonspace { float: left; margin-right:0px; }
    .emoticonusage { cursor:pointer; float: right; }
    a.rollover img { border-width:0px; display:block; }
    a.rollover img.rollover { display:none; }
    a.rollover:hover { position:relative; background-color:transparent !important;}
    a.rollover:hover img { display:none; }
    a.rollover:hover img.rollover { display:block; }

    style.css가 없기 때문에 위 부분을 screen.css에 추가

  • skin.html 변경 시 width 조정
    플러그인과 같이 제공되는 bb_helper.zip 내에 있는 '댓글.txt' 및 '방명록.txt'를 'skin.html'에 적용하면서 본 블로그 스킨의 댓글 및 방명록 textarea 부분의 width와 맞추기 위해 txt 파일 맨 위에 있는 '<div class="emoticonborder" style="/*width:604px*/; background-image:url(./images/bb_bg.bmp); background-repeat:repeat-x;">'를 '<div class="emoticonborder" style="width:579px; background-image:url(./images/bb_bg.bmp); background-repeat:repeat-x;">'와 같이 조정

위와 같이 약간의 Customizing을 통해 현재 블로그 아래 및 방명록 섹션에서 보는 바와 같이 BBCode를 입력할 수 있는 bar가 설치된다. 그리고 BBCode 사용법을 모르는 사람들을 위해 bar 우측에 있는 '?' 버튼을 클릭해서 참고하면 된다.

11 thoughts on “블로그 댓글 및 방명록에 BBCode 사용가능하도록 변경

  1. Pingback: Sleepy Tiger

  2. okto

    플러그인을 최초로 만드신분은 [red]inureyes[/c]님이고요 전 단지 수정배포만 했을 뿐입니다^^;
    [b]버튼바는 누구 작품인지 참 깔끔하고 예쁘네요^^ 껄껄껄~[/b]

    Reply
    1. 其仁

      bluenlive님도 만드셨나 보네요? 전 텍스트큐브 플러그인 페이지에서 바로 발견해서 개발 새발 적용했었거든요. 잘 안될까봐 걱정했었다는 일화가 전해진다고 합니다...쿨락...ㅡ.ㅡ...

      Reply
    2. okto

      탄생설화에 언급했지만 딱히 누구 한분이 만들었다고 하기 어렵습니다. 기본적인 아이디어는 엔즐님과 Forevler님의 영향이 컸고 엔즐님의 코드를 범용으로 쉽게 적용 가능하도록 bluenlive님이 공개하셨으며 플러그인은 inyoureye님 작품이죠. 공교롭게도 편리한 코드가 bluenlive님의 것과 비슷한게 많지만 그것들은 전부터 필요에 따라 하나씩 추가해 사용해오던 것이죠. embed 태그는 qaos의 것을-_- 흉내냈습니다. bluenlive님께서 좀더 편리하게 고쳐주셨고요.
      현재의 댓글 폼위에 매단 버튼바라든지 버튼의 디자인들은 제가 먼저랍니당^^

      Reply
  3. 블루베어

    저는 왜 똑같이 했는데.안될까요? 몇번이고 다시 보고 또 봐도 여전히 안되네요;; 뭔가 다른 방법이 있는건지..

    저도 이 스킨 쓰거든요.그래서 님처럼 똑같이 했는데;;신기하네요..

    Reply
    1. 其仁

      숨어있는 1인치 오류는 의외로 간단한 곳에서 발견한 경험을 자주 겪었습니다. 블루베어님의 경우도 이와 같지 않을까 싶습니다.

      Reply

답글 남기기

이메일은 공개되지 않습니다. 필수 입력창은 * 로 표시되어 있습니다

This site uses Akismet to reduce spam. Learn how your comment data is processed.