Code Block Pro 한줄로 보일 때 해결하는 방법

플러그인을 설치하고 코드를 넣고 글을 발행했는데 모든 코드가 한줄로 보이는 상황이 발생했다. 어떠한 이유에서인지는 모르겠지만 코드가 충돌했거나 플러그인이 내부적으로 <pre><code> 구조를 사용해야 하는데, 테마나 다른 플러그인이 이를 덮어쓰면 줄바꿈이 무시된다고 한다. 이럴 때는 아래 코드를 CSS에 추가하면 해결이 된다.

해결전

문제 발생 캡쳐사진

AD 4nXcr28rcIJ4K6xxMcQ4AOdk4QKOXG7UelSTMOV2deJMx20tjjOYMYGQm9NxtRw5tT4KWeFUsj0dFNil2A4uplkiuKE0ugww nUENHNBCF teKNmGW8glKQH5xPEGhWW4NKW4E2 W?key=5FsHWuJhc2OFFH3VqZCBcw

해결후

문제 해결후 사진

AD 4nXdyLLeZ ZXHFsr60 rvIUixR8YJgAqvLmqq1uf3YS6ahX7dtCPeY5XwmAJLfK1izle9X10lMd6uNAg4djnZkaBswJjnExHBKtc zDZ04cugZMrc6AgAIgzIzSleOVvnRg gAGpluw?key=5FsHWuJhc2OFFH3VqZCBcw

CSS 코드

/* Code Block Pro 줄바꿈 완전 해결용 */ .wp-block-kevinbatdorf-code-block-pro pre.shiki code span.line {   display: block !important;   white-space: pre !important; }

댓글남기기