[티스토리 팁] 모바일에서 유튜브 영상이 나타나지 않을 때

#blueidblues - test

안녕하세요. 블로그 관련 포스팅은 오랜만에 해보는것 같네요. ^^;; 알렉사 관련 포스팅도 하나도 못하고 있고....맛집 포스팅들도 쌓이고 있고 회사일은 바쁘고. 좋아해야 할지 말아야 할지 고민입니다. ^^;;

오늘 포스팅 주제는 아이프레임으로 유튜브 영상을 삽입했을 경우 모바일에서 해당 영상을 포함한 부분이 보이지 않는 현상에 대한 해결방법을 공유드리려고 합니다.

관련글들을 검색해보니 크게 아래 두 가지 해결책에 대해서 말씀을 해주신분들이 많더라구요.

• 유튜브 영상 사이즈 문제로 포스팅이 틀어지는 현상
• 아이프레임과 플러그인을 사용해서 유튜브 영상을 등록하는 방법

하지만 그렇지만 저의 경우 #1 스킨을 사용중인데 반응형 스킨인 만큼 소스코드 복사하기로 그대로 붙여도 영상이 화면크기에 맞게 잘 나오고 있었더랬습니다.

그런데 문제는 가끔 모바일에서 확인할 경우 유튜브 영상부분부터 그 아래쪽 일부 영역까지가 포스팅에서 아에 잘려져서 나오지 않는 경우입니다.

이 문제 때문에 스킨 소스코드를 손대야하나 기타등등 고민이 많았는데. 문제는 간단한 곳에 있었습니다.

유튜브에서 복사해왔던 소스코드 중 URL 부분이 문제였습니다.

<아이프레임(영어로) 블라블라 src="https://동영상 링크 주소> 를

<아이프레임(영어로) 블라블라 src="http://동영상 링크 주소> 로 고침. 즉 s를 지움.

왜 저렇게 되는지는 정확하게는 잘 모르겠습니다. ^^;;;

포스팅을 위해서 일단 s 를 다시 삽입한 다음에 시도해봤더니 이번에는 나오더군요. 일단 한번 노출되기만 하면 그 다음에는 s가 붙든 말든 상관없는것 같습니다.

아무튼 저랑 비슷한 고민을 하셨던 html 잘알못 분들이 있을까봐 공유드립니다.

짧은 포스팅을 마치도록 하겠습니다. ^^