플립박스

Flip Box 위젯을 사용하면 사용자가 작업을 수행하면 반대쪽으로 뒤집히는 애니메이션 상자를 만들 수 있습니다. 클릭하고 마우스를 올리면 Elementor 플립 상자를 만들 수 있습니다. 이 위젯을 사용하여 플립 박스의 양면을 사용자 정의할 수 있습니다.

메모: 프로세스를 따르려면 Elementor와 ElementsKit을 설치해야 합니다. ElementsKit Pro 설치 및 활성화에 도움이 필요하면 다음을 확인하세요. ElementsKit 설치 가이드.

ElementsKit을 사용하여 WordPress 사이트에 플립박스를 추가하는 방법 #

ElementsKit을 사용하여 WordPress 사이트에 플립 박스를 쉽게 추가하려면 아래 설명된 단계를 따르세요. 엘레멘터:

1단계: 플립박스 위젯 활성화 #

로 이동 ElementsKit ⇒ 위젯 ⇒ 플립박스 위젯, 위젯 켜 줘, 그리고 변경 사항 저장을 클릭하세요.

Elementskit의 플립 박스 위젯 활성화

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

Elementor로 편집 옵션을 사용하여 페이지를 편집하십시오. 그 다음에 찾다 Ekit 아이콘이 있는 플립 박스 위젯의 경우 간단히 위젯을 드래그 앤 드롭하세요 페이지에서.

Elementskit의 플립 박스 위젯 드래그 앤 드롭

3단계. 설정 사용자 정의  #

뒤집기 상자 메뉴를 확장하여 다음 설정을 변경합니다.

  • 튀기다: 뒤집기에는 뒤집기, 확대, 슬라이드 인 및 3D의 네 가지 옵션이 있습니다.
  • 뒤집기 방향: 방향 반전에는 여러 옵션을 사용할 수 있습니다. 그러나 반전 옵션에 대해 선택한 값에 따라 옵션이 나타납니다.
  • 플립 트리거: 여기에서 뒤집기를 실행하는 옵션을 선택할 수 있습니다. 호버(Hover), 상자 클릭(Box Click), 버튼 클릭(Button Click)의 세 가지 옵션을 사용할 수 있습니다.
  • 플립 박스 높이: 이 옵션을 사용하여 플립 박스 높이를 조정할 수 있습니다.
플립 박스 설정 요소 키트

상자 높이 뒤집기 아래에는 FRONT(앞)와 BACK(뒤) 두 개의 탭이 있습니다. 각 측면의 플립 상자 요소를 사용자 정의하려면 옵션을 선택하세요. 양쪽 모두에 대해 동일한 옵션을 찾을 수 있습니다. 

각 플립 박스 측면에 대해 사용자 정의할 수 있는 옵션은 다음과 같습니다. 

  • 매체 유형: 아이콘이나 이미지를 선택할 수 있습니다. 미디어 파일을 추가하지 않으려면 없음 옵션을 선택할 수도 있습니다..
  • 아이콘/파일 선택: 미디어 유형으로 선택한 옵션에 따라 여기에서 아이콘/이미지를 선택할 수 있습니다.
  • 제목: 제목을 입력하세요.
  • 부제: 여기에 자막을 추가할 수 있습니다.
  • 플립 설명: 이 옵션을 사용하여 관련 설명을 작성하세요.
  • 조정: 정렬을 왼쪽, 중앙, 오른쪽으로 설정할 수 있습니다.
플립박스 앞면

플립 박스 양쪽에 대한 콘텐츠 준비를 마친 후에는 스타일을 변경할 차례입니다. 

4단계: 플립박스 스타일 지정 #

이제 스타일 탭으로 이동하여 각 섹션을 확장하여 관련 스타일 옵션을 변경합니다.

싸개: 래퍼 아래에서 배경 유형, 색상, 위치, 두 번째 색상, 위치, 유형, 각도 등을 사용자 정의할 수 있습니다. 플립 박스의 앞면과 뒷면에 대한 옵션을 사용자 정의할 수 있습니다.

플립박스의 래퍼 설정

상: 이 옵션을 확장하면 일반 보기와 마우스 오버 보기 모두에 대해 색상, 배경 유형, 상자 그림자, 테두리 유형 등을 변경할 수 있습니다. 플립 박스의 앞면과 뒷면 모두에 대한 아이콘 스타일을 사용자 정의할 수 있습니다.

아이콘 스타일 플립 박스 설정

제목: 여기에서 플립 박스 양쪽 제목의 타이포그래피, 제목 색상 및 여백을 사용자 정의할 수 있습니다.

제목 스타일 플립 상자 설정

부제: 이 옵션을 확장하여 플립 박스 양쪽에 대한 자막의 타이포그래피, 제목 색상 및 여백을 사용자 정의합니다.

설명: 여기에서 플립 박스 양쪽 측면에 대한 설명의 타이포그래피, 설명 색상 및 여백을 사용자 정의할 수 있습니다.

설명 스타일 반전 상자 설정

단추: 버튼 섹션을 확장하여 텍스트 색상, 배경 색상, 테두리 유형, 테두리 반경, 테두리 상자 및 더 많은 옵션을 사용자 정의합니다. 일반 뷰와 마우스 오버 뷰 모두에 대한 버튼 스타일을 지정할 수 있습니다.

버튼 스타일 플립 박스 설정

마지막으로 게시/업데이트를 클릭하여 변경 사항을 저장하고 Elementor 플립 상자를 미리 봅니다.

플립 박스 요소 키트 미리보기
당신의 감정은 무엇입니까?
2022년 11월 29일에 업데이트됨