Studio Two 에디터: 링크 또는 HTML 코드 임베드하기
이 도움말은 2026년 11월에 출시된 새로운 Studio Two 에디터에 관한 내용입니다. Studio 에디터와 Studio Two 에디터 중 어떤 에디터를 사용 중인지 확실하지 않다면 여기에서 자세한 내용을 확인하세요.
코드 스니펫이나 외부 URL을 임베드해 다른 플랫폼의 콘텐츠를 표시할 수 있습니다. 카운트다운 타이머나 날씨 위젯 같은 사용자 지정 구성 요소를 추가하거나 다른 사이트의 콘텐츠를 표시해 방문자에게 필요한 모든 정보를 한곳에서 제공하세요.
코드 또는 사이트 임베드하기
**요소 추가** 패널에서 사이트에 iFrame을 바로 추가할 수 있습니다. 코드 또는 사이트 중 임베드할 항목을 선택한 후 코드나 웹 주소를 붙여넣으면 iFrame에 표시됩니다.
코드나 링크를 임베드하기 전에 가이드라인을 확인하세요.
콘텐츠를 임베드하려면 다음 단계를 따르세요.
왼쪽 상단의 요소 추가
아이콘에 마우스오버합니다.요소를 선택합니다.
임베드 아이콘을 클릭합니다.
코드 임베드 또는 사이트 임베드 요소를 페이지로 드래그합니다.
액션바에서 설정
아이콘을 클릭합니다.아래에서 해당하는 단계를 따릅니다.
아이콘을 클릭합니다.
표시되는 콘텐츠 크기 조정하기
삽입된 요소에는 해당 요소를 가져온 서비스에서 픽셀 단위로 지정한 너비와 높이가 포함되는 경우가 많습니다. 아래 예시를 참고하세요.
1<iframe width="560" height="315"
2 src="https://www.wix.com"
3 frameborder="0">
4</iframe>캔버스의 iFrame 컨테이너가 560px×315px보다 작으면 콘텐츠가 잘릴 수 있습니다. 콘텐츠가 잘리지 않도록 아래와 같이 px 값을 퍼센트 단위로 변경하고 100%로 설정합니다.
1<iframe width="100%" height="100%"
2 src="https://www.wix.com"
3 frameborder="0">
4</iframe>가이드라인
코드 또는 링크를 iFrame에 삽입하기 전에 다음 가이드라인을 확인하세요.
코드
삽입할 코드가 최신 버전이며 HTML5와 호환되는지 항상 확인하세요. 이전 버전의 HTML로 작성된 페이지와 스크립트는 대부분의 브라우저에서 제대로 표시되지 않습니다.
HTML 코드는 페이지의 핵심 요소를 포함하지만, 디자인 설정과 기타 복잡한 기능은 일반적으로 별도로 저장됩니다. 따라서 CSS 및 JS 파일과 같은 관련 요소가 HTML 코드에 참조로 포함되지 않으면 일부 요소가 제대로 작동하지 않거나 디자인이 다르게 표시될 수 있습니다.
링크
target 속성 사용 방법을 잘 모르겠다면 여기에서 자세히 알아보거나 코드 제작자에게 문의하세요.
링크에 HTTP가 아닌 HTTPS가 포함되어 있는지 확인하세요. 그렇지 않으면 라이브 사이트에 표시되지 않습니다.