본문 바로가기

정보/블로그

블로그에 코드 포스팅하는 법 / 코드블럭 및 코드문법 강조 플러그인 사용하기

안녕하세요.

지난 포스팅에서 티스토리 블로그에 소스 코드 넣는 방법에 대해서 알려드렸습니다. 혹시 지난 포스팅이 궁금하신 분들은 아래 링크를 따라가주세요.

 

[블로그] - 티스토리 블로그에 코드 삽입하는 방법 / 소스코드 포스팅

 

티스토리 블로그에 코드 삽입하는 방법 / 소스코드 포스팅

안녕하세요. 오늘은 블로그에 소스코드를 이쁘게 삽입하는 방법에 대해서 다루어보려고 합니다. 블로그에 소스코드를 첨부할 일이 생기다보니, 어떻게 올려야 이쁘게 포스팅 될까? 자연스레 고민하게 되었습니다...

my-inote.tistory.com

 

저는  Color Scripter가 최선인줄 알고 사용했으나... 티스토리 블로그에서 코드를 포스팅하는 훨씬 더 간단한 방법이 있더라구요. 이 포스팅을 보시는 분들은 저처럼 고생하지마시고 간단한 방법으로 쉽게 포스팅하셨으면 좋겠습니다. 정말 쉽고 간단하더라구요. 이쁘기도 하구요. 제 눈에만 이쁘다고 느껴질 수도 있지만요. 

 

그래서 오늘은 블로그에 소스코드 포스팅하는 방법과 코드블럭 및 코드 문법 꾸미는 플러그인에 대한 설명까지 티스토리에서 제공하는 방법으로 쉽게 설명드리려고 합니다. 이 방법은 강추입니다! 그럼 시작하겠습니다.

 

먼저 티스토리 글쓰기 에디터에 들어가시면 우측 상단에 점 3개가 보이시는데요. 이걸 누르신 후에 아래에 코드블럭을 클릭해주세요. 

 

 

 

 

그럼 아래와 같은 코드블럭 삽입 창이 나타나게 됩니다. 다양한 언어를 지원하는 것을 확인할 수 있는데요. 여기서 자신이 사용하고자 하는 코드를 선택해주시면 됩니다. 저는 파이썬으로 선택하겠습니다.

 

 

 

 

그 다음에는 자신의 코드를 복사(Ctrl + c) 및 붙여넣기(Ctrl + v)를 하고 밑에 있는 확인을 눌러주세요.

 

 

 

 

 

그럼 글 작성중인 에디터 창에는 아래와 같이 뜨는 것을 확인할 수 있습니다. 뭔가 전문적인 IT 블로그 느낌이 납니다. 제가 IT 전공이 아니라서 그렇게 보일 수도 있지만요. 

 

 

 

 

그럼 글을 저장하고 어떻게 업로드 되어 있는지 확인해보러 갈까요? 짠!! 블로그에 들어가면 아래와 같이 나옵니다. 근데 에디터 창에서 봤던 테마가 더 이쁜 것 같은 느낌이 드네요. 저는 개인적으로 코딩할 때 어두운 화면을 선호하는 편인데, 조금 더 이쁘게 꾸며보고 싶다는 욕구가 생기는 화면이네요. 자 그럼 더 이쁘게 꾸미는 방법까지 알려드려야겠죠?

 

 

 

 

이것 또한 티스토리 블로그 내에 있는 플러그인을 이용하면 쉽고 간단하게 꾸밀 수 있습니다. 블로그 매니저 창의 왼쪽에 플러그인이 있는데요. 이걸 눌러줍니다. 

 

 

 

 

 

그리고 쭉~~ 내리다보면 아래 사진과 같이 코드 문법 강조라는 것이 보이는데요. 이걸 클릭해주세요.

 

 

 

 

아래와 같은 화면이 나오게 되는데요. 아래 부분에 테마 선택에서 기본으로 되어 있는 걸 클릭해줍니다. 좀 전에 테마가 마음에 들지 않았던게 기본이라서 그런건가 봅니다. 기본도 좋지만 항상 테마를 이쁘게 꾸미는 것은 코딩 하시는 분들은 느끼지 않을까 싶네요.

 

 

 

 

그렇게 다양하지는 않지만, 없지도 않은 테마들이 있는데요. 여기서 자신이 마음에 드는 것을 선택해주시면 됩니다. 

 

 

 

 

 

저는 여기서 아래에 Atom One Dark를 선택하였습니다.

 

 

 

 

 

그리고 변경사항 적용을 클릭하시면 완료입니다.

 

 

 

 

 

 

 

제가 선택한 테마가 잘 적용되었는지 확인해볼까요? 코드를 짠 블로그에 들어가서 확인해줍니다.

짜잔!! 기본 테마보다는 이게 더 이쁜 것 같네요. 티스토리에서 소스코드 넣는 방법을 이렇게나 간편하게 해둬서 복잡하게 이것저것 찾지 않아도 금방 소스코드를 넣을 수 있어서 간편하고 좋네요. 앞으로 이렇게 코드를 첨부할 일이 많을 것 같은데 이렇게 간편한 방법을 알게 되서 기쁩니다. 여러분도 티스토리에서 제공하는 플러그인 잘 사용하셔서 블로그에 편하게 소스 코드 넣으실 수 있길 바랍니다.