본문 바로가기
블로그_활용/블로그

티스토리 - Tistory 코드펜 소스 첨부하기

by 고코더 2021. 1. 19.

Tistory Codepen 글쓰기에 사용하기


 

안녕하세요.

고코더 입니다.

 

 

 1. 코드펜의 에디터를 티스토리에 붙여 넣어서 보여주는 방법을 알아보겠습니다. 특히 코딩을 강의하는 블로거들에게는 아주 좋은 방법이 될 거라 생각합니다. 

 

 2. 코드펜에서 퍼오고 싶은 소스에 들어가서 "Embed"를 클릭합니다. 

 

 3. "Copy & Paste Code"에서 iframe를 선택하고 소스를 복사합니다. 

 

 4. 그다음 티스토리 새로운 글쓰기 에디터에서 HTML 모드를 선택합니다. 

 

 5. 그리고 코드펜에서 복사해온 소스를 그대로 붙여 넣습니다. 그럼 이런 형태로 iframe으로 시작하고 끝나는 코드가 입력됩니다. 

 

 6. 다음 다시 기본 모드를 클릭하게 되면 

 

 7. 이렇게 아주 깔끔하고 보기 좋은 코드펜 소스를 티스토리에서 볼 수 있게 됩니다. 

 

 


마무리


 

두 조합이 잘 어울리네요.

 

 

댓글