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

Wix 에디터: 버튼 정보

6 분
페이지 메뉴
  • 필요에 맞는 버튼 찾기
  • 원하는 위치에 버튼 연결하기
  • 사이트에 맞게 버튼 디자인하기
  • 고급 기능을 위 버튼 사용하기
버튼은 방문자가 사이트와 상호 작용하는 데 사용하는 요소입니다. 사이트 페이지, 외부 사이트 또는 문서와 같은 다양한 위치에 버튼을 연결할 수 있습니다. 선택한 버튼 유형에 따라 다양한 사용자 지정 옵션도 사용할 수 있습니다.
명확한 콜 투 액션(CTA)을 만들고 사이트 방문자가 브랜드에서 제공하는 것을 탐색할 수 있도록 버튼을 추가해 보세요.
흰색 배경의 라이브 사이트에 여러 디자인의 다양한 버튼이 있습니다.

필요에 맞는 버튼 찾기

에디터에는 모든 사이트 및 비즈니스 요구에 사용할 수 있는 다양한 버튼 유형이 있으므로 방문자를 위한 원활한 인터랙티브 환경을 조성할 수 있습니다.
버튼에는 디자인을 손상시키지 않으면서 기능적이고 정교한 사이트를 제작할 수 있도록 다양한 용도와 사용자 지정 옵션이 포함되어 있습니다. 
에디터에서 다음 버튼을 추가할 수 있습니다.

사이트 방문자가 해당 위치로 바로 이동할 수 있도록 버튼에 링크를 추가합니다. 버튼 유형과 사이트 요구 사항에 따라 다양한 위치와 옵션에 연결할 수 있습니다. 버튼에 추가할 수 있는 링크 유형은 다음과 같습니다.
  • 페이지: 방문자를 사이트의 다른 페이지로 안내합니다.
  • 웹주소: 방문자를 다른 사이트로 유도하기 위해 버튼을 외부 URL에 연결합니다.
  • 앵커: 버튼을 사이트의 앵커에 연결합니다. 방문자가 클릭하면 해당 페이지 및 앵커로 이동합니다.
  • 페이지 상단 및 하단: 방문자가 클릭하면 현재 보고 있는 페이지의 상단 또는 하단으로 이동합니다. 
  • 문서: 버튼을 사이트에 업로드한 파일에 연결합니다.
  • 이메일: 방문자가 브라우저나 기기에서 바로 연락할 수 있도록 버튼을 이메일 주소에 연결합니다.
  • 전화번호: 모바일 또는 태블릿 방문자가 즉시 전화를 걸 수 있도록 버튼을 전화번호에 연결합니다. 데스크톱 방문자는 FaceTime과 같은 통화 앱으로 연결됩니다.
  • 팝업: 사이트에서 선택한 팝업에 버튼을 링크합니다. 
참고:
버튼 유형에 따라 링크 추가 옵션이 표시되지 않을 수 있습니다. 예를 들어 문서 버튼은 사이트의 파일에만 연결할 수 있습니다.
Wix 패널에 연결하고자 하는 요소

사이트에 맞게 버튼 디자인하기

에디터에서 디자인 아이콘을 클릭해 버튼 모양을 변경하고 레이아웃 아이콘을 클릭해 정렬 및 구조를 변경해 버튼을 사용자 지정할 수 있습니다.
선택한 버튼 유형에 따라 버튼의 색상과 투명도를 변경하고 정렬 및 간격을 설정할 수 있습니다. 여러 부분을 원하는 대로 편집할 수 있으므로 브랜드와 테마에 맞게 버튼 디자인을 전체적으로 제어할 수 있습니다. 
Wix 에디터의 버튼 디자인 패널 옆 텍스트 및 아이콘 버튼 스크린샷
방문자가 독특하고 유동적인 상호 작용을 할 수 있도록 애니메이션 효과를 추가해 버튼을 더욱 개성있게 만들 수 있습니다.
참고:
디자인 및 레이아웃 패널은 에디터의 특정 버튼에서만 사용할 수 있습니다.

고급 기능을 위 버튼 사용하기

Velo 개발자 모드 및 CMS와 같은 기능을 통해 사이트 전체에서 고급 기능을 위해 버튼을 사용하고 방문자에게 업그레이드된 맞춤형 경험을 선사할 수 있습니다.
CMS에서 버튼을 컬렉션에 연결하면, 방문자가 버튼 클릭 시 발생하는 작업을 정의할 수 있습니다. 파일 또는 텍스트 입력과 같이 방문자로부터 입력 및 정보를 수집하는 버튼을 설정하는 데 많이 사용됩니다. 
제출 양식 데이터세트에 연결된 에디터의 버튼입니다.
사이트에서 Velo 개발자 모드를 활성화하면 코드로 버튼의 동작을 결정할 수 있습니다. 예를 들어 방문자가 사이트에서 다른 작업을 완료할 때까지 페이지에서 버튼을 숨기거나 사용자 지정 이벤트를 설정할 수 있습니다. 이벤트 및 속성 작업에 대한 자세한 도움말을 확인하세요.
버튼 요소에 대한 개발자 모드의 속성 및 이벤트 버튼입니다.

Helpmate

안녕하세요 님,

추가 도움이 필요하신가요?
도움말 요약
Related articles
Wix 에디터: 버튼에 링크 추가하기

Wix 에디터: 버튼 디자인 사용자 지정하기

Wix 에디터: 버튼 문제해결사
Unlock personalized helpLog in to get the most out of Helpmate.