header-logo
Wix를 사용해해 사이트와 비즈니스를 구축하는 방법을 알아보세요.
직관적인 Wix 기능을 사용해 사이트를 디자인하고 관리하세요.
구독, 플랜 및 인보이스를 관리하세요.
비즈니스를 운영하고 회원과 소통하세요.
도메인을 구매하고 사이트에 연결, 이전하는 방법을 알아보세요.
비즈니스 및 웹 존재감을 키울 수 있는 도구를 확인하세요.
SEO 및 마케팅 도구로 가시성을 높이세요.
보다 효율적으로 작업할 수 있는 고급 기능을 활용하세요.
해결책을 찾고, 알려진 문제에 대해 알아보거나 문의하세요.
placeholder-preview-image
강좌 및 튜토리얼을 통해 실력을 향상시키세요.
웹 디자인, 마케팅 등에 대한 팁을 확인하세요.
검색 엔진에서 유기적 사이트 트래픽을 증가시키는 방법을 알아보세요.
풀스택 플랫폼을 활용해 맞춤형 사이트를 구축하세요.
목표 달성에 도움을 줄 전문가를 만나보세요.
placeholder-preview-image

CMS: 주소 입력 요소 추가 및 설정하기

4 분
페이지 메뉴
  • 1 단계 | 주소 입력 추가 및 설정하기
  • 2 단계 | CMS에 주소 입력 연결하기
방문자가 컬렉션에 주소를 제출할 수 있도록 주소 입력 요소를 추가하세요. 주소 입력은 Google의 검색 및 자동 완성 기능을 사용해 방문자가 필요한 정보를 찾을 수 있도록 합니다. 
주소 입력 요소를 주소 컬렉션 입력란에 연결하는 스크린샷
시작하기 전:

1 단계 | 주소 입력 추가 및 설정하기

페이지에 주소 입력을 추가한 후 요소의 설정, 레이아웃 및 디자인을 사용자 지정하세요. 
Wix 에디터
Studio 에디터
  1. 에디터로 이동합니다.
  2. 왼쪽 메뉴에서 요소 추가 아이콘을 클릭합니다.
  3. 입력을 클릭합니다.
  4. 주소 입력을 클릭합니다. 
  5. 원하는 주소 입력 요소를 클릭해 페이지로 끌어다 놓습니다. 
주소 입력 요소를 추가하는 스크린샷
  1. 주소 입력 요소에서 설정을 클릭합니다.
  2. 요소 상단에 표시될 입력란 제목을 입력합니다.  
  3. 방문자가 텍스트를 입력하기 전에 입력란에 표시되는 플레이스홀더 텍스트를 입력합니다.
    도움말: 플레이스홀더 텍스트를 원하지 않는다면, 기본 텍스트 아래에서 없음을 클릭합니다. 
  4. (선택사항) 읽기 전용 체크 상자를 클릭해 주소 입력이 컬렉션에 콘텐츠를 쓰지 못하도록 제한합니다. 이는 요소를 사용해 콘텐츠를 제출하는 대신 표시하는 경우에 유용합니다.
  5. 주소 자동 완성에서 옵션을 선택합니다.
    • 전체 국가: 방문자가 입력 시 자동 완성으로 전체 국가의 주소를 사용해 주소 입력을 완료합니다. 
    • 단일 국가: 방문자가 입력 시 자동 완성으로 한 국가만의 주소를 사용해 주소 입력을 완료합니다. 국가 선택 드롭다운을 클릭해 사용할 국가를 선택합니다. 
  6. 레이아웃 아이콘을 클릭해 텍스트 정렬, 플레이스홀더 여백, 드롭다운 목록 표시 등을 설정합니다. 
  7. 디자인 아이콘을 클릭해 프리셋 디자인을 선택합니다. 선택 후에는 디자인 사용자 지정을 클릭해 디자인을 추가로 조정합니다. 

2 단계 | CMS에 주소 입력 연결하기

주소 입력을 제출 양식이 저장될 컬렉션에 연결되는 데이터세트에 연결합니다. 기존 주소 입력란 유형에 연결하거나 컬렉션에 새 입력란을 생성할 수 있습니다. 
Wix 에디터
Studio 에디터
  1. 에디터에서 주소 입력 요소를 클릭합니다. 
  2. CMS에 연결 아이콘을 클릭합니다.
  3. 데이터세트 선택 드롭다운을 클릭해 컬렉션에 연결할 기존 데이터세트를 선택합니다. 또는, 데이터세트 추가를 선택한 후 연결할 컬렉션을 선택하고 데이터세트에 이름을 지정한 후 추가를 클릭 합니다.
  4. 값 연결 대상 드롭다운을 클릭해 입력이 제출되는 주소 입력란을 선택합니다.
    도움말: 입력란 추가를 클릭하고 새 컬렉션 입력란을 추가해 제출 양식을 저장하세요.
다음을 확인하세요.
  • 데이터세트 모드쓰기 또는 읽기 및 쓰기로 설정해 입력이 컬렉션에 제출될 수 있도록 합니다. 
  • 제출 버튼을 추가해 클릭 시 컬렉션에 입력이 제출될 수 있도록 합니다. 
주소 입력 요소를 주소 컬렉션 입력란에 연결하는 스크린샷
주소 입력 요소를 추가하는 스크린샷