Divi 플러그인 하이라이트: Divi Essential

Divi Essential은 Divi Builder에 60개 이상의 새로운 모듈을 추가하는 Divi용 타사 플러그인입니다. 모듈에는 Divi 웹사이트를 전문적으로 보이게 하는 많은 애니메이션과 디자인 기능이 포함되어 있습니다. 이 플러그인 하이라이트에서는 Divi Essential을 살펴보고 Divi 요구 사항에 적합한 플러그인인지 결정하는 데 도움이 되는 모듈 유형을 확인합니다.

Divi 필수 모듈

정상적으로 플러그인을 업로드하고 활성화합니다. 다른 설정은 필요하지 않습니다. Divi Essential은 Divi Builder에 60개 이상의 새로운 모듈을 추가합니다. 모듈 목록에서 해당 모듈은 파란색이고 마우스를 가져가면 한쪽에 보라색 그라디언트가 표시됩니다. 그들의 이름은 설명적이어서 그들이 무엇을 할 수 있는지 쉽게 이해할 수 있습니다. 몇 가지 이름은 처음에는 이해하기 쉽지 않지만 페이지에 모듈을 로드하면 그 용도가 명확해집니다. 눈에 띄는 몇 가지 모듈을 살펴보겠습니다.

다음 3D 큐브 슬라이더

3D 큐브 슬라이더는 큐브 측면에 슬라이드를 표시합니다. 그런 다음 큐브가 회전하여 다음 슬라이드를 표시합니다. 각 슬라이드는 하위 모듈로 생성됩니다. 함께 또는 개별적으로 스타일을 지정할 수 있습니다. 실제 큐브와 달리 원하는 만큼 면(또는 슬라이드)을 가질 수 있습니다.

다음 광고

Next Blurb는 표준 Blurb 모듈과 유사하지만 사전 및 사후 제목 텍스트, 다중 배경, 2D 및 틸트 호버 효과를 포함한 몇 가지 새로운 요소를 추가합니다. 이 예에서 여러 배경색을 추가하고 기울기 효과를 활성화했습니다. 타일에는 눈부심과 반전 기울기도 포함될 수 있습니다.

다음 버튼

다음 버튼은 표준 버튼처럼 작동하지만 호버 설정이 많습니다. 색상, 테두리 및 아이콘에 대해 다양한 크기, 색상 및 애니메이션을 지정합니다.

다음 원형 이미지

원형 이미지는 원 안에 이미지를 표시하고 많은 호버 옵션을 포함합니다. 이미지 위로 마우스를 가져가면 애니메이션이 수행되고 제목과 콘텐츠가 있는 오버레이가 표시됩니다. 콘텐츠는 표준 텍스트 편집기로 생성되므로 미디어와 코드를 포함할 수 있습니다. 19가지 호버 효과 중에서 선택할 수 있으며 호버 방향을 선택할 수 있습니다. 이미지에 색상 가장자리를 추가할 수도 있습니다.

다음 Coverflow 슬라이더

Coverflow Slider는 슬라이드를 서로 겹치는 이미지로 표시하는 흥미로운 슬라이더입니다. 현재 슬라이드가 가장 크고 중앙에 가깝게 배치됩니다. 나머지는 현재 슬라이드에서 멀어질수록 작아집니다. 슬라이더가 다음 슬라이드로 변경되면 슬라이드가 이동하여 가운데에 있는 슬라이드가 가장 큽니다.

다음 디비 리뷰

Divi 리뷰는 개인 모듈 및 제품 리뷰 모듈로 사용할 수 있습니다. 이 모듈은 서비스를 검토하고 평가할 때 잘 작동합니다. 여기에는 이미지, 등급 시스템 및 이름, 위치 및 설명이 포함된 텍스트가 포함됩니다. 기본적으로 테두리와 상자 그림자가 있습니다.

다음 분배기

다음 구분선 아이콘 또는 이미지가 있는 구분선을 지정한 다음 개별 요소의 스타일을 지정할 수 있습니다. 이미지 배치를 선택하고, 구분선의 크기를 변경하고, 색상, 간격 등을 조정합니다. 이는 기사 작성자, 팀원, 제품 등을 표시하기에 좋은 옵션입니다. 이 예에서는 이미지를 추가하고 너비를 늘렸습니다.

다음 듀얼 버튼

듀얼버튼 재미있네요. 독립적으로 스타일을 지정할 수 있는 두 개의 버튼이 있습니다. 여기에는 많은 호버 효과가 포함됩니다. 두 개의 버튼을 함께 추가하고 각각에 다른 호버 효과를 부여했습니다.

다음 기능 목록

기능 목록을 사용하면 하위 모듈을 사용하여 목록을 만들 수 있습니다. 아이콘 또는 이미지를 표시하고 아이콘, 이미지 및 텍스트의 크기를 조정하고 모든 요소를 ​​개별적으로 또는 함께 사용자화합니다. 이 예에서는 이미지를 추가하고, 이미지와 텍스트의 크기를 늘리고, 한 하위 모듈의 텍스트 색상을 변경하고, 다른 하위 모듈과 테두리 및 배경 색상을 지정했습니다.

다음 이미지 호버 상자

