[Blog] 티스토리 블로그에 코드 예쁘게 넣는 방법

 

1. 기본 에디터 활용 🙂

글 작성 시 상단 툴바에서 더보기 → <> 코드블럭 → 코드 작성 후 알맞는 언어 선택

#include <iostream>
using namespace std;

int main() {
    cout << "Hello, C++!" << endl;
    return 0;
}

✋ 다만, 티스토리 블로그에서 코드 문법 강조 플러그인을 사용중이어야 한다.

 

✔️ 플러그인 적용 방법

https://내블로그.tistory.com/manage/plugins

 

블로그 관리 홈에서 플러그인관리로 이동 후 코드 문법 강조 플러그인 클릭

 

사용할 테마를 선택해서 적용 (저는 Atom One Light을 적용했습니다.)

 

 

2. 외부 코드 하이라이터 이용

 

→ 기존에 사용하던 ColorScripter 방식

#include <iostream>
using namespace std;
 
int main() {
    cout << "Hello, C++!" << endl;
    return 0;
}
출처: https://jeahnote.tistory.com/237 [NOTE.COM:티스토리]

예쁘긴한데, HTML 글 방식으로 변경해서 삽입해주어야 하는 번거로움이 있다.

 

 

→  Carbon 또는 Ray.so 같은 사이트에서 코드를 이미지로 넣는 방식

음.. 이미지로 넣는거라 수정도 번거롭지만 배경도 매번 잘라내줘야해서 불편하다.

 

Carbon (이미지로)

 

Ray.so (이미지로)

 

 

아래 3,4번은 비추.. 번거롭거나 검색 추천에 용이하지 못하다.

3. Prism.js 또는 Highlight.js 직접 삽입

4. Gist 사용 (GitHub 연동)

 

---

그동안은 티스토리에 글을 쓸 때 이전에 네이버 블로그에 코드를 삽입하듯이

ColorScripter 홈페이지에서 만든 HTML 코드를 복사해서 넣고 있었다.

그런데 좀 더 코드를 깔끔하고 예쁘게 넣고 싶은 마음에 조금 찾아보았다.

기본 에디터도 충분히 예쁘게.. 삽인될 수 있었구나. 이제서야 깨달았다.

그냥 기본 에디터 써야겠다 ㅎㅎ