그누보드에 markdown 옵션 넣기 정보
그누보드에 markdown 옵션 넣기본문
깃헙에 풀 리퀘스트로 요청을 해 놨지만, https://github.com/gnuboard/gnuboard5/pull/58
기본으로 포함되기가 어려운 부분이 있어서 팁으로 올립니다.
1. 처음 설치시에는 sql만들 때 wr_option에 "markdown"을 넣어 두기
wr_option이 mysql의 data type set이란 것을 사용하기 때문에 이것을 넣어 두어도 사용상에 문제가 없습니다.
기존 사용자는 phpmyadmin이나 별도의 sql문으로 처리하시면 될것 같습니다.
adm/sql_write.sql
`wr_option` set('html1','html2','secret','mail', 'markdown') NOT NULL,
2. update될때 markdown으로 올라올 경우에 markdown도 추가함
bbs/write_update.php
if(preg_match('#html(1|2)|markdown#', strtolower($_POST['html']), $matches))
그누보드 순정을 손 보는 것은 위의 2가지입니다. (코드 수정은 2번 한가지죠.. 이렇게 쉽게 되다니..)
다음은 마크다운 에디터를 사용하는 스킨과 에디터쪽 수정입니다.
1. 해당되는 skin의 write.skin.php에서, html1으로 보내지는 것을 markdown으로 보내기위해서 아래와 같이 수정합니다
$option_hidden .= '<input type="hidden" value="markdown" name="html">';
2. 에디터내의 editor.lib.php를 수정해야 됩니다.
수정시에 <br>이 나와서 그누코드를 열심히 찾아 봤는데 못찾고, editor.lib.php안에서 한참만에 찾았습니다.
|| ($w == 'u' && isset($write['wr_option']) && strpos($write['wr_option'], 'html') === false && strpos($write['wr_option'], 'markdown') === false )
정리하면서 생각해보니 이쪽으로 html이 넘어올 필요가 없으니 그냥 "html"을 "markdown"으로만 변경해도 될 것 같습니다.
그 외에 마크다운 에디터에 포함된 이모지 기능을 사용하기 위해서는
utf8mb4를 디폴트로 해주면 좋을 것 같습니다.
config.php
define('G5_DB_CHARSET', 'utf8mb4');
많은 테스트를 한것은 아니지만, 마크다운 에디터가 깨지지 않고 잘 동작합니다.
비밀글과 마크다운 조합과 메일 옵션등은 테스트 못했습니다. (잘 몰라서.)
추가 : 마크다운 에디터에서 mindmap과 chart가 안되는 문제해결을 위해서
bbs/view.php에서 아래를 추가해 주어야 됩니다.
else if (strstr($view['wr_option'], 'markdown'))
$html = 3;
lib/common.lib.php 에서 if($html) 으로만 되어 있는 것을 완전히 매치되게 변경했습니다.
그리고 $html == 3인 경우에만 깨지지 않는 함수만 불러지게 했습니다.
if ($html == 1 || $html == 2)
{
$source = array();
$target = array();
$source[] = "//";
$target[] = "";
if ($html == 2) { // 자동 줄바꿈
$source[] = "/\n/";
$target[] = "<br/>";
}
// 테이블 태그의 개수를 세어 테이블이 깨지지 않도록 한다.
$table_begin_count = substr_count(strtolower($content), "<table");
$table_end_count = substr_count(strtolower($content), "</table");
for ($i=$table_end_count; $i<$table_begin_count; $i++)
{
$content .= "</table>";
}
$content = preg_replace($source, $target, $content);
if($filter)
$content = html_purifier($content);
}
else if ($html == 0) // text 이면
{
// & 처리 : & 등의 코드를 정상 출력함
$content = html_symbol($content);
// 공백 처리
//$content = preg_replace("/ /", " ", $content);
$content = str_replace(" ", " ", $content);
$content = str_replace("\n ", "\n ", $content);
$content = get_text($content, 1);
$content = url_auto_link($content);
} if($html == 3) {
$content = get_text($content, 0);
}
!-->!-->!-->!-->!-->!-->!-->
5
댓글 22개
적용해보니 vditor에서 완벽 호환됩니다.
마인드맵과 차트는 잘 나옵니다.
그런데
<: < `<`
>: > `>`
```
<textarea>
<div>test</div>
</textarea>
```
위 부분 출력이 제대로 되지 않네요.
htmlpurifier로 필터링되는건 아닐까요?
<br>이 들어가면서 위의 것이 문제가 되고, <br>을 빼면 마인드맴과 챠트가 문제네요.
일단은 마인드 맴과 챠트는 빼야 될 것 같습니다.
악보 수식만 넣어도 충분하다고 생각합니다.
물론 다 되면 좋겠지만요 ㅎㅎ
이슈를 좀 검색해 보니 <br/> 이슈가 있는데, 어디는 \n으로 하고 어디는 <br> 쓰라고 하는 것 같은데.. formatter로 변경이 가능하다고 합니다.
https://echarts.apache.org/en/ 이것도 에디터보다 더 큰 분야네요
그때 말씀드렸던 script 관련코드가 필터링 되는 것 같습니다.
아 기존 글을 그런데, 다시 저장해서 markdown으로 wr_option이 변경되면 필터링 안되고 그대로 넘어가네요.
이건 문제없네요.
--------------
그리고 부가적으로 글쓰기할 때 t.SetSanitize(e.sanitize) 관련 에러가 뜹니다.
index.min.js?ver=191202:formatted:1399
Uncaught (in promise) TypeError: t.SetSanitize is not a function
at r (index.min.js?ver=191202:formatted:1399)
at index.min.js?ver=191202:formatted:8260
이건 밑에 댓글에 있듯이 옵션을 주니 잘 넘어가네요.
$html .= "preview:{ markdown: { toc: true, sanitize: true, }, hljs: { style: 'monokai', }, },\n";
위와 같이 에디터 플러그인의 editor.lib.php 에서 sanitize 옵션을 주니 해결되네요.
이 기능은 전적으로 그누보드에서 모두 처리해 주어야 됩니다. 클릭시 이미지 보여주는 창이 모달로 나타나게 만든 것 같습니다. (html, css, javascript, php까지 알아야 됨.)
썸네일은 view.skin.php에서 부르는 get_view_thumbnail 라이브러리를 수정해서 get_view_thumbnail_md를 하나 만들어야 될 것 같습니다. (img 태그 대신 마크다운 이미지 문법을 찾아서 바꿔주는..)
하지만 그누보드 원본에 이미 팝업으로 원본을 보여주는 기능이 있습니다.
https://demo.sir.kr/gnuboard5/gallery/%E3%85%87%E3%84%B4%E3%84%B9%E3%84%B4%E3%84%B9/
위 링크에 가서 이미지를 클릭하면 이미 링크가 걸려있기 때문에 클릭하면 원본으로 볼 수 있는 것입니다.
이 기능만 연결하면 될 것 같습니다.
썸네일은 라이브러리가 하나 필요하군요!
아무튼 get_view_thumbnail 이 중요하네요.
가이드 업데이트 하려고 합니다.
에디터 기본기능하고, vuejs3.0이 나온다고 하니 그쪽에 더 공부해 볼려고합니다.
시간 나면 한번 부탁드립니다.