이미지 호버 상자는 이미지를 표시한 다음 호버에 있는 이미지를 배경 오버레이, 제목 및 콘텐츠로 바꿉니다. 원하는 콘텐츠에 무엇이든 추가하고 각 요소의 스타일을 지정할 수 있습니다. 13가지 호버 효과와 4가지 방향 중에서 선택하세요. 애니메이션은 흥미롭습니다. 이미지는 회전, 뒤집기, 회전, 확대/축소 등을 할 수 있습니다.

다음 이미지 아이콘 효과

이미지 아이콘 효과를 사용하면 마우스를 올리면 이미지 하단에 나타나는 오버레이에 최대 4개의 아이콘을 추가할 수 있습니다. 오버레이에는 제목과 텍스트도 표시됩니다. 아이콘은 위의 예와 같이 링크가 될 수 있습니다. 이것은 이미지에 소셜 팔로우 버튼이나 기타 링크를 추가하는 흥미로운 방법입니다.

다음 이미지 스크롤

이미지 스크롤은 이미지보다 짧은 창에 이미지를 배치합니다. 이미지 위로 마우스를 가져가면 창 내에서 스크롤되어 이미지의 나머지 부분이 표시됩니다. 오버레이와 버튼이 포함되어 있습니다. 오버레이는 마우스 오버 시 사라집니다. Divi 레이아웃, 위치 지도 또는 기타 유형의 키가 큰 이미지와 같은 제품을 표시하는 데 탁월합니다.

다음 벽돌 갤러리

Masonry Gallery는 갤러리를 그리드로 표시합니다. 각 이미지는 그리드에 맞게 크기가 조정됩니다. 열 수, 여백 너비를 설정하고, 이미지에 테두리를 추가하고, 오버레이를 사용자 지정하고, 이미지로 스타일을 지정할 수 있습니다. 이미지를 클릭하면 라이트박스에서 열립니다.

다음 메가 이미지 효과

Mega Image Effect는 이미지를 표시하고 마우스 오버 시 오버레이 및 버튼으로 대체합니다.

여기에는 호버 배경 및 버튼 배경 설정이 포함됩니다. 다음은 이미지 위로 마우스를 가져갈 때의 오버레이입니다. 또한 호버 효과 및 텍스트 선택 효과가 있습니다. 오버레이를 파란색으로, 텍스트를 흰색으로 설정했습니다.

다음 프로모션 상자

Promo Box는 가장 흥미로운 모듈 중 하나입니다. 제품 쇼케이스 모듈이며 이미지, 제목, 사전 및 사후 제목 텍스트, 설명, 버튼 및 제안 배지를 포함합니다. 이 제안은 할인율을 표시하며 판매를 실행하는 데 적합합니다. 각 요소는 별도로 스타일을 지정할 수 있습니다.

다음 단계 흐름

Step Flow는 블러브 모듈에 대한 흥미로운 해석입니다. 이미지 또는 아이콘, 화살표, 배지 및 콘텐츠가 포함된 단계를 표시합니다. 화살표는 모든 방향을 가리킬 수 있으며 텍스트, 화살표, 배지 및 원의 스타일을 조정할 수 있습니다. 번호가 매겨진 순서로 단계를 표시하고 각 단계가 다음 단계를 가리키도록 하려는 경우에 유용합니다.

다음 타임라인

타임라인은 교차 레이아웃의 타임라인에 카드를 표시합니다. 카드는 하위 모듈로 추가됩니다. 이미지 또는 아이콘을 표시하고, 원하는 콘텐츠 유형을 추가하고, 버튼을 활성화 또는 비활성화하고, 모든 요소의 스타일을 개별적으로 지정합니다. 어두운 파란색 배경, 흰색 텍스트 및 밝은 파란색 버튼으로 첫 번째 카드의 스타일을 지정했습니다. 두 번째 카드는 기본 설정으로 두었습니다.

Divi 에센셜 구매

Divi Essential은 Divi Marketplace에서 사용할 수 있습니다. 여기에는 60개 이상의 모듈이 포함되어 있으며 이 모듈을 사용하여 전문적으로 설계된 500개 이상의 레이아웃에 액세스할 수 있습니다. 일반 비용은 무제한 웹사이트 사용에 대해 $79이며 1년 지원 및 업데이트가 포함됩니다.

마무리 생각

이것이 Divi Essential에 대한 우리의 모습입니다. 이 Divi용 타사 플러그인에는 많은 모듈과 옵션이 있습니다. 나는 그들이 할 수 있는 일의 표면만 긁었다. 모듈 사용 및 설정은 Divi 모듈만큼 직관적이었습니다.

팀 구성원 모듈 또는 텍스트 모듈과 같은 일부는 모듈 내에서 선택 항목으로 옵션과 결합될 수 있는 것처럼 보입니다. 그것은 그들이 제공하는 방대한 양의 옵션을 없애지 않으며 원하는 정확한 기능을 가진 모듈을 로드할 수 있기 때문에 아마도 사용하기 더 쉽게 만들 것입니다.

이 플러그인에는 많은 모듈과 옵션이 있습니다. Divi 웹사이트에 새로운 모듈을 많이 추가하는 데 관심이 있다면 Divi Essential이 탁월한 선택입니다.

우리는 당신의 의견을 듣고 싶습니다. Divi Essential을 사용해 보셨습니까? 의견에 대해 어떻게 생각하는지 알려주십시오.

Inspiring/Shutterstock.com을 통한 추천 이미지