CMS: 텍스트 입력 추가 및 설정하기

6 분 분량
텍스트 입력, 텍스트 상자 또는 리치 텍스트 상자 요소를 추가해 이메일, 전화번호 등 사용자로부터 일반적인 데이터를 수집하세요. 텍스트 요소를 컬렉션에 연결하면 수집한 정보를 저장하고 언제든지 액세스할 수 있습니다.
텍스트 입력 요소 및 제출 버튼의 예시 스크린샷
시작하기 전:
아직 추가하지 않았다면, 에디터에 CMS(콘텐츠 관리 시스템)를 추가하세요. 

1 단계 | 텍스트 입력 요소 추가 및 설정하기

입력에 한 줄을 사용하는 텍스트 입력 또는 여러 줄의 텍스트를 추가할 수 있는 공간을 제공하는 텍스트 상자를 추가하세요. 추가한 후에는 사이트의 요구 사항에 맞게 입력 요소의 설정, 레이아웃 및 디자인을 사용자 지정합니다. 
Wix 에디터
Studio 에디터
  1. 에디터 왼쪽에서 요소 추가를 클릭합니다.
  2. 입력을 클릭합니다.
  3. 추가하고자 하는 텍스트 입력 유형을 클릭합니다. 
    • 텍스트 입력: 방문자가 한 줄로 입력란에 텍스트를 입력하거나 편집할 수 있도록 합니다.
    • 텍스트 상자: 방문자가 여러 줄을 입력할 수 있는 입력란에 텍스트를 입력하거나 편집할 수 있도록 합니다. 
Wix 에디터에서 텍스트 입력 요소를 추가하는 스크린샷
  1. 원하는 텍스트 입력 요소를 클릭해 페이지로 끌어다 놓습니다. 
  2. 입력 요소에서 설정을 클릭한 후 다음을 편집합니다. 
    • 유형: (텍스트 입력 요소만 해당) 텍스트 입력이 허용하는 정보 유형을 선택합니다. 
      • 텍스트: 이름, 주소 또는 패턴을 따르지 않는 기타 정보와 같은 입력에 모든 문자 유형을 허용합니다.
      • 비밀번호: 비밀번호 입력란에 입력된 모든 문자를 비공개합니다. 
      • 숫자: 입력에 숫자만 허용합니다. 
      • 이메일: 이메일 주소만 허용합니다. 유효하지 않은 이메일 주소 형식을 입력하면, 툴팁이 사용자에게 경고합니다. 
      • URL: 웹 주소만 허용합니다. 잘못된 URL 형식을 입력하면, 툴팁이 사용자에게 경고합니다. 
      • 전화번호: 입력에 모든 문자 유형을 허용합니다.
    • 입력란 제목: 입력 요소 위에 표시되는 제목을 입력합니다. 
    • 기본 텍스트 표시: 입력란에 표시될 기본 텍스트를 선택하고 필요한 경우 플레이스홀더 및 기본 텍스트를 입력합니다. 
    • 유효성 검사: 다음 옵션 중에서 선택합니다. 
      • 입력란 유형: 해당 옵션을 선택합니다.
        • 필수 입력사항으로 지정: 방문자가 제출하기 전 입력란에 값을 입력하도록 합니다. 
        • 읽기 전용으로 지정: 요소가 콘텐츠만 표시하도록 설정합니다. 방문자는 값을 편집할 수 없으나 복사할 수는 있습니다.
      • 글자 수 제한 설정: 버튼을 활성화해 방문자의 게시물 제출을 설정된 글자 수로 제한한 후 최대 글자 수를 입력합니다.
      • 패턴 유효성 검사 추가: (텍스트 입력 요소만 해당) 버튼을 활성화하고 정규식 코드를 입력해 브라우저의 기본 유효성 검사에 고유한 패턴 유효성 검사를 추가할 수 있습니다.
      • 오류 메시지 형식: 오류 메시지가 표시되는 방식을 인라인 또는 툴팁 중에 선택합니다. 
텍스트 입력 요소 설정 편집 스크린샷
  1. 레이아웃 아이콘을 클릭해 들여쓰기, 간격, 텍스트 방향 및 정렬을 편집합니다. 
  2. 디자인 아이콘을 클릭해 프리셋 디자인을 선택합니다. 선택 후에는 디자인 사용자 지정을 클릭해 디자인을 추가로 조정합니다. 

2 단계 | 텍스트 입력을 CMS에 연결하기

컬렉션 및 제출물을 저장하고자 하는 입력란에 연결되는 데이터세트에 텍스트 입력을 연결하세요. 필요한 경우, 데이터세트 모드 및 컬렉션 권한을 설정합니다. 그 다음, 방문자가 자신의 입력을 컬렉션에 보내기 위해 클릭해야 하는 제출 버튼을 추가하세요.
Wix 에디터
Studio 에디터
  1. 에디터에서 해당 텍스트 입력 요소를 클릭합니다.
  2. CMS에 연결 아이콘을 클릭합니다.
  3. 데이터세트 선택 드롭다운을 클릭해 컬렉션에 연결할 기존 데이터세트를 선택합니다. 또는, 데이터세트 추가를 클릭한 후 연결할 컬렉션을 선택하고 데이터세트에 이름을 지정한 후 추가를 클릭 합니다.
  4. 값 연결 대상 드롭다운을 클릭해 제출 텍스트를 저장할 컬렉션 입력란을 선택합니다.
    도움말: 입력란 추가를 클릭하고 새 컬렉션 입력란을 추가해 제출 양식을 저장하세요.
CMS에 연결된 텍스트 입력의 스크린샷
  1. 데이터세트 모드 및 컬렉션 권한을 설정합니다.
    1. 데이터세트 설정을 클릭합니다.
    2. 데이터세트 모드 드롭다운을 클릭한 후 쓰기 또는 읽기 및 쓰기를 선택합니다.
    3. (필요한 경우) 컬렉션 권한 옆 권한 유형을 클릭한 후 첫 번째 드롭다운에서 양식 제출을 선택합니다. 추가 드롭다운을 클릭해 권한을 구체화할 수 있습니다. 권한 설정을 완료하면, 저장을 클릭합니다. 
  2. 방문자가 입력 내용을 제출하기 위해 클릭하는 제출 버튼을 생성합니다.

도움이 되었나요?

|