SIR과 같은 코드 하이라이트(Prism) 적용하기 > Web Development

• 목록

1) 먼저 Prism syntax highlighter 다운로드

​Download ▲ Prism (prismjs.com) 

다운로드 위치는 그누보드/js/prism 를 기준으로 설명

압축 해제 후 FTP 등으로 업로드

2) 그누보드 특정 스킨에 적용하기

스킨의 view.skin.php파일에서 stylesheet 적용된 부분 아래에 코드 입력

<link rel="stylesheet" href="'.G5_JS_URL.'/prism/prism.css">
<script src="'.G5_JS_URL.'/prism/prism.js"></script>

아래의 소스를 찾아서

        <div id="bo_v_con"><?php echo get_view_thumbnail($view['content']); ?></div>

아래처럼 수정하거나

        <div id="bo_v_con"><?php echo preg_replace(['#\[code\][\r\n]+<br/>#', '#<br/>\[/code\]#'], ['<pre><code class="language-php">', '</code></pre>'], get_view_thumbnail($view['content'])); ?></div>

PHP v5.4 미만이면 아래처럼 수정

        <div id="bo_v_con"><?php echo preg_replace(array('#\[code\][\r\n]+<br/>#', '#<br/>\[/code\]#'), array('<pre><code class="language-php">', '</code></pre>'), get_view_thumbnail($view['content'])); ?></div>

실제 에디터에서 사용하는 경우에는 아래와 같이 <p>태그를 포함해서 치환해야함.. (이부분은 실제 출력되는 소스를 보고 수정하셔야합니다.)

        <div id="bo_v_con"><?php echo preg_replace(['#<p>\[code\]</p>#', '#<p>\[/code\]</p>#'], ['<pre><code class="language-php">', '</code></pre>'], get_view_thumbnail($view['content'])); ?></div>

사용하는 방법은 코드의 앞 뒤 부분에 [ code ]와 [ /code ]를 직접 타이핑해주시면 됩니다. (물론 공백없이)

본 글은 첨부링크의 게시글들을 정리하였습니다.

Share Post: