반응형
윅스 (Wix) 코딩 - 속성 패널 (Wix Code: Working with the Properties Panel)
설명)
속성 패널을 사용하면 페이지 자체, 머리글(header)와 바닥글(Footer) 및 데이터세트를 포함하여 사이트의 모든 요소에 윅스 코드 (Wix Code) 코딩 작업할 수 있으며, 이벤트 추가와 같은 디테일한 정보도 추가할 수 있습니다.
노트 :
아래 속성들은 모든 요소에 적용되는 것은 아닙니다.
| 속성(Property) | 설명(Description) |
| 아이디(ID) | 선택된 페이지의 요소 이름으로, 요소의 속성 패널을 열면 요소에 지정된 기본 이름을 확인할 수 있습니다. 또한 식별 가능한 이름으로 변경 가능하며 이를 이용해 코드를 작성할 수 있습니다. 요소 ID는 코드에서 요소를 식별하여 선택할 수 있도록 사용되며, 예를 들어 myButton이라는 요소로 작업하려면 코드에 $w("#myButton")을 작성합니다. 요소 위에 마우스를 올려 놓거나 에디터에서 요소 ID를 선택하여 요소의 ID를 확인할 수 있습니다. |
| 로딩시 숨김(Hidden on load) | 사이트 방문자가 어떤 행동을 완료할 때까지 방문자에게 보이지 않고 싶은 요소가 사이트에 있을 때, 이 확인란을 선택하면 페이지가 로딩된 후에도 요소는 표시되지 않습니다. 후에 코드를 사용하여 표시할 수 있으며, 숨겨진 요소는 사이트 방문자에게 표시되지 않지만 페이지에는 존재합니다. 로딩시 숨김으로 표시된 요소는 선택될 때까지 에디터에서 사라져 있습니다. 에디터에서 요소들을 숨기려면 도구 메뉴의 숨겨진 요소 확인란의 선택을 취소해야 합니다. |
| 로딩시 축소(Collapsed on load) | 축소된 요소는 페이지에 표시되지 않으며 페이지의 공간을 차지하지 않습니다. 이 확인란을 선택하면 코드를 사용하여 선택시 요소를 확장시킬 수 있습니다. 페이지의 레이아웃에 따라 요소를 확장하거나 축소하여 다른 요소가 페이지 위 또는 아래로 이동할 수 있습니다. 로딩시 접힌 것으로 표시된 요소는 선택될 때까지 에디터에서 대각선 해칭선으로 표시됩니다. |
| 기본으로 사용(Enabled by default) | 버튼과 같은 일부 요소들은 활성화 또는 비활성화 할 수 있습니다. 사이트 방문자가 방문 즉시 상호 작용할 수 없도록 하고 싶은 요소가 사이트에 있을 수 있습니다. 이 확인란의 선택을 취소하면 페이지가 로딩될 때 요소가 비활성화됩니다. 그런 다음 준비가 되었을 때 코드를 사용하여 활성화시킬 수 있습니다. [기본으로 사용] 확인란 선택이 되어 있지 않은 요소들은 에디터에서 사용할 수 없음으로 표시됩니다. |
| 이벤트 (Events) | 이벤트의 더하기 이이콘을 클릭하여 해당 이벤트 핸들러를 요소에 추가합니다. 코드 패널이 자동으로 열리고 이벤트 핸들러의 기능이 페이지에 추가됩니다. 이것은 요소에 이벤트가 발생할 때 실행되는 함수입니다. 이벤트가 발생할 때 일어날 일을 사이트에 알리기 위해 함수에 코드를 추가해야합니다. 요소에 이미 추가한 이벤트 핸들러가 여기에 표시됩니다. 기존 이벤트를 선택하면 마우스 커서는 코드 패널의 이벤트 핸들러 코드에 배치됩니다. 이벤트 핸들러 옆에 있는 휴지통 아이콘을 클릭하면 요소와 이벤트 핸들러 함수 사이의 연결이 끊어집니다. 함수와 코드는 필요할 경우를 대비하여 사이트에 남아 있습니다. |
팁 : [속성 패널]로 작업하는 방법 확인하기
연관된 토픽)
윅스 (Wix) 코딩 - 코드 패널 (Wix Code: Working in the Code Panel)
윅스 (Wix) 코딩 - 이벤트를 이용하여 사이트 사용자에 반응하기 (Wix Code: Reacting to User Actions Using Events)
윅스 홈페이지 만들기 101
윅스 (Wix) 홈페이지 만들기 101 - E-Book - Index
윅스 (Wix) 홈페이지 만들기 101 - E-Book - Index
윅스 (Wix) 홈페이지 만들기 101 - E-Book - Index 윅스 (Wix.com) 윅스 ADI & 템플릿 (Wix ADI & 템플릿) 윅스 웹에디터 (Wix Editor) 윅스 코딩 (Wix Code - Corvid) 윅스 해커톤 (Wix Hackathon)
limejuicer.tistory.com
출처 :
https://support.wix.com/en/article/wix-code-working-with-the-properties-panel
반응형
'윅스 (Wix) 홈페이지 만들기 > 윅스 코딩 (Wix Code - Corvid)' 카테고리의 다른 글
| 윅스 (Wix) 코딩 - API 개요 (Wix Code: API Overview) (0) | 2020.04.30 |
|---|---|
| 윅스 (Wix) 코딩 - 코드 패널 (Wix Code: Working in the Code Panel) (0) | 2020.04.30 |
| 윅스 (Wix) 코딩 - 사이트 구조 사이드 바 (Wix Code: Working with the Site Structure Sidebar) (0) | 2020.04.30 |
| 윅스 (Wix) 코딩 용어집 - 콜비드 (Wix Coding - Corvid : Glossary) (0) | 2020.04.30 |
| 윅스 (Wix) 코딩 용어 - Wix 데이터베이스 앱 (Wix Database app) (0) | 2020.04.30 |
댓글