반응형

티스토리 소스코드 넣기에 관련된 내용을 알아보도록 하겠습니다. 이 게시물을 전체적으로 읽으면 티스토리 소스코드 넣기를 이해하게 될 겁니다. 티스토리 소스코드 넣기의 지식이 필요하시면 전체 다 읽어주세요. 이제 아래에서 알아봅시다.

 

티스토리 소스코드

 

티스토리 소스코드 넣기

티스토리에 소스코드를 예전에는 넣기가 굉장히 힘들었는데, 이번에 에디터가 업데이트 되면서 소스코드를 넣기가 쉬워졌어요.

아래와 같이 글쓰기를 하면 소스코드에 하이라이트가 적용되도록 하는 방법을 알아볼게요.

방법은 예전에 비해 굉장히 간단해졌으니 끝까지 따라와주시면 쉽게 적용하실 수 있으실거에요.

 

 

 

 

 

  • 티스토리 에디터 글쓰기에 들어가서 위에 케밥 메뉴바를 누르면 코드블럭을 클릭해줍니다.

 

 

  • 그런다음 복사해둔 소스코드를 입력해줍니다.
  • 소스코드 유형에 맞추어 Javascript부분을 선택해줍니다.

 

 

  • 그럼 글쓰기 에디터 화면에 하이라이트가 적용되어 입력이 되어집니다.

 

 

  • 하지만 이대로 글쓰기 완료를 하게 되면 포스팅 페이지에는 소스코드에 하이라이트가 적용되지 않는 모습을 볼수있습니다.
  • 이를 위해서는 티스토리 플러그인에 코드 문법 강조(Syntax Highligt)를 적용시켜줘야합니다.

 

 

 

  • 다시 티스토리 설정에서 플러그인을 클릭해줍니다.

 

 

 

  • 그럼 아래 쪽에 Syntax Highlight(코드 문법 강조) 플러그인을 보실 수 있습니다. 클릭해줍니다.

 

 

  • 테마를 선택한 후 적용을 클릭하면 하이라이트가 적용됩니다.
  • 각 테마의 예시를 아래 스크린샷으로 보여드리오니 참고하시고 적용하시기 바랍니다.

 

 

    • 테마
      • 기본

      • Atom One Dark

      • Atom One Light

      • Github

      • Monokai

      • Dracula

      • Visual Studio

    • Xcode

 

 

 

 

 

 

정리

  1. 티스토리 설정 - 플러그인 - 코드 문법 강조(Syntax Highlight) 적용
  2. 티스토리 글쓰기 에디터 - 케밥메뉴 - 소스코드 클릭

 

티스토리 소스코드 넣기에 대해서 알아보았습니다. 읽어주셔서 감사합니다. 다른 것도 궁금하시다면 상단의 글들을 참고하시면 도움이 될 것 같습니다. 이 게시글이 유익하셨다면 구독, 좋아요, 하트(공감)를 해주시면 블로그 운영에 보탬이 됩니다.

반응형
  • 네이버 블러그 공유하기
  • 네이버 밴드에 공유하기
  • 페이스북 공유하기
  • 카카오스토리 공유하기