팀 캐러셀 슬라이더

ElementsKit을 사용하면 세련된 슬라이딩 캐러셀을 통해 팀 구성원에게 웹사이트를 소개할 수 있습니다. Elementor Team Carousel Slider 위젯을 사용하면 사진, 이름, 명칭, 설명, 링크 소셜 프로필 등이 포함된 팀원 카드를 표시할 수 있습니다.

ElementsKit의 Elementor Team Carousel Slider 위젯을 사용하는 방법을 알아보려면 이 문서를 읽어보세요.

필요한 플러그인: #

1단계: 팀 캐러셀 슬라이더 위젯 활성화 #

먼저 WordPress 대시보드에서 위젯을 활성화해야 합니다. 팀 캐러셀 슬라이더 위젯을 활성화하려면:

  1. 로 이동 ElementsKit > 위젯.
  2. 찾기 팀 슬라이더 목록에서 ~할 수 있게 하다 위젯.
  3. 다음을 클릭하세요. 변경 사항을 저장하다.
팀 캐러셀 슬라이더 위젯 활성화

2단계: 위젯 드래그 앤 드롭 #

그런 다음 ElementsKit Team Carousel Slider 위젯을 Elementor 편집기로 끌어다 놓습니다.

3단계: Elementor Team Carousel 위젯 구성 #

콘텐츠 탭에서는 팀 구성원 콘텐츠와 팀 캐러셀 슬라이더의 슬라이더 설정을 구성할 수 있습니다.

3.1 팀 콘텐츠 #

팀 슬라이더 위젯에는 다음과 같은 기능이 있습니다.

  1. 스타일: 위젯에는 기본, 오버레이, 소셜에 올리기, 세부 정보가 포함된 오버레이 등을 포함한 12가지 스타일이 제공됩니다. 

메모: 다양한 스타일에는 개별 옵션과 설정이 제공됩니다. 이 문서의 뒷부분에서 설명하는 옵션입니다.

  1. 팝업 활성화: 해당 팀원의 이름을 클릭하면 해당 팀원의 세부정보가 팝업으로 나타납니다.
  2. 소셜 프로필 표시: 팀 구성원 세부 정보에 소셜 미디어 프로필을 연결합니다.
  3. 디스플레이 설명: 팀원에 대한 간단한 설명을 표시합니다.
  4. 디스플레이 버튼: 회원의 프로필이나 포트폴리오에 연결할 수 있는 버튼을 추가합니다.

팀원 세부정보 #

다음을 클릭하여 슬라이더에 팀 구성원을 추가할 수 있습니다. 아이템 추가 버튼을 누르고 기존 구성원을 삭제합니다. 단추. 또한, 팀원의 세부정보를 복사할 수 있습니다.

회원 콘텐츠 아래:

  1. 회원 이미지 선택: 팀원의 사진을 추가하세요.
  2. 회원 이름: 팀원의 이름을 입력하세요.
  3. 회원 직위: 팀원의 명칭을 언급하세요.
  4. 회원 소개: 팀원에 대한 간단한 설명을 추가합니다.

버튼 내용:

  1. 상: 버튼 아이콘 표시 여부를 결정하고 아이콘을 선택합니다.
  2. 아이콘 위치: 아이콘 위치를 텍스트 앞이나 뒤로 설정하세요.
  3. 텍스트: 버튼 텍스트를 입력하세요.
  4. 링크 URL: 버튼을 페이지와 연결하려면 URL을 추가하세요.

팝업 내용:

팝업 콘텐츠에 다음을 추가할 수 있습니다. 전화 번호 그리고 이메일 팀원의.

소셜 콘텐츠 아래:

최대 5개의 소셜 미디어 계정을 연결할 수 있습니다. 각 소셜 프로필에 대해 프로필 URL, 개별 사용 아이콘 각 소셜 미디어마다.

3.2 슬라이더 설정 #

