티스토리를 운영하다 보면 반응형 스킨에 눈이 갈 때가 있습니다.

저도 최근에 일반 2단 형에서 반응형 2단 형으로 스킨을 교체하였습니다.

하지만 반응형 스킨이 모든 이전 글들을 많이 흔들어 놨네요.

그중 유튜브 동영상이나 구글맵같은 외부콘텐츠로 등록한 것들이 문제가 되었습니다.

폰으로 보면 깨지거나 크기를 벗어나거나 하는.


아래 소개하는 내용은 이런 문제를 조금 해결해 줄 수 있는 사이트의 소개입니다.


http://embedresponsively.com/

클릭해서 이동합니다.




이동하면 바로 보이는 사이트의 화면은 정말 단순하게 구성되어 있습니다.

원하는 embed 속성 컨텐츠를 각각 카테고리에 맞게 붙여 넣고 Embed를 클릭하면 끗.


먼저 유튜브를 보자면




원하는 동영상의 공유 화면에서 유튜브 주소를 복사한 후에 처음 사진처럼 붙여넣고 Embed 클릭.




그럼 사이트 하단에 위 사진 같은 변형된 코드가 생성 됩니다.




그리고 생성된 코드를 복사해서 외부콘텐츠 삽입에 붙여넣으면 됩니다.


아래는 그렇게 생성한 유튜브 영상 입니다.





반응형 화면에 맞게 잘 나오네요.

월이 구동개조 포스트는 여기를 참고 하세요.









다음은 구글맵 등록입니다.




원하는 구글맵을 찾아 공유를 클릭해서 지도 퍼가기로 들어갑니다.

사이즈는 상관없지만 이왕이면 안전하게 중간으로 선택했습니다.




구글맵 탭을 선택해 마찬가지로 Embed를 눌러 변형합니다.




위에서 설명한 것과 같이 생성된 구글맵 코드를 복사합니다.




외부콘텐츠 삽입에서 붙여넣기 하면 완성~


아래는 이렇게 생성한 구글맵입니다.




광명동굴 포스트는 여기를 참고하세요.


티스토리는 사용자 친화적이지 않기 때문에 많은 부분을 스스로 해결해야 하는 어려움이 있습니다.

하지만 길은 찾으면 반드시 있으니 반응형 스킨으로 고통받는 분들에게 도움이 되었으면 좋겠습니다.




이 포스트가 도움이 되셨다면 아래 하트 한번 꾸~욱~ 부탁드립니다!