EN
수색...

동영상 섹션

페이지에 동영상 추가 섹션을 추가하여 YouTube/Vimeo 동영상을 간편하게 재생하세요. 웹사이트 방문자의 관심을 유지하는 데 매우 효과적인 방법입니다.

Pixpa는 YouTube 또는 Vimeo의 비디오 삽입을 지원합니다. 웹사이트에 동영상을 직접 업로드할 수는 없습니다. 이 섹션 외에도 비디오를 추가할 수도 있습니다. 갤러리 (Gallery) 또는 기치.

Pixpa를 사용하면 다음에서 YouTube 또는 Vimeo 프로필을 공유할 수 있습니다. 소셜 링크. 음악 섹션에서 Soundcloud에 호스팅된 음악 파일을 추가할 수도 있습니다.

주의할 점:

  • 비디오가 지원되는 모든 곳에서 .gif 파일을 업로드할 수 있습니다.
  • 추가한 동영상이 많이 로드되는 경우 재생 버튼을 클릭하고 몇 분 동안 일시 중지하세요. 그런 다음 비디오를 다시 시작하십시오. 이렇게 하면 버퍼링이 줄어들면서 더 잘 로드됩니다.

이 기사는 다음 주제들로 구성되어 있습니다 :

  1. 동영상 섹션이란 무엇인가요?
  2. 동영상 섹션 추가
  3. 목록 항목 추가 및 편집
  4. 시퀀싱 목록 항목
  5. 목록 항목 삭제
  6. 요소 관리
  7. 섹션 레이아웃 변경
  8. 스타일 옵션
  9. 전체 카드 및 텍스트 카드

동영상 섹션

동영상 목록은 동영상에 대한 설명을 추가하고 동영상 목록을 웹사이트의 다른 페이지나 다른 링크와 연결하는 링크나 버튼을 추가할 수 있는 동영상 모음입니다.

동영상 추가 섹션

  • 페이지에 섹션을 추가할 수 있습니다. 이미 존재하는 페이지에 섹션을 추가하거나 새 페이지 만들기 귀하의 웹사이트 내에서.
  • 귀하의 페이지에서은 클릭 파란색 + 아이콘 추가 새 섹션 귀하의 페이지에.

  • 이제 섹션 카테고리 왼쪽에
  • 온 클릭 내용 (1) 옵션 및 Video (2) 탭.
  • 이제, 당신은 볼 것입니다 다른 레이아웃 의 동영상 섹션 (3).

  • 섹션 레이아웃을 선택하고 클릭하여 페이지에 추가하십시오.

목록 항목 추가 및 편집

비디오 목록 항목 추가

섹션을 추가한 후

  • 온 클릭 콘텐츠 편집 (1) 버튼을 눌러 목록 항목 패널을 엽니다.

  • 클릭 아이템 추가 (2) 버튼을 눌러 새 목록 항목을 추가합니다.
  • 다음 옵션을 사용할 수 있습니다. 복제 및 삭제 (3) 목록 항목.

비디오 목록 항목 편집

편집할 목록 항목을 클릭합니다. 특정 목록 항목 편집 옵션이 열립니다.

  • 추가 YouTube/Vimeo 동영상 링크(1).

주의 사항

Pixpa 웹사이트에 동영상을 추가하려면 YouTube 또는 Vimeo에 동영상을 업로드하고 여기에 URL을 입력해야 합니다.

  • 동영상을 재생하도록 설정 라이트박스 또는 페이지에서만 (2).

  • 업로드 또는 삭제 (3) 목록 항목의 썸네일 이미지입니다.

  • 추가 할 Title (4), 자막 (5), 및 설명 (6) 목록 항목. 선택한 레이아웃에 따라 특정 목록 항목에서 자막 및 설명 옵션을 찾지 못할 수 있습니다.

7. 클릭 시 액션

개별 항목의 클릭 동작을 사용자 정의할 수 있습니다. 동영상 목록 섹션. 사용 가능한 옵션은 다음과 같습니다.

  • 링크로 이동
    이 옵션을 선택하면 다음이 열립니다. 링크 빌더, 이 항목에 하이퍼링크를 추가할 수 있습니다. 이 링크는 사용자를 웹사이트 내의 다른 페이지나 외부 URL로 안내할 수 있습니다. 더 많이 알아라. about 링크 빌더.
  • 조치 없음
    이 옵션을 선택하면 항목을 클릭할 수 없게 됩니다. 선택하면 항목을 클릭해도 아무런 동작이 트리거되지 않습니다.