Elementor Team Carousel 위젯의 슬라이더 설정에서 다음 옵션을 사용할 수 있습니다.

  1. 간격: 각 슬라이드 사이의 간격을 조정합니다.
  2. 표시할 슬라이드: 단일 뷰포트에 표시할 슬라이드 수를 설정합니다.
  3. 스크롤할 슬라이드: 한 번에 스크롤할 슬라이드 수를 결정합니다.
  4. 자동 재생: 슬라이드를 자동으로 스크롤하려면 자동 재생을 활성화하세요.
  5. 속도: 자동 재생이 활성화되면 스크롤 속도를 밀리초(ms) 단위로 설정합니다.
  6. 마우스 오버 시 일시 중지: 사용자가 슬라이더 위에 마우스를 올리면 자동재생이 일시중지됩니다.
  1. 화살표 표시: 슬라이더에 대한 화살표 탐색을 활성화합니다.
  2. 마우스를 올리면 화살표 표시: 화살표는 마우스를 가져갈 때만 표시됩니다.
  3. 화살표 유형: 화살표, 텍스트, 화살표가 있는 텍스트 등 지정된 옵션에서 화살표 유형을 선택합니다.
  4. 왼쪽 화살표 아이콘: 아이콘 라이브러리에서 왼쪽 화살표 아이콘을 선택할 수 있습니다.
  5. 오른쪽 화살표 아이콘: 아이콘 라이브러리에서 왼쪽 화살표 아이콘을 선택할 수 있습니다.
  6. 점 표시: 슬라이더에 대한 점 탐색을 활성화합니다.
  • 속도 그리고 마우스오버 일시중지 옵션은 자동 재생이 활성화된 경우에만 나타납니다.
  • 호버에 Arros 표시, 화살표 유형, 왼쪽 화살표 아이콘, 그리고 오른쪽 화살표 아이콘 옵션은 '화살표 표시" 사용 가능.

4단계: Elementor Team Carousel 위젯 스타일 사용자 정의 #

팀 캐러셀 슬라이더의 모든 측면을 사용자 정의하고 브랜드에 맞는 스타일을 만들 수 있습니다.

4.1 내용 #

슬라이더의 콘텐츠 영역을 사용자 정의하려면:

  • 다음을 선택하세요. 배경 유형 그리고 배경색 "정상" 상태와 "호버" 상태입니다.
  • 선택 호버 애니메이션 주어진 옵션에서.
  • 설정 조정 콘텐츠를 왼쪽, 오른쪽 또는 가운데로 배치합니다.
  • 조정하다 , 콘텐츠 패딩, 그리고 테두리 반경 콘텐츠 영역의 경우.

4.2 이미지 #

Elementor 팀 캐러셀 슬라이더에서 이미지 스타일을 사용자 정의하려면,

  1. 설정 이미지 크기 표시합니다.
  2. 조정하다 이미지 높이 및 너비.
  3. 설정 박스 섀도우 표시되는 이미지에 대한 것입니다.
  4. 팝업 이미지에 대한 상자 그림자를 설정합니다.
  5. 조정하다 테두리 반경, , 그리고 여유 팀원 이미지용입니다.
  6. 변경 배경 유형 그리고 배경색.

4.3 이름 #

팀 구성원 이름의 스타일을 변경할 수 있습니다.

  1. 설정 타이포그래피 이름의.
  2. 선택하다 그림 물감 "정상" 및 "호버" 상태의 경우.
  3. 조정하다 여백 상단 및 여백 하단 회원 이름으로.

4.4 지정 #

팀원 지정 스타일을 변경할 수 있습니다.

  1. 설정 타이포그래피 지정의.
  2. 선택하다 그림 물감 "정상" 및 "호버" 상태의 경우.
  3. 조정하다 여백 하단.

4.5 설명 #

팀 구성원의 설명 스타일을 사용자 정의할 수 있습니다.

  1. 설정 타이포그래피 설명의.
  2. 선택하다 그림 물감 "정상" 및 "호버" 상태의 경우.
  3. 조정하다 여유 설명 주변.

4.6 버튼 #

버튼 스타일을 사용자 정의하려면,

  1. 설정 타이포그래피 버튼 텍스트의
  2. 버튼을 선택하세요 텍스트 색상.
  3. 선택하다 배경 유형 그리고 배경색.
  4. 다음을 선택하세요. 테두리 유형 버튼을 위해.
  5. 설정 테두리 반경, 패딩, 그리고 여유 버튼을 위해.

'일반' 상태와 '호버' 상태에 대해 개별 텍스트 색상, 배경 색상, 테두리 색상을 설정할 수 있습니다.

4.7 버튼 아이콘 #

버튼 아이콘을 사용하면 스타일을 사용자 정의할 수 있습니다.

  1. 다음을 선택하세요. 색상 버튼 아이콘입니다.
  2. 선택 호버 색상 버튼 아이콘의 경우.
  3. 아이콘 조정 크기.
  4. 세트 여유 버튼 아이콘 주위에 있습니다.

4.8 소셜 프로필에스 #

