본문 바로가기

블로그ㆍ인터넷/티스토리

유튜브 동영상 반응형으로 블로그 올리는 방법

티스토리에 유튜브 동영상을 올릴 경우가 종종 있는데요, 최근 티스토리에 반응형 스킨이 많아지면서 좀 더 깔끔하게 올리고 싶었습니다. 물론 유튜브에서 제공하는 코드를 그대로 올려도 되지만 저는 유튜브 동영상도 반응형으로 올려보고 싶었습니다.


간단하게 유튜브 동영상을 반응형 코드로 변경해서 블로그 포스팅에 활용할 수 있는 방법이 있습니다. 물론 웹언어를 잘 아시는 분들은 코드를 직접 수정해서 올릴 수 있지만 저처럼 잘 모르시는 분들을 위해서 포스팅을 해봅니다.


유튜브 동영상 반응형으로 블로그 올리는 방법유튜브 동영상 반응형으로 블로그 올리는 방법


유튜브 동영상 반응형으로 블로그 올리는 방법



우선 유튜브에서 블로그 포스팅에 활용할 동영상을 하나 찾아보겠습니다.

저는 요즘 NBA에서 가장 핫한 '커리'동영상 하나를 올려보도록 하겠습니다. 공유부분에서 동영상 주소를 복사합니다. ▲



그 후에 embedresponsively 사이트에 접속합니다. 접속하면 위와 같은 화면을 볼 수 있습니다. 유튜브 뿐만 아니라 Vimeo, Dailymotion 등 다양한 서비스들을 반응형 코드로 변환할 수 있습니다. 아까 유튜브 동영상 주소를 입력하고 Embed 버튼을 클릭합니다. ▲



변환은 순식간에 되고 변환이 되면 동영상과 함께 아래 반응형으로 변환된 Embed code를 볼 수 있습니다. 이 코드를 모두 복사합니다. 



그리고 티스토리 블로그 글쓰기 '외부컨텐츠'를 클릭해서 멀티미디어 첨부를 합니다. 



짜잔~깔끔하게 반응형으로 잘 나오죠? ▲


이상 "유튜브 동영상 반응형으로 블로그 올리는 방법"이었습니다.