티스토리에 코드펜 [codepen] 코드를 삽입하는 가장 쉬운 방법 - 러비드

codepen에서 작성한 코드를 

티스토리 블로그에 쉽게 옮길 수 있는 정말 쉬운 방법!

 

 

1. codepen 접속

 

 

2. Embed 클릭

Embed를 누르면 이렇게 팝업이 하나 나와요

 

 

기본 Default모드는 white로 되어 있어요

저는 요즘 다크모드에 빠져 있어서

dark theme로 변경할게요

 

 

 

3. HTML(recommended) 클릭

<p class=~...(생략)

코드를 카피하시고~~

티스토리 포스팅 화면으로 이동해주세요

 

 

 

 

4. 티스토리 블로그 글쓰기 

글쓰기 화면에서

기본모드로 되어 있는 버튼을 HTML로 변경하면 화면이 바뀌어요

 

 

 

 

5. codepen에서 복사한 텍스트 붙여넣기

 

붙여넣은 다음 다시 기본모드로 바꾸면 codepen이 잘 들어간 걸 확인할 수 있어요!

 

 

원하는 화면이 안 나왔다고요?

 

삐빅 -

정상입니다-

 

 

 

6. 글 저장하기

저장 후 보는 화면은 우리가 보는 익숙한 codepen 화면으로 바뀌어요~