웹사이트에 유튜브 영상 퍼가기 (반응형)
어떤 화면에도 맞는 유튜브 영상 퍼가기: 공유 메뉴, 반응형 코드, 시작 시간, 개인정보 보호 강화 모드, 워드프레스, 속도 팁.
어떤 유튜브 동영상이든 시작 시간, 자동 재생, 반복, 개인 정보 옵션을 넣은 깔끔한 반응형 퍼가기 코드를 만들 수 있습니다.
링크를 붙여 넣으면 코드가 만들어집니다.
유튜브 영상을 퍼가면 재생은 유튜브가 맡고, 방문자는 내 페이지에 머뭅니다. 유튜브 공유 창의 기본 코드도 작동하지만 560×315 고정 크기라 휴대폰에 맞지 않고, 시작·종료 시간 같은 유용한 설정도 숨어 있습니다. 이 생성기는 모든 설정을 체크박스로 고를 수 있는 깔끔한 반응형 퍼가기 코드를 만들고, 복사하기 전에 실시간 미리보기도 보여 줍니다.
| 옵션 | 코드의 매개변수 | 알아 두면 좋은 점 |
|---|---|---|
| 시작/종료 시간 | start=85&end=140 | 초 단위이며, 1:25라고 써도 자동 변환됩니다 |
| 반응형 | width:100%; aspect-ratio:16/9 | 어떤 화면에서도 영역을 채움. 해제하면 고정 크기 지정 |
| 개인 정보 보호 강화 | youtube-nocookie.com | 재생 전까지 유튜브 쿠키 없음 |
| 자동 재생 | autoplay=1&mute=1 | 브라우저는 소리 없는 자동 재생만 허용 |
| 반복 재생 | loop=1&playlist=ID | 영상 한 개를 반복하려면 playlist 매개변수가 필요 |
| 컨트롤 표시 | 끄면 controls=0 | 배경 영상에 적합, 강의 영상에는 비추천 |
| 자막 켜기 | cc_load_policy=1 | 자막이 있으면 기본으로 표시 |
코드에는 loading="lazy"도 들어 있어 방문자가 가까이 스크롤했을 때만 플레이어를 불러오고, 스크린 리더용 title도 포함됩니다.
<body> 안 영상이 들어갈 자리에 붙여넣으세요.쇼츠도 퍼갈 수 있습니다. 생성기가 /shorts/ 링크를 일반 퍼가기 코드로 바꿔 줍니다. 쇼츠는 세로 영상이니 반응형을 해제하고 315 × 560 같은 크기를 지정해야 양옆에 검은 띠가 있는 넓은 상자가 되지 않습니다.
플레이어 대신 링크가 필요하다면 타임스탬프 링크 생성기로 원하는 시간부터 시작하는 링크를 만드세요. 플랫폼별 자세한 방법은 유튜브 영상 웹사이트에 퍼가는 방법에서 확인하세요.
영상 링크를 생성기에 붙여넣고 옵션을 고른 뒤 코드 복사를 누르세요. 그다음 iframe 코드를 페이지에 붙여넣으면 됩니다. 워드프레스는 사용자 정의 HTML 블록, 티스토리와 블로거는 HTML 모드, Wix나 Squarespace는 임베드/코드 요소를 쓰세요.
크롬, 사파리, 파이어폭스, 엣지는 소리와 함께 저절로 재생되는 영상을 막습니다. 음소거 자동 재생은 허용되므로 자동 재생을 체크하면 mute=1이 자동으로 들어갑니다.
플레이어를 youtube-nocookie.com에서 불러와 방문자가 재생을 누르기 전까지 유튜브 쿠키를 저장하지 않습니다. 모양과 기능은 같고, GDPR 등 개인정보 규정 대응에 도움이 됩니다.
반응형을 체크하세요. 코드가 width:100%와 aspect-ratio:16/9를 사용해 휴대폰과 PC에서 검은 띠나 추가 CSS 없이 영역을 꽉 채웁니다.
소유자가 퍼가기를 막았거나, 비공개·연령 제한 영상이거나, 방문자 국가에서 차단됐거나, 링크가 잘못됐을 수 있습니다. 먼저 실시간 미리보기에서 확인하세요. 거기서 안 되면 사이트에서도 안 됩니다.
네. 시작 시간과 종료 시간을 입력하면 그 구간만 재생하고 멈춥니다. 긴 강의나 방송에서 한 장면만 보여 줄 때 좋습니다.
watch, youtu.be, 쇼츠, 퍼가기, 라이브 링크에서 11자리 유튜브 영상 ID를 찾는 법. PC·휴대폰 모두, 많은 링크에서 한 번에 추출하는 방법까지.