코드 내보내기 - Webflow 도움말

Last updated on 10/26/2025@mrbirddev
코드 내보내기 - Webflow 도움말
Webflow 사이트의 HTML, CSS, JavaScript, 자산을 내보내세요.

유료 워크스페이스 플랜에서는 사이트의 HTML, CSS, JavaScript, 자산을 내보내어 코드를 백업하거나 클라이언트에게 제공하거나 원하는 곳에 호스팅할 수 있습니다 — 출처 표시는 필요하지 않습니다.

코드 내보내기는 워크스페이스 플랜에서만 가능합니다 — 사이트 플랜에는 사이트의 코드를 내보내는 기능이 포함되어 있지 않습니다.

코드를 내보내는 방법

  1. Webflow에서 사이트 열기
  2. 메인 메뉴 > 코드 내보내기로 이동 (왼쪽 상단의 "W" 로고를 클릭하여 메인 메뉴 열기), 또는 Shift + E 누르기
  3. ZIP 준비 클릭
  4. ZIP 파일 다운로드
CMS, 사용자 계정, 전자상거래 콘텐츠(데이터베이스), 코드 구성 요소 및 기능, 로컬라이즈된 페이지, 요소 및 콘텐츠는 내보낸 코드에 포함되지 않습니다. 내보낸 사이트에서는 컬렉션 목록이 빈 상태로 표시되며, 컬렉션 페이지는 컬렉션 필드에 바인딩된 콘텐츠를 표시하지 않습니다. 사이트의 비밀번호 보호 페이지는 코드 내보내기 후 더 이상 보호되지 않습니다. 또한, GDPR 준수를 위해 내보낸 사이트에서는 사이트 검색 및 양식(파일 업로드 및 reCAPTCHA 포함)이 작동하지 않습니다.

최소화된 HTML 내보내는 방법

HTML을 최소화하면 공백, 주석 및 브라우저가 페이지를 로드하는 데 필요하지 않은 기타 코드 요소를 제거하여 페이지 로드 시간을 개선할 수 있습니다. 최소화된 HTML을 내보내려면:

  1. Webflow에서 사이트 열기
  2. 메인 메뉴 > 코드 내보내기로 이동 (왼쪽 상단의 "W" 로고 클릭), 또는 Shift + E 누르기
  3. Command + O (Mac) 또는 Control + O (Windows) 누르기
  4. 내보내기 창에 나타나는 HTML 최소화 체크박스 선택
  5. ZIP 준비 클릭
  6. ZIP 파일 다운로드

내보낸 파일에 포함된 내용

다운로드한 ZIP 파일에는 사이트의 모든 페이지, 스타일, 스크립트 및 이미지가 포함되어 있습니다:

  • CSS 폴더에는 사이트의 모든 스타일이 3개의 .css 파일에 포함되어 있습니다: - 사이트의 모든 사용자 정의 스타일이 포함된 CSS 파일 (예: your-site-name.css) - Webflow 레이아웃 구성 요소의 공통 기본 스타일이 포함된 webflow.css - 모든 요소를 일관되게 렌더링하도록 하는 normalize.css
  • JS 폴더에는 사이트의 모든 JavaScript 파일이 포함되어 있습니다. 양식, 내비게이션 바, 슬라이더, 탭 및 상호작용과 같은 요소와 기능은 이 파일들에 의존합니다. 이 파일들을 삭제하면 페이지가 올바르게 보일 수 있지만 예상대로 작동하지 않을 수 있습니다.
  • 사이트의 자산 패널에 업로드된 모든 이미지가 포함된 이미지 폴더

  • 사이트의 모든 페이지에 대한 .html 파일 (빈 컬렉션 템플릿 페이지 포함)

CMS, 사용자 계정, 전자상거래 콘텐츠 및 기능, 그리고 로컬라이즈된 페이지, 요소 및 콘텐츠는 내보낸 코드에 포함되지 않습니다. 내보낸 사이트에서는 컬렉션 목록이 빈 상태로 표시되며, 컬렉션 페이지는 컬렉션 필드에 바인딩된 콘텐츠를 표시하지 않습니다. 사이트의 비밀번호 보호 페이지는 코드 내보내기 후 더 이상 보호되지 않습니다. 또한, GDPR 준수를 위해 내보낸 사이트에서는 사이트 검색 및 양식(파일 업로드 및 reCAPTCHA 포함)이 작동하지 않습니다.

알아두면 좋은 점

