Webflow의 비디오 기능을 사용하여 비디오를 동적으로 통합

비디오 필드는 디자인 및 템플릿 페이지에 비디오를 동적으로 삽입할 수 있는 컬렉션 필드입니다.

비디오 기능은 수집 제3자 플랫폼(예: YouTube 또는 Vimeo)에서 호스팅되는 비디오를 CMS에 포함할 수 있는 기능입니다. 컬렉션 목록과 컬렉션 페이지에서 이러한 비디오를 선보일 수 있습니다. 비디오 기능을 사용하여 컬렉션 목록을 구체화하거나 컬렉션 목록 및 페이지의 요소에 대한 조건부 표시 여부를 설정할 수도 있습니다.

비디오 기능의 몇 가지 일반적인 응용
  • 랜딩 페이지 홍보 동영상
  • 제품 개요 동영상
  • 리소스 페이지에 대한 안내 및 튜토리얼 비디오
프로세스 탐색
  1. 비디오 기능 시작
  2. 비디오 기능에 비디오 통합
  3. 비디오 기능을 비디오에 연결하기
  4. 비디오 기능을 통해 컬렉션 목록 필터링
  5. 비디오 기능으로 조건부 가시성 구성

비디오 기능 시작

새로운 컬렉션이나 기존 컬렉션에 비디오 기능을 도입할 수 있습니다. 컬렉션 설정 내에서 다음을 선택하세요. 새로운 기능 그런 다음 동영상 특징.

다른 기능과 마찬가지로 해당 기능이 필수인지 여부를 정의하는 옵션이 있습니다.

비디오 기능에 비디오 통합

비디오 기능은 Vimeo 및 YouTube와 같은 타사 비디오 플랫폼의 비디오 URL을 허용합니다.

 

비디오 기능은 모든 장치에서 사용하도록 최적화되어 귀하와 공동작업자의 모바일 반응성에 대한 우려를 없애줍니다.

귀하와 공동작업자는 서식 있는 텍스트 필드를 통해 컬렉션 페이지에 더 많은 비디오 콘텐츠를 포함할 수 있습니다.

비디오 기능을 비디오에 연결하기

  1. 컬렉션 목록 또는 컬렉션 페이지에 비디오 요소 포함
  2. 활성화 다음에서 비디오 가져오기 checkbox의 비디오 설정 메뉴
  3. 이를 관련 비디오 기능과 연결합니다. 기능 드롭다운
 

텍스트 요소를 선택하고 캔버스의 요소 레이블 옆에 있는 설정 아이콘을 클릭하거나 설정 패널(D)로 이동하여 비디오 설정에 액세스할 수 있습니다.

'를 선택 취소하여 연결을 끊을 수 있습니다.다음에서 비디오를 가져옵니다.” checkbox 아래 비디오 설정.

비디오 기능을 사용하여 라이트박스의 미디어 콘텐츠 검색

  1. 컬렉션 목록 또는 컬렉션 페이지에 라이트박스 추가
  2. 라이트박스 설정의 비디오 기능에서 미디어를 검색하세요.

비디오 기능을 통해 컬렉션 목록 필터링

특정 시나리오에서는 구성된 비디오 기능이 있는 컬렉션 항목만 표시하는 컬렉션 목록을 선택할 수 있습니다. 대표적인 예는 비디오 갤러리를 만들 때입니다. 이를 달성하려면:

  1. 필터링할 컬렉션 목록을 선택하세요.
  2. 다음으로 이동하세요. 설정 패널(D)
  3. 소개하다 필터 아래에 컬렉션 목록 설정
  4. 초기 드롭다운에서 관련 비디오 기능을 선택하세요.
  5. 선택하다 설정됨 두 번째 필드에서
  6. 딸깍 하는 소리 구하다

비디오 기능에 사용할 수 있는 필터 기준은 다음과 같습니다.

  • 설정됨 – 이 비디오 기능에 대해 구성된 비디오 URL로 컬렉션 항목을 식별합니다.
  • 설정되지 않음 – 이 링크 기능에 설정된 비디오 URL 없이 컬렉션 항목을 찾습니다.

컬렉션 목록 필터링에 대해 자세히 알아보기.

비디오 기능으로 조건부 가시성 구성

마찬가지로 컬렉션 목록이나 페이지의 비디오 요소에 대한 조건부 공개 규칙을 설정할 수 있습니다. 이렇게 하면 특정 컬렉션 항목에 대해 비디오 링크가 구성된 경우에만 비디오 요소가 표시됩니다.

  1. 동영상 기능에 연결된 동영상 요소를 선택하세요.
  2. 액세스 설정 패널(D)
  3. 소개하다 상태 (이 요소가 표시되도록) 아래 조건부 가시성
  4. 초기 드롭다운에서 비디오 기능을 선택하세요.
  5. 선택하다 설정됨 두 번째 드롭다운에서
  6. 딸깍 하는 소리 구하다

조건부 가시성에 대해 자세히 알아보세요.

이완 막
Ewan Mak의 최신 게시물 (모두 보기)