Wix 에디터: 라이트박스 추가 및 설정하기

4 분 분량
팝업 라이트박스를 추가해 방문자의 관심을 끌고 중요한 공지사항 및 정보를 표시하세요. 팝업 메시지에 요소를 추가하고, 언제 트리거되는지 결정하고, 방문자가 팝업 메시지를 닫는 방식도 선택할 수 있습니다.
Wix 라이브 사이트에 팝업으로 표시되는 라이트박스를 보여주는 GIF

1단계 | 라이트박스 추가하기

라이트박스를 추가해 사이트 방문자와 상호 작용하며 정보를 제공해 보세요. "환영 메시지" 및 "문의 양식"과 같이 선택할 수 있는 다양한 템플릿 및 유형이 있습니다.

라이트박스를 추가하려면:

  1. 에디터 왼쪽에서 요소 추가를 클릭합니다.
  2. 인터랙티브를 클릭합니다.
  3. 라이트박스에서 카테고리를 선택합니다.
  4. 원하는 라이트박스를 클릭하거나 드래그해 페이지에 추가합니다.
에디터의 '요소 추가' 패널입니다. 라이트박스 탭이 열려 있습니다.

2단계 | 라이트박스에 요소 추가하기

라이트박스에 요소를 추가해 콘텐츠를 제작하고 디자인해 보세요. 요소는 라이트박스 내부에 맞도록 라이트박스보다 작아야 합니다. 라이트박스에 필요한 모든 것이 포함되도록 텍스트, 버튼 등을 추가할 수 있습니다.

라이트박스에 요소를 추가하려면:

  1. 메뉴 및 페이지 패널에서 해당 라이트박스를 엽니다.
  2. 에디터 왼쪽에서 요소 추가를 클릭합니다.
  3. 옵션에서 요소 유형을 선택합니다.
  4. 요소를 클릭하고 라이트박스의 원하는 위치로 끌어다 "라이트박스에 추가하기" 메시지가 표시되면 놓습니다.
참고:
라이트박스를 추가하면 라이트박스 모드로 이동합니다. 해당 모드에서 라이트박스를 설정하고 편집할 수 있습니다. 기본 에디터로 돌아가려면 상단바에서 모드 종료를 클릭합니다.
에디터의 요소 추가 패널입니다. 에디터는 라이트박스 모드이며, 커서를 텍스트 요소에 마우스오버하고 있습니다.

3단계 | 라이트박스 트리거 설정하기

팝업 메시지를 디자인한 후 라이트박스를 여는 방식을 결정합니다. 페이지를 불러올 때 자동으로 표시되도록 설정하거나 방문자가 클릭해야 하는 요소에 연결할 수 있습니다. 

라이트박스 트리거를 설정하려면:

  1. 메뉴 및 페이지 패널에서 해당 라이트박스를 엽니다.
  2. 라이트박스를 클릭합니다.
  3. 라이트박스 설정을 클릭합니다.
  4. 라이트박스 자동 표시 아래의 옵션을 클릭합니다.
    • ON: 페이지를 불러올 때 라이트박스가 표시됩니다. 
      • 표시 페이지 입력란을 클릭하고 라이트박스를 표시할 페이지를 선택하거나 방문자의 첫 접속 페이지 체크상자를 선택합니다.
      • 지연시간 슬라이더를 끌어 페이지를 불러오는 시점과 라이트박스가 표시되는 시점 간의 속도를 조정합니다.
        참고: 이 슬라이더는 모든 라이트박스에 표시되지 않습니다.
    • OFF: 사이트 방문자가 페이지에 접속했을 때 라이트박스가 표시되지 않습니다. 대신 사이트의 요소에 연결할 수 있습니다.
  5. (선택사항) 라이트박스의 일정을 설정합니다. 이는 제한된 기간 동안 사용할 수 있는 프로모션 또는 서비스를 표시하는 데 유용합니다.
    • 날짜: 옵션을 사용해 라이트박스의 시작일과 종료일을 선택합니다.
    • 시간: 라이트박스 일정의 시작 및 종료 시간을 선택합니다.
    • 시간대: 드롭다운 옵션에서 시간대를 선택합니다.
    • 예약 초기화: 이전에 라이트박스에 추가한 예약을 제거합니다.
라이트박스의 설정 패널입니다. 커서를 지연 시간 입력란에 마우스오버하고 있습니다.

4단계 | 라이트박스 닫기 방식 선택하기

방문자가 메시지를 읽은 후 라이트박스를 닫는 방식을 선택합니다. 라이트박스 닫기 방식을 여러 개 선택하거나 하나만 선택할 수 있습니다. 예를 들어 방문자가 라이트박스 뒤에 있는 오버레이를 클릭해 라이트박스를 닫거나, 보다 확실한 '닫기' 버튼을 추가할 수도 있습니다.

라이트박스에 '닫기' 버튼 또는 'X' 아이콘을 추가하려면:

  1. 메뉴 및 페이지 패널에서 해당 라이트박스를 엽니다.
  2. 라이트박스를 클릭합니다.
  3. 설정 아이콘을 클릭합니다.
  4. 라이트박스 닫기 방식에서 옵션을 선택합니다.
    • 'X' 아이콘: 방문자는 X 아이콘을 클릭해 라이트박스를 닫을 수 있습니다.
    • '닫기' 버튼: 방문자는 닫기 버튼을 클릭해 라이트박스를 닫을 수 있습니다.
라이트박스 설정 패널입니다. 라이트박스 닫기 옵션이 강조 표시되어 있습니다.

오버레이에서 라이트박스를 닫을 수 있도록 하려면:

  1. 메뉴 및 페이지 패널에서 해당 라이트박스를 엽니다.
  2. 에디터에서 오버레이(라이트박스 주변의 공간)를 클릭합니다.
  3. 오버레이 설정을 클릭합니다.
  4. 클릭시 라이트박스 닫기 버튼을 클릭합니다. 
    • 활성: 사이트 방문자가 오버레이를 클릭해 라이트박스를 닫을 수 있습니다.
    • 비활성: 사이트 방문자가 오버레이를 클릭해 라이트박스를 닫을 수 없습니다. 
오버레이 설정 패널입니다. 커서를 '클릭시 라이트박스 닫기' 버튼에 마우스오버하고 있습니다.
다음 단계:
라이트박스의 디자인과 위치를 사용자 지정해 사이트 공지사항을 더욱 개성 있게 꾸며 보세요. 라이트박스 사용자 지정에 대한 자세한 도움말을 확인하세요.

자주 묻는 질문

아래를 클릭해 라이트박스에 대해 가장 자주 묻는 질문과 답변을 확인해 보세요.

도움이 되었나요?

|