vditor 코드 블록 폰트 크기 및 테마 바꾸기(smarteditor 작성글)

코드 블록 테마 바꾸기

/skin/board/게시판스킨/view.skin.php

위 파일에서

<!-- } 게시판 읽기 끝 -->

위 내용 밑에

<script>
Vditor.preview(document.getElementById('bo_v_con'),
    document.getElementById('markdownText').textContent, {
        markdown: {
        toc: true,
        },
        lang: 'ko_KR',
        hljs: {
            style: 'monokai', //코드 스타일 테마 지정 가능
        },
        className: 'preview vditor-reset',
        customEmoji: emojiOptions,
    })
</script>

위 내용을 넣게 되는데요. monokai 대신에 다른 테마를 넣으면 됩니다.

지원하는 테마 종류는

/plugin/editor/vditor3/dist/js/highlight.js/styles/

위 경로에 있는데요.

대략 위와 같은 테마가 있습니다.

https://highlightjs.org/static/demo/

위 사이트에서 테마 느낌을 확인 후 바꾸면 됩니다.

---

폰트 크기 바꾸기

/plugin/editor/vditor3/dist/index.css

위 파일에서

.vditor-reset pre>code{margin:0;font-size:85%;

위 내용을 찾아서 85% 대신에 다른 것으로 바꾸면 됩니다.

저는 95%하니 괜찮은 것 같습니다.