Webflow가 내보내는 코드의 샘플을 보고 싶다면 홈페이지의 소스 코드를 확인해 보세요. 모두 Webflow로 구축되었습니다!

내보낸 파일에 포함되지 않은 내용

다음 기능과 콘텐츠는 내보낸 코드에 포함되지 않으며 내보낸 웹사이트에서 예상대로 작동하지 않습니다:

  • CMS 콘텐츠 및 기능 (컬렉션 항목 및 컬렉션 목록 포함)
  • 사용자 계정 콘텐츠 및 기능 (사용자 및 액세스 그룹 포함)
  • 전자상거래 콘텐츠 및 기능 (제품 및 결제 포함)
  • 사이트 및/또는 페이지 비밀번호 보호
  • 양식 제출 처리
  • 기존 양식 제출 (별도로 내보낼 수 있음)
  • 양식 내의 reCAPTCHA 요소
  • 사이트 검색
  • 로컬라이즈된 콘텐츠 (사이트의 기본 로케일의 페이지, 요소 및 콘텐츠만 포함)
  • 코드 구성 요소
CMS 컬렉션(현지화된 컬렉션 콘텐츠 포함), 전자상거래 컬렉션 및 사용자 계정을 CSV 형식으로 내보내 컬렉션 항목, 사용자 계정 및 제품의 백업을 저장할 수 있습니다.

FAQ 및 문제 해결 팁

클래스 이름 앞에 "w-" 접두사가 있는 이유는 무엇인가요?

Webflow는 다른 코드 프레임워크와의 충돌을 피하기 위해 구성 요소별 클래스에 "w-" 접두사를 붙입니다.

사이트 코드의 일부만 내보낼 수 있나요?

현재로서는 내보낼 항목을 선택할 수 없습니다. 내보낼 수 있는 사이트의 모든 부분이 각 내보내기에 포함됩니다.

코드를 내보낸 후 수정할 수 있나요?

코드를 내보낸 후 수정할 수 있습니다. 내보낸 파일을 수동으로 변경하면 일부 Webflow 구성 요소가 손상될 수 있습니다.

내보낸 페이지의 URL에서 .html 확장자를 제거할 수 있나요?

내보낸 페이지에서 .html 확장자를 제거하려면 .htaccess 파일을 사용하면 됩니다.

사이트를 외부에 호스팅할 경우 Webflow에 출처를 제공해야 하나요?

아니요, 사이트를 외부 서버에서 작동시키기 위해 Webflow에 출처를 제공하거나 Webflow 플랜을 유지할 필요는 없습니다.

내보낸 코드에 CMS, 멤버십 및 전자상거래 콘텐츠가 포함되나요?

아니요. CMS, 사용자 계정 및 전자상거래 콘텐츠(데이터베이스)는 내보낸 코드에 포함되지 않습니다. 컬렉션 목록은 빈 상태를 표시합니다.

내보낸 코드에 현지화된 페이지, 요소 및 콘텐츠가 포함되나요?

아니요. 현지화된 페이지, 요소 및 콘텐츠는 내보낸 코드에 포함되지 않습니다. 내보낸 코드는 기본 로케일만 포함합니다.

내 코드를 내보낸 후에도 비밀번호로 보호된 페이지가 여전히 보호되나요?

아니요. 사이트의 비밀번호로 보호된 페이지는 코드 내보내기 후 보호되지 않습니다. 비밀번호 보호가 제대로 작동하려면 사이트가 Webflow에 호스팅되어야 합니다.

코드를 다른 곳에 호스팅하면 사이트의 모든 요소가 작동하나요?

CMS, 사용자 계정, 전자상거래 콘텐츠 및 기능, 그리고 현지화된 페이지, 요소, 콘텐츠는 내보낸 코드에 포함되지 않습니다. 이러한 기능은 호스팅이 필요합니다. 또한, 사이트 검색 및 양식(파일 업로드 및 reCAPTCHA 포함)은 GDPR 준수를 위해 내보낸 사이트에서 작동하지 않습니다.

사이트를 내보낼 때 Lottie 애니메이션이 로컬에서 작동하지 않는 이유는 무엇인가요?

보안상의 이유로, Lottie JSON 파일은 로컬 파일 시스템에서 로드되지 않으므로, 사이트를 로컬에서 로드할 때 Lottie 애니메이션이 나타나지 않습니다. 웹 서버가 필요합니다.


Webflow 도움말로 돌아가기

Last updated on 10/26/2025@mrbirddev
Recent Articles
Loading...