8. 새 창에서 링크 열기: 다음에서 열리도록 링크 설정 새 탭이나 같은 탭에서. 이것은 다음과 같은 경우에만 표시됩니다. 링크로 이동 옵션이 선택되었습니다 클릭 시 동작 메뉴를 선택합니다.

9. 버튼 및 링크: 모든 유형 추가 (링크) 목록 항목에. 버튼/이미지 링크/소셜 아이콘/텍스트 링크를 추가할 수 있습니다. 상세보기.

10. 카드 스타일 오버라이드

섹션에서 글로벌 카드 스타일 설정을 재정의할 수 있습니다. 스타일 설정 비디오 목록 섹션에서 각 항목의 카드를 개별적으로 맞춤 설정할 수 있습니다. 이렇게 하면 목록 항목마다 고유한 스타일을 적용하여 더욱 효과적으로 맞춤 설정할 수 있습니다.

상세보기 동적 섹션의 카드 옵션에 대한 정보입니다.

11. 모양 스타일 재정의

비디오 목록 섹션 내에서 각 썸네일에 개별적으로 다른 모양을 지정하려면 재정의 옵션을 사용하면 모든 항목의 시각적 스타일을 더 효과적으로 제어할 수 있습니다. 상세보기 셰이프 마스크에 대하여.

12. 저장: 사용자 지정을 한 후 변경 사항을 저장합니다.

비디오 목록 항목 편집 작업을 참조하십시오.

시퀀스 목록 항목

  • 목록 항목을 쉽게 드래그 앤 드롭하여 순서를 변경할 수 있습니다.

목록 항목 삭제

목록 항목을 추가한 후에는 동일한 항목을 편집하고 삭제할 수 있습니다.

  • 온 클릭 . 비디오 목록 항목 옆에 있는 아이콘.
  • 온 클릭 . 확인 팝업의 버튼.
  • 찜하기 당신의 변경.

주의 사항

한 번 삭제된 목록 항목은 복구할 수 없습니다.

비디오 목록의 요소 관리

비디오 목록 섹션에는 다음이 포함됩니다. 요소 탭 섹션 내의 다양한 요소의 가시성을 쉽게 관리할 수 있게 해줍니다. 간단한 토글 스위치를 사용하면 요소 자체를 삭제하거나 수정하지 않고도 특정 요소를 활성화하거나 비활성화할 수 있습니다.

  • 온 클릭 콘텐츠 편집 (1) 버튼.

  • 선택 요소 (2) 탭.
  • 변경 사항을 적용한 후에는 찜하기 (3) 버튼.

섹션 옵션

  1. 헤드라인 표시: 비디오 목록 섹션의 헤드라인 표시 여부를 설정합니다.
  2. 단추 표시: 버튼이 섹션 수준에 표시되는지 여부를 제어합니다.

아이템 옵션

  1. 비디오보기: 비디오의 표시 여부를 전환합니다.
  2. 제목 표시: 제목 표시 여부를 제어합니다.
  3. 자막 표시: 자막을 활성화하거나 비활성화합니다.
  4. 설명 표시: 항목 설명의 가시성을 관리합니다.
  5. 단추 표시: 개별 항목에 대한 버튼을 표시할지 여부를 결정합니다.

섹션 레이아웃

  • 온 클릭 콘텐츠 편집 (1) 버튼을 눌러 동영상 목록 편집 패널을 엽니다.

  • 선택 레이아웃 (2) 탭.
  • 섹션의 레이아웃을 선택하고 찜하기 (3) 귀하의 변경 사항.

섹션 스타일 지정

  • 온 클릭 콘텐츠 편집 (1) 버튼을 눌러 동영상 목록 편집 패널을 엽니다.

  • 선택 스타일 (2) 옵션.
  • 섹션 요소의 스타일을 변경하고 찜하기 (3) 귀하의 변경 사항.

섹션에 대한 여러 스타일 옵션이 있습니다.

    1. 디스플레이 옵션 
    2. 모바일 디스플레이
    3. 조정
    4. 텍스트 크기
    5. 간격
    6. 섹션 제목
    7. 이미지 옵션
    8. 셰이프 마스크
    9. 이미지 호버 옵션
    10. 테두리 옵션
    11. 카드 옵션
    12. 그림자 옵션
    13. 버튼 및 링크

 