Elementor 팀 캐러셀 위젯을 사용하여 소셜 프로필 아이콘을 맞춤 설정할 수 있습니다.

  1. 변경 조정 소셜 아이콘 중 하나입니다.
  2. 다음을 선택할 수 있습니다. 표시하다 지정된 옵션의 소셜 프로필 아이콘 레이아웃: 인라인 블록 그리고 차단하다.
  3. 전체적으로 조정해 보세요 아이콘 크기.
  4. 활성화 높이 너비 사용 너비, 높이, 줄 높이를 개별적으로 조정하는 기능입니다.
  5. 아이콘을 선택할 수 있습니다 색상, 배경색, 그리고 테두리 유형.
  6. 설정 테두리 반경,, 그리고 여유 소셜 프로필 아이콘의 경우.

4.9 모달 컨트롤 #

팝업을 활성화하면 이 모달 컨트롤 옵션을 사용할 수 있습니다. 위젯에서는 다음 모달 컨트롤을 사용할 수 있습니다.

씌우다:

  1. 오버레이를 선택하세요 배경 유형.
  2. 배경 유형에 따라 배경을 선택하십시오. 색상 오버레이용.

모달:

  1. 모달을 선택하세요 배경 유형.
  2. 배경 유형에 따라 배경을 선택하십시오. 색상 모달의 경우.

이름:

  1. 회원 색상을 선택하세요 이름.
  2. 설정 타이포그래피 이름 텍스트용.
  3. 조정하다 하단 여백 이름 때문에.

지정:

  1. 회원 색상을 선택하세요. 지정.
  2. 설정 타이포그래피 지정 텍스트의 경우.
  3. 조정하다 하단 여백 지정을 위해.

설명:

  1. 색상을 선택하세요 설명 팀원의.
  2. 설정 타이포그래피 설명 텍스트의 경우
  3. 조정하다 하단 여백 설명을 위해.

전화 및 이메일:

  1. 설정 타이포그래피 전화 및 이메일 텍스트의 경우.
  2. 텍스트를 선택하세요 색상 전화 및 이메일용.
  3. 을 추가하다 호버 색상 전화 및 이메일용.

4.10 닫기 아이콘 #

팝업의 경우 닫기 아이콘을 사용자 정의할 수 있습니다.

  1. 선택 닫기 아이콘 Elementor 아이콘 라이브러리에서.
  2. 설정 아이콘 정렬 닫기 오른쪽이나 왼쪽으로.
  3. 당신은 선택할 수 있습니다 아이콘 색상, 아이콘 배경색, 그리고 테두리 유형.
  4. 또한 테두리 반경 그리고 닫기 아이콘의 경우

4.11 화살 #

화살표 탐색을 활성화하면 해당 스타일을 사용자 정의할 수 있습니다.

  1. 조정하다 크기 회전목마에 있는 화살표의 모습입니다.
  2. 당신은 설정할 수 있습니다 화살표 위치. 왼쪽 화살표 위치와 오른쪽 화살표 위치는 개별적으로 조정할 수 있습니다.
  1. 선택 화살표 색상.
  2. 화살표를 선택하세요 배경색.
  3. 선택 테두리 유형 화살을 위해.
  4. 설정 테두리 반경 화살을 위해.
  5. 조정하다 .

4.12 도트 #

도트가 활성화된 경우 도트 스타일을 사용자 정의할 수 있습니다.

  1. 조정하다 사이의 공간 점.
  2. 점을 조정하세요 상단에서 하단까지의 간격.
  3. 당신은 변경할 수 있습니다 불투명 점의.
  4. 설정 너비 점의.
  5. 설정 점의.
  6. 을 추가하다 테두리 반경 점을 위해.
  7. 선택 배경 유형 그리고 배경색.

활동적인:

활성 도트를 별도로 사용자 정의할 수 있습니다.

  1. 선택하다 배경 유형 활성 도트의 색상입니다.
  2. 활성 점 선택 색상.
  3. 조정하다 규모 (크기) 활성 도트의.
  4. 조정하다 너비 활성 점의.
  5. 조정하다 활성 점의.
  6. 선택 테두리 유형.

마지막으로 팀 캐러셀을 표시할 준비가 되었습니다. Elementor Team Carousel Slider 위젯은 ElementKits Pro와 함께 제공됩니다. Elementor Team Carousel Slider 등과 같은 고급 기능을 갖춘 정교한 웹사이트를 디자인하려면 플러그인을 받으세요.

당신의 감정은 무엇입니까?
2024년 1월 28일 업데이트