반응형 코드로 만들기
식스샵 프로는 반응형 웹사이트를 제공하고 있어요.
기기나 브라우저 크기에 맞게 영상 크기가 조절되도록 반응형 링크로 변경 후 활용해 주세요.
아래 예시를 참고해 반응형 코드로 만들어 주세요.
유튜브 영상을 우클릭해 ‘동영상 URL복사’를 눌러, 영상 URL을 복사해 주세요.https://youtu.be/mIvLz3iVv3Y
youtu.be를 youtube.com/embed로 변경해 주세요.https://youtube.com/embed/mIvLz3iVv3Y
2번 링크 끝에 ?autoplay=1&mute=1를 붙여주세요.https://youtube.com/embed/mIvLz3iVv3Y?autoplay=1&mute=1
아래 코드 중 ‘링크를 넣어주세요’ 부분에 위에서 만든 링크를 넣어주세요. 아래 코드는 예시입니다.<figure style="aspect-ratio: 16/9; width:100%; overflow:hidden;">
<iframe src="링크를 넣어주세요" style="width:100%; height: 100%;" title="Youtube Video Player" frameBorder="0" allowFullScreen/></figure>
HTML
복사
유튜브 영상 추가하기
영상을 노출할 영역에 HTML 블록을 추가해 주세요. 아래 코드는 예시입니다.
예시)
<figure style="aspect-ratio: 16/9; width:100%; overflow:hidden;">
<iframe src="https://youtube.com/embed/mIvLz3iVv3Y?autoplay=1&mute=1" style="width:100%; height: 100%;" title="Youtube Video Player" frameBorder="0" allowFullScreen/></figure>
HTML
복사
HTML 블록 안내서로 돌아가기
식스샵 프로 가이드로 돌아가기