디스플레이

  1. 로 선택 항목 표시 in 행과 열 or 회전 목마 
    • 당신이 선택한 경우 행과 열 옵션을 선택하면 목록 항목이 행과 열로 정렬됩니다. 이 경우 행과 열의 수를 지정해야 합니다.
    • 당신이 선택한 경우 회전 목마 옵션을 선택하면 목록 항목이 슬라이드쇼로 표시됩니다. 더 많이 알아라..
  2. 설정 열 수 동영상 목록의 경우 1~10열 중에서 선택할 수 있습니다.
  3. 지정 열 사이의 공간 목록 항목 중.
  4. 지정 행 사이의 공백 목록 항목 중.

1단계에서 회전판 옵션을 선택한 경우 다음과 같은 추가 옵션이 표시됩니다.

  1. 부드러운 스크롤 활성화: 회전형 리스트 내에서 항목을 지속적으로 스크롤하여 원활하고 시각적으로 매력적인 경험을 제공합니다.
  2. 자동 슬라이드: 사용자 상호 작용 없이 슬라이드를 자동으로 회전합니다.
  3. 자동 재생 진행률 표시: 자동재생이 활성화되어 있는 동안 진행률 표시기를 표시하여 가시성을 높입니다.
  4. 자동 재생 지연: 자동 재생이 활성화되어 있을 때 각 슬라이드 전환 사이의 시간 간격을 설정합니다.
  5. 캐러셀 루프: 슬라이드를 연속적으로 반복할 수 있으므로 마지막 슬라이드 이후에 회전형 슬라이드가 원활하게 다시 시작됩니다.
  6. 캐러셀 컨트롤: 선택 탐색 컨트롤. 컨트롤 없음, 화살표 - 하단 중앙/오른쪽 상단/오른쪽 하단, 셰브론, 점 및 수평 스크롤 중에서 선택할 수 있습니다.

모바일 디스플레이

  1. 수를 설정 그리드 기둥 모바일 장치용. 최대 3개 열까지 설정할 수 있습니다.
  2. 정의 간격 그리드 사이(픽셀 단위).

Studio 설정에 따른 장치별 열 레이아웃:

조정

  1. 정렬 콘텐츠를 가로로 비디오 목록에서. 왼쪽, 오른쪽 또는 가운데 정렬로 설정할 수 있습니다.
  2. 정렬 콘텐츠를 세로로 비디오 목록에서. 위, 가운데, 아래 정렬로 설정할 수 있습니다.
  3. 선택 콘텐츠 순서 즉, 먼저 표시될 목록 항목의 이미지 또는 관련 텍스트입니다.

텍스트 크기

  1. 온 클릭 텍스트 스타일 변경 방문하기 버튼 디자인 섹션 글꼴 크기와 스타일을 관리하세요. 
  2. 설정 Title 섹션의 목록 항목에 대한 글꼴 스타일.
  3. 설정 부제 섹션의 목록 항목에 대한 글꼴 스타일.
  4. 기본값 설정  기술설명 섹션의 목록 항목에 대한 글꼴 스타일.
  5. 이 옵션을 활성화하려면 어떤 숫자든 애니메이션 효과 적용 현재의 Title 부제 입력 필드입니다. 이 기능을 켜면 숫자 값이 동적인 카운팅 애니메이션과 함께 표시되어 시각적으로 더욱 매력적입니다.

간격

  1. 지정 이미지 폭 목록 항목의 경우.
  2. 지정 콘텐츠 너비 목록 항목에 대해.
  3. 지정 섹션 제목 아래 공간 px에서.
  4. 지정 이미지 아래 공간 목록 항목의 (%).
  5. 지정 제목 아래 공간 목록 항목의 (%).
  6. 지정 자막 아래 공간 목록 항목의 (%).

섹션 제목

  1. 수평 정렬 섹션 헤드라인 텍스트입니다. 왼쪽, 가운데, 오른쪽으로 설정할 수 있습니다.
  2. 활성화/비활성화 분할기 섹션 제목과 섹션 내용 사이.
  3. 설정 디바이더의 두께 (픽셀 단위).
  4. 지정 구분선 색상 색상 선택기에서.
  5. 선택 구분선 스타일 드롭 다운에서
  6. 설정 헤드라인 너비 섹션 제목이 표시되는 너비를 정의합니다. 최소 50%부터 시작합니다.

이미지 옵션

  1. 선택 이미지 자르기 목록 항목의 경우. 이미지를 Square, Circle, Landscape, Portrait 및 Dynamic으로 설정할 수 있습니다.
  2. 목록 항목의 각 측면에 대해 공통 모서리 반경 또는 다른 모서리 반경을 갖도록 선택하고 모서리 반경 목록 항목 이미지 중. 더 많이 알아라..

팁

