블로그에 소스코드 올리기 - beullogeue soseukodeu olligi

안녕하세요.

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

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

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

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

my-inote.tistory.com

블로그에 소스코드 올리기 - beullogeue soseukodeu olligi

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

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

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

블로그에 소스코드 올리기 - beullogeue soseukodeu olligi

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

블로그에 소스코드 올리기 - beullogeue soseukodeu olligi

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

블로그에 소스코드 올리기 - beullogeue soseukodeu olligi

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

블로그에 소스코드 올리기 - beullogeue soseukodeu olligi

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

블로그에 소스코드 올리기 - beullogeue soseukodeu olligi

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

블로그에 소스코드 올리기 - beullogeue soseukodeu olligi

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

블로그에 소스코드 올리기 - beullogeue soseukodeu olligi

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

블로그에 소스코드 올리기 - beullogeue soseukodeu olligi

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

블로그에 소스코드 올리기 - beullogeue soseukodeu olligi

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

블로그에 소스코드 올리기 - beullogeue soseukodeu olligi

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

블로그에 소스코드 올리기 - beullogeue soseukodeu olligi

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

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

블로그에 소스코드 올리기 - beullogeue soseukodeu olligi