CMS: 업로드 버튼 추가 및 설정하기

6 분 분량
사이트 방문자가 CMS 컬렉션에 직접 파일을 제출할 수 있도록 업로드 버튼을 추가하세요.문서, 이미지, 동영상, 오디오 등 접수할 파일의 형식을 선택할 수 있습니다.업로드된 파일은 사용자가 관리할 수 있도록 컬렉션에 안전하게 저장됩니다. 
시작하기 전:
버튼을 추가하기 전, 방문자로부터 정보를 수집할 수 있는 좋은 방법인 사용자 지정 양식에 익숙해 지는 것이 좋습니다.
업로드 버튼과 제출 버튼이 포함된 사용자 지정 양식의 스크린샷

1 단계 | 업로드 버튼 추가 및 연결하기

먼저 "업로드" 버튼으로 사용할 버튼을 추가합니다. 이 버튼은 방문자가 업로드할 파일을 선택하기 위해 클릭하는 버튼입니다. 

또한, 업로드한 파일을 저장하고 있는 컬렉션에 연결되는 데이터세트에 버튼을 연결해야 합니다. 선택한 컬렉션에 올바른 권한이 부여되어 있는지 확인하세요. 권한 및 개인정보 보호 설정에서 양식 제출을 누구든지 콘텐츠를 추가할 수 있도록 설정하는 것이 좋습니다.
새로운 데이터세트 환경:
Wix Studio에서는 데이터세트를 오른쪽의 속성 패널로 이동해 더 쉽게 사용할 수 있도록 했습니다. Wix Studio의 새로운 데이터세트 환경에 대한 자세한 도움말을 확인하세요. 

업로드 버튼을 추가 및 연결하려면:

  1. 추가 패널로 이동합니다.
    • Wix 에디터: 에디터 왼쪽에서 요소 추가를 클릭합니다.
    • 에디터 X: 에디터 X 상단에서 요소 추가를 클릭합니다.
  2. 입력 요소를 클릭한 후 업로드 버튼을 클릭합니다.
  3. 버튼을 선택해 사이트로 끌어다 놓습니다.
  4. 페이지의 버튼을 클릭합니다.
  5. 데이터 연결 아이콘을 클릭합니다(에디터 X의 경우 ).
  6. 데이터세트 추가를 클릭합니다.
  7. 컬렉션 선택 드롭다운을 클릭해 방문자가 파일을 업로드할 컬렉션을 선택합니다.
    도움말: 방문자가 파일을 업로드할 새 컬렉션을 추가하려면 컬렉션 선택 드롭다운을 클릭한 후 컬렉션 추가를 선택합니다. 
  8. (선택사항) 데이터세트 이름 입력란에 데이터세트 이름을 입력합니다.
  9. 만들기를 클릭합니다.
  10. 파일 연결 대상 드롭다운을 클릭한 후 업로드 버튼을 연결할 입력란을 선택합니다.
    도움말: 업로드 버튼을 컬렉션의 새 입력란에 연결하려면 입력란 추가를 클릭합니다. 그리고, 입력란 이름을 입력하고 입력란 유형을 선택한 후 추가를 클릭합니다. 
업로드 버튼 연결 패널을 보여주는 업로드 버튼 스크린샷

2 단계 | 업로드 버튼 설정 및 디자인하기

다음으로, 방문자가 업로드할 파일 유형과 버튼 설정의 기타 옵션을 선택합니다. 버튼의 레이아웃과 디자인을 사용자 지정해 원하는 대로 표시할 수 있습니다. 

업로드 버튼을 설정 및 디자인하려면:

  1. 페이지에서 업로드 버튼을 클릭합니다. 
  2. 설정 아이콘을 클릭해 다음 옵션 중에서 선택합니다. 
    • 업로드 설정: 방문자가 업로드할 수 있는 파일 유형을 선택하고 방문자가 업로드할 수 있는 최대 파일 수 및 입력란을 필수로 설정합니다(선택사항). 
    • 표시 옵션 지정: 다음 옵션을 사용자 지정합니다.
      • 입력란 텍스트: (권장사항) 버튼 텍스트 위에 표시되는 텍스트를 입력합니다. 
      • 버튼 텍스트: 버튼에 표시될 텍스트를 편집합니다. 
      • 버튼 아래 텍스트: 버튼 아래에 표시할 내용을 선택합니다.
        • 파일 정보 표시: 방문자가 업로드한 파일 이름을 표시합니다. 
        • 사용자 지정 텍스트 표시: 파일 요구 사항과 같이 버튼 아래에 표시할 사용자 지정 텍스트를 입력합니다. 해당 텍스트는 업로드가 완료되면 파일 이름으로 변경됩니다. 
    • 방문자 파일 관리: 업로드 파일 보기 를 클릭해 미디어 관리자의 방문자 업로드 파일 폴더로 이동합니다. 