사용법 -  모서리 반경 필드에서 다양한 모양의 목록 항목 이미지를 만들 수 있습니다. 여기서 500px를 지정하면 이미지가 원 모양으로 표시됩니다.

  • 분할 모서리를 선택한 경우 각 모서리에 대해 서로 다른 모서리 반경을 설정할 수 있습니다.

셰이프 마스크

  1. 모양 마스크: 이 토글을 활성화하면 비디오 목록 섹션의 비디오 썸네일에 모양 마스크를 적용할 수 있습니다. 활성화하면 선택한 모양이 썸네일을 해당 모양에 시각적으로 잘립니다.
  2. 모양 선택: 미리 정의된 다양한 모양 중에서 선택하여 썸네일에 적용할 수 있습니다. 둥근 모양, 마름모 모양, 물방울 모양 등 고유한 모양으로 이미지를 표시하여 콘텐츠에 창의적인 스타일을 더할 수 있습니다.

노트

  • 모양 마스크 옵션은 레이아웃에 따라 달라집니다. – 제목이나 부제 등의 텍스트가 이미지 위에 표시되는 레이아웃에서는 나타나지 않을 수 있습니다.
  • Stretch 설정은 여러 요인에 따라 달라집니다. - 포함 이미지 크기, 조정글렌데일 자르기 설정 스타일 탭에서 정의됩니다.
  • 이미지 자르기가 원본으로 설정된 경우, 이미지의 실제 크기에 따라 수직이나 수평으로 늘어날지 여부가 결정됩니다.

이미지 호버 옵션

  1. 선택 이미지 호버 색상 너는 악센트 색상 또는 될 지정. 선택했다면 악센트 색상을 지정한 다음 불투명각 항목의 악센트 색상을 지정할 수 있습니다. 항목 편집 패널.
  2. 당신이 선택한 경우 색상 지정 옵션을 설정한 다음 오버레이 색상 및 불투명도.
  3. 설정 오버레이 텍스트 색상 호버하면 표시됩니다.
  4. 로 선택 목록 항목 이미지에 애니메이션 적용 마우스를 올리면 예를 클릭합니다. 라이브 페이지에서 이 기능을 확인하십시오..
  5. 선택 애니메이션 스타일 커서를 이미지 위로 가져가면 이미지가 표시됩니다.

이미지 테두리

  1. 테두리 활성화 / 비활성화 토글을 전환하여 이미지 주변을 둘러보세요.
  2. 다음을 선택하세요. 공통 국경 이미지의 모든 면에 표시하거나 테두리를 별도로 각 측면에 대해.
  3. 지정 폭 국경의. 0으로 설정하면 테두리가 나타나지 않습니다. 이미지의 각 측면에 대해 개별적으로 테두리 너비를 설정할 수도 있습니다.
  4. 선택 테두리 색 색상 선택기에서.
  5. 선호하는 것을 선택하십시오 테두리 스타일 드롭 다운에서
  6. 결정 모바일의 테두리 너비 데스크탑용으로 선택한 너비에 맞춰 정렬합니다.

카드 옵션

그림자 옵션

  1. 디스플레이 – 항상 목록 항목 뒤에 그림자를 표시하거나 가리키기만 하면 표시되도록 선택합니다.
  2. 스타일 – 기존 사전 설정에서 선택하거나 사용자 지정 그림자를 만듭니다.
    사용자 정의 옵션을 선택한 경우 다음을 방문하십시오. 상자 그림자 생성기 사용자 지정 그림자를 만듭니다. 마지막으로 복사 붙여넣기 상자 그림자 CSS.
  3. 사전 설정 옵션을 선택한 경우 그림자 스타일 선택 드롭 다운에서

버튼 및 링크

  1. 방법을 참조하십시오 스타일링을 관리하기 위해 버튼 및 링크.
  2. 찜하기 모든 스타일이 변경됩니다.

전체 카드와 텍스트 카드

당신이 켤 때 전체/텍스트 카드 비디오 목록 위에 있는 목록 항목에는 선택한 카드 색상의 윤곽선과 배경이 있습니다. 디자인 안내
참조 : 웹사이트 색상 및 간격.

전체 카드

전체 카드 옵션을 선택하면 카드 색상이 전체 카드, 즉 비디오 썸네일과 함께 있는 텍스트에 적용됩니다.

보세요 : 

텍스트 카드

텍스트 카드 옵션을 선택하면 비디오 썸네일에 있는 텍스트에만 카드 색상이 적용됩니다.

보세요 : 

태그가 :

원하는 것을 찾을 수 없습니까?

Pixpa 전문가에게 문의하세요.

문의하기