Tistory(티스토리)에 코드 입력(넣는) 방법.

이제 좀 본격적으로 프로그래밍을 공부함에 있어,

 

블로그에 공부한 내용이나, 기억하고 싶은 것들을 정리해서 올리려고 하는데 

 

코드들을 일일이 적어서 업로드 하기에는 불편하고, 혹시 남들이 복사해 가기에도 불편하기에

 

블로그. 특히 티스토리에서 코드를 입력하는 방법을 몇 가지 찾아와 봤다.

 

---

 

---

1. 티스토리 자체 코드블럭 입력

 

글쓰기로 들어와 우측 상단에 있는 · · · 을 클릭해보면

 

'코드블럭' 탭이 있다.  클릭해보면,

코드블럭 삽입 화면이 뜨는 데,

 

이곳에 원하는 코드를 입력 후 확인을 누르면

 

다음과 같이 코드를 블로그에 입력할 수 있다!

 

단점이라면 생각보다 가독성이 뛰어나지 않다는 정도.. 

 

가독성이 그리 좋지 않다.

---

2. Color Scripter

Color Scripter : https://colorscripter.com/

Color Scripter

 

Color Scripter라는 웹 사이트는 HTML을 이용하여

 

코드를 입력하는 걸 도와준다. 

 

사이트에 접속 후 입력하고자 하는 언어를 설정,

 

코드를 입력 후

 

우측 하단에 있는 '클립보드에 복사' 버튼을 눌러보자.

 

 

그럼 아래와 같은 화면이 뜨게 되는데 여기서 아래의 코드를 복사한 후,

다시 블로그 글쓰기 페이지로 넘어와 우측 상단에 있는 '기본모드'를 눌러

 

HTML 모드로 진입한다.

진입 후에 아까 복사해 두었던 HTML 코드를 붙여 넣기 하면 아래와 같이된다.

 

그리고 다시 기본모드로 돌아와 보면?

기본모드로 다시 돌아오자.

요로코롬 코드가 입력되 있는 것을 확인할 수 있다.

python = 'Hello, world!'
print(python)

확실히 화이트에 비해 가독성이 좋은 걸 확인할 수 있다.

python = 'Hello, world!'
print(python)

---

3. github gist

github gist : https://gist.github.com/

Discover gists

 

github gist는 github에서 지원하는 입력기로 github와 연동이 된다는게

 

가장 큰 장점이라고 할 수 있다.

 

제목을 입력하고 꼭 확장자 이름을 꼭 적어야 하이라이팅등이 동작한다.!

 

코드를 입력 후,

 

우측 하단의 'Create secret gist'를 누르면 

 

(Create secret gist, Create public gist  두가지 모드가 있는데

github의 검색엔진에 검색이 되냐 안되냐의 차이이다.)

 

아래와 같은 화면이 나오게 된다. 여기서 Embed 오른쪽에 있는 코드를 복사하여,

 

2번째 color script를 입력하 듯 블로그에 돌아와 HTML코드를 붙여넣기 하면,

 

 

아래와 같이 코드가 블로그에 입력되게 된다.

 

 혹여나 이런식으로 입력되서 코드가 입력이 되지 않았다고 생각되시는 분은 

 

잘 된것이니 미리보기등을 이용해서 적용이 잘 되었는지 확인해보도록 하자!

---

++) 혹시 github gist에서 embed가 보이지 않았던 분들.

 

무슨이유인지 이렇게 embed 자체가 보이지 않으셨던 분들은

 

github 계정을 로그아웃하시고 다시 재로그인해보시면 해결될겁니다.!

 

 

---

이상 Tistory에 코드입력하는 방법이었습니다.

 

추후에 더 간편한 코드입력 방법이나

 

대세가 바뀐걸 알게 된다면 다시 업로드 할게요!