업로드 버튼 설정 스크린샷
  1. 레이아웃 아이콘을 클릭해 텍스트 및 아이콘 위치, 텍스트 정렬 또는 입력란과 입력란 텍스트 사이의 간격을 변경합니다. 
  2. 디자인 아이콘을 클릭한 후 프리셋 디자인을 선택합니다.디자인 사용자 지정을 클릭해 버튼 디자인을 추가로 사용자 지정합니다.
버튼 디자인 패널을 보여주는 업로드 버튼 스크린샷

3 단계 | 제출 버튼 추가 및 설정하기

방문자가 클릭해 파일 제출을 완료할 수 있는 "제출" 버튼이 필요합니다. 다른 버튼을 추가해 '제출' 버튼으로 지정하세요. 그런 다음 설정하고 제출 버튼을 업로드 버튼과 동일한 데이터세트에 연결합니다. 

제출 버튼을 추가 및 설정하려면:

  1. 추가 패널로 이동합니다.
    • Wix 에디터: 에디터 왼쪽에서 요소 추가를 클릭합니다.
    • 에디터 X: 에디터 X 상단에서 요소 추가를 클릭합니다.
  2. 버튼을 클릭합니다.
  3. 버튼을 선택해 페이지로 끌어다 놓습니다.
  4. 텍스트 및 아이콘 변경을 클릭한 후 버튼 텍스트 입력란에 "제출"을 입력합니다.
    도움말: 제출 버튼에 텍스트를 표시하려면 표시할 항목 선택드롭다운을 텍스트 또는 텍스트 및 아이콘으로 설정합니다.
제출 버튼 설정 스크린샷
  1. 데이터 연결 아이콘을 클릭합니다(에디터 X의 경우 ).
  2. 데이터세트 연결 드롭다운이 1단계에서 연결한 데이터세트로 설정되어 있는지 확인합니다. 
  3. 클릭 시 수행 작업 드롭다운을 클릭한 후 제출을 선택합니다.
  4. (선택사항) 방문자가 문서 업로드를 완료하면 표시될 성공 메시지를 추가합니다.
    1. + 성공 메시지 추가를 클릭합니다. 
    2. 에디터에서 성공 메시지를 선택해 메시지를 편집합니다. 
    3. 성공 메시지를 클릭해 원하는 위치로 끌어다 놓습니다. 
  5. (선택사항) 방문자가 문서 업로드에 실패하면 표시될 실패 메시지를 추가합니다.
    1. 제출 버튼을 선택한 후 데이터 연결 아이콘(또는 에디터 X의 경우 )을 클릭합니다.
    2. + 실패 메시지 추가를 클릭합니다. 
    3. 에디터에서 오류 메시지를 선택한 후 메시지를 편집합니다. 
    4. 실패 메시지를 클릭해 원하는 위치로 끌어다 놓습니다. 성공 메시지와 동시에 표시되지 않으므로 겹치게 놓을 수 있습니다. 
  6. 성공 시 이동 페이지 드롭다운을 클릭해 옵션을 선택합니다.
    • 페이지에 남기: 방문자는 양식을 제출한 후 페이지에 머무릅니다.
    • 링크: 방문자는 양식을 제출한 후 다른 페이지로 리디렉트됩니다. 링크 선택 아래에서 선택하기를 클릭해 링크를 설정합니다. 

방문자가 파일을 다운로드할 수 있도록 하려면:
버튼과 같은 입력 요소를 사이트에 추가해 컬렉션에서 방문자가 파일을 다운로드하도록 허용할 수 있습니다. 데이터 연결 아이콘을 사용(에디터 X의 경우 )해 버튼을 해당 파일이 저장된 입력란에 연결합니다.완료 후 연결된 버튼을 클릭하면 해당 파일은 즉시 다운로드됩니다.

도움이 되었나요?

|