Divi 5가 트레일을 타오르는 방법 (여전히 알파에있는 동안)

Divi 5는 의심 할 여지없이 형성되고 있습니다. Divi 5 (커스터마이즈 가능한 중단 점)에 첫 번째 새로운 기능을 시작한 지 4 개월이 지났으며 그 이후로 꾸준하고 인상적인 진전을 이루었습니다. 그 4 개월 동안, 우리는 Divi 5에 7 개의 다른 획기적인 기능을 발표했습니다. 이것은 Divi Code Base의 완전한 점검 중에 만든 강력한 기초를 보여줍니다.

그리고 우리는 방금 시작하고 있습니다. Divi가 다른 WordPress 테마 및 페이지 빌더와 어떻게 비교되는지를 광범위하게 살펴 보겠습니다. 언급 한 바와 같이, 우리는 여전히 몇 개월 동안 파이프 라인에 많은 것을 가지고 있지만 Divi 5가 어디에 있는지에 대해 감사하고 다른 솔루션과 비교하는 데 시간이 걸릴 가치가 있습니다. 이것은 360도 비교가 아니라보다 일반적인 조사입니다.

참고 : Divi 5는 새로운 웹 사이트에서 사용할 준비가되었지만 기존 사이트를 Divi 5로 변환하는 것은 권장하지 않습니다.

Divi의 컴백 진행

2025는 Divi 5의 해입니다. 우리는 WordPress에서 최고의 사이트 구축 경험을 구축하기 위해 최선을 다하고 있습니다.

이것은 후드 아래의 근본적인 변화로 시작되었으며 이제는 새로운 디자인 시스템과 지원 기능으로 구체화되고 있습니다.

1. 리팩토링 및 현대 코드베이스

Divi 5는 빠른 수정 및 업데이트의 패치 워크를 통해 도착하지 않았습니다. 모든 모듈, 설정 및 상호 작용은 리엔지니어링되어 더 깨끗하고 빠르며 확장 가능한 새로운 아키텍처를 지원했습니다.

대조적으로, 산소는 몇 달 동안 개발을 일시 중지 한 후 나중에 기존 산소 부위에 대한 업그레이드 경로가없는 새로운 건축업자를 출시했습니다. 레거시 제품에 투자 한 경우, 새로운 프레임 워크를 재건하거나 보안 업데이트를 위해 해결해야합니다 (또는 다른 빌더로 전환).

산소 v4는 새로 발표 된 v6과 호환되지 않습니다.

Divi 5는 다릅니다. 우리는 미래의 기초를 만들면서 초점을 뒤로 호환했습니다.

소규모 팀은 새로운 플랫폼을 개발하거나 레거시 팀을 유지하고 있지만 시간이 지남에 따라 어떻게 진화 할 것인지는 불분명합니다. Builderius 또는 Etch와 같은 플랫폼은 화려한 선언문을 가지고 있지만 아직 장수로 입증되지 않았습니다. WPBAKERY는 여전히 오래된 기초에서 매년 나오는 기능의 세분기로 운영되며 별도의 비 호환 웹 사이트 빌더를 구축했습니다.

블록 편집자는 새로운 WordPress 디자인 시대를 약속했지만 개발자에게 크게 제공되었습니다. 대부분의 사이트 소유자는 여전히 제한적이고 복잡하다는 것을 알기 때문에 플러그인을 보충하여 실행 가능합니다.

이들은 더 많은 보충제는 말할 것도없이 플러그인 중 일부일뿐입니다.

Elegant Themes에는 10 년 동안의 실적을 가진 크고 안정적인 팀이 있기 때문에 Vaporware 또는 실험 제품에 베팅하지 않습니다.

2. WordPress를위한 최고의 사전 설정 시스템

대부분의 디자인 시스템은 선택적 글로벌 스타일 또는 테마 만 사용합니다 .JSON 파일. Divi 5는 맞춤형 CSS 및 기본 디자인 변수를 지원하지만 옵션 그룹 및 요소 사전 설정을 포함한 광범위한 사전 설정 시스템도 있습니다.

옵션 그룹 사전 설정은 유사한 설정 그룹이있는 요소에서 작동합니다. 예를 들어 제목, 간격, 크기 및 테두리 반경에 일관성을 제공하는 좋은 방법입니다.

Element Presets는 Divi와 함께 오랜 시간이 걸렸으며 다양한 상황에서 사용되는 동일한 모듈에 디자인을 쉽게 적용 할 수 있습니다. 다른 건축업자는 글로벌 스타일을 제공 할 수 있지만 Divi 5는 집중 가능한 방식으로 설정 그룹을 만들고 재사용 할 수있게함으로써 더 나아갑니다. 이것은 Divi에 크게 독특한 대규모 생산성 업그레이드입니다.

3. 디자인 변수

설계 변수에 대해 알아야 할 두 가지 중요한 사항이 있습니다.

1. 설계 변수는 CSS 변수와 유사하게 작동하므로 재사용 가능한 값을 UI에 저장할 수 있습니다.
2. 설계 변수는 일반적인 CSS 변수가 컨텐츠를 포함하기 위해 처리 할 수있는 것 이상으로 이동합니다 (이미지, URL 및 텍스트 문자열 생각)

벽돌은 색상과 간격 토큰을 지원하지만 Divi의 변수는 더 깊어집니다. 호출 유도 문자 텍스트, 이미지 또는 특정 URL과 같은 것들을 변수로 정의하고 그것이 의미가있는 곳 어디에서나 재사용 할 수 있습니다.

Elementor, WPBakery 및 Block Editor는 시스템 전체 변수를 제공하지 않습니다. 물론 Divi에는 이것을 가지고 있으며 CSS 변수를 사용할 수 있습니다.

4. 모든 CSS 장치를 사용하는 능력

더 이상 기본 단위 제한이 없습니다. Divi 5는 VW, REM, Fit-Content, Clamp () 및 calc ()을 포함한 유효한 CSS 장치를 허용합니다. 사용자 정의 CSS를 통해 추가 할 수있는 CSS 변수를 사용할 수도 있습니다.

변수 관리자에서도 편집기 전체에서 고급 CSS 단위 및 기능을 사용하십시오.

Divi 5는 clamp (), calc () 및 단위리스 값을 포함한 모든 현대 CSS 단위를 지원합니다. 이를 통해 디자이너는 유체 레이아웃, 확장 가능한 유형 및 편안한 CSS 장치를 사용한 반응 간격을 제어 할 수 있습니다.

5. 기초 플라이휠

Divi 5의 새로운 아키텍처에 대한 최고의 보상 증거는 무엇입니까? 우리가 새로운 기능을 발표 한 속도. 그렇습니다. 위에서 보여준 특징 (그리고이 시점 아래)은 훌륭한 추가 기능이지만 집계에서 인상적인 것은 매우 빨리 만들어 졌다는 것입니다.

단 3 개월 만에 7 개의 주요 기능이 출시됩니다. 그것이 고의적 인 플라이휠 효과의 결과입니다.

페이스 : 12.3 일마다 새롭고 주요 Divi 5 기능!

다른 건축업자는 종종 비슷한 기능을 출시하는 데 몇 달이 걸립니다. 시스템은 모든 단계에서 싸우기 때문입니다. 그들은 모래에 고층 빌딩을 만들려고 노력하고 있습니다.

대조적으로 Divi 5는 성장하고 확장하도록 설계되었습니다. 우리는 Divi의 최선을 다하고 현대화했으며 두려움없이 추가하여 WordPress에서 구축하는 것이 가장 좋습니다. Divi 5가 공개 베타와 그 너머에 도달하면, 우리는 경쟁을 쫓지 않고 모든 사람이 따라야 할 새로운 표준을 만들지 않을 것입니다.

6. 놀라운 속도

Divi 5에서는 빌더가 더 빨리 반응하고 변경 사항이 더 빠르며 큰 페이지가 지연되지 않습니다. 왜? 우리는 필요한 것을로드하기 위해 모든 것을 재건했습니다. 새로운 엔진은 지능형 코드 분할 및 최적화 된 모듈 로직을 사용하여 방정식에서 중복 스크립트를 제거합니다. 또한 긴 업데이트 또는 원형 종속성을 피하기 위해 모범 사례와의 모든 상호 작용을 처리합니다.

Elementor는 편집기에서 느리기 때문에 Canvas 모드에있을 때에도 느낄 수 있습니다 (편집기에 헤더 또는 바닥 글이로드되지 않음).

Divi는 훨씬 더 잘 수행됩니다. 빌더 내부의 요소를 얼마나 빨리 복제 할 수 있는지 확인하십시오.

모든 새로운 기능은 편집기 및 프론트 엔드에서 속도에 대해 엄격하게 테스트됩니다. 모듈을 열거나 섹션을 드래그하면 느낄 수 있습니다. 인터페이스는 매우 기뻐하며 변경 사항은 즉시 발생합니다.

우리는 사랑하는 사람이지만 느린 애니메이션을 제거 했으므로 클릭, 대기,로드 사이클을 통과 할 필요가 없습니다.

7. 실제로 현대적이라고 느끼는 시각적 빌더

속도를 넘어서면 분위기가 바로 다르다는 것을 알 수 있습니다. Divi 5의 새로운 인터페이스는 당신과 싸우지 않습니다. 패널은 기본적으로 도킹됩니다. 필요에 따라 튀어 나올 수 있습니다. 다크/라이트 모드와 사용자 정의 악센트 색상으로 UI를 사용자 정의 할 수 있습니다. 새로운 디자인 시대를위한 새롭고 전문적인 UI입니다.

모든 것이 읽기 쉽습니다. 이것은 소규모 업그레이드처럼 들릴지 모르지만 비좁은 인터페이스로 디자인하는 데 몇 시간을 보낸 사람은 누구나 그 정도가 얼마나 중요한지 알고 있습니다.

레이어보기 및 X- 레이 토글은 시각적으로 복잡한 페이지에서 디자인을 이해하는 데 도움이됩니다.

Divi Classic 인 WireFrame View를 사용하면 설계 세부 사항을 렌더링하지 않고도 엄격하게 레이아웃 관점에서 페이지를 볼 수 있습니다.

8. 사용자 정의 가능한 중단 점

3 개의 고정 중단 점 대신에 7 개가 있습니다. 7 개는 모두 사용자 정의 가능하므로 각 중단 점에 대한 화면 크기를 사용자 정의 할 수 있습니다. 이를 기존의 중단 점 값으로 설정하거나 설계 우선 접근 방식을 취하고 사이트 흐름 및 설계의 요구에 맞게 사용자 정의 할 수 있습니다.

진정한 이점? 그들은 편집자에 통합되어 쉽게 액세스 할 수 있습니다. 흐름을 떠나거나 3-4 개의 메뉴를 사용하여 사이트 설정으로 파고들 필요가 없습니다. 캔버스에서 직접 브레이크 포인트 별 스타일을 테스트하고 조정할 수 있습니다.

그것은 혁명적이지는 않지만 디자이너에게 더 부드럽고 직접적이며 친근합니다. WPBakery 또는 Native Block Editor와 달리 Divi 5는 코드 줄을 터치하지 않고 반응 형 중단 점을 완전히 제어 할 수 있습니다.

우리는 아직 끝나지 않았습니다 (그러나 우리는 이미 앞서고 있습니다)

Divi 5는 해안이 아닙니다. 가속화되고 있습니다. 아직 기능이 완료되지는 않았지만 우리는 이미 Divi가 경쟁을 따라 잡고 도약 할 수 있도록 이미 만들고 있습니다. 기존 사이트는 업데이트하기 전에 공개 베타를 기다리기를 원할 수도 있지만 마이그레이션 시스템이 타사 모듈 등에 대한 후진 호환성을 완벽하게 처리하기 시작하면 알려 드리겠습니다.

우리는 모든 것을 재건하고 과거 한계를 제거하고 몇 주마다 새로운 기능을 배송했으며 막 시작했습니다. 다음은 다음에 오는 일을 엿볼 수 있습니다.

Divi가있는 컬러 시스템의 새로운 시대

Divi의 컬러 시스템이 업그레이드되고 있습니다.

우리는 HSL 기반 색상 생성에 대한 완전한 지원을 추가하고 있습니다. 즉, 색조, 채도 및 가벼움 값은 설계 전체에서 프로그래밍 방식으로 조정될 수 있습니다. 브랜드의 글로벌 팔레트와 아름답게 동기화되는 "1 차 색상, 20% 가벼운"과 같은 상대 색상을 만들 수 있습니다. 이것은 글로벌 색상 관리의 확장 및 설계 변수 관리자의 추가이며, 우리는이를 사용하는 것을 좋아한다고 생각합니다.

플렉스가있는 레이아웃

Flexbox로 구동되는 새로운 행 템플릿, 열 제어, 수직 정렬, 포장 및 간격 도구를 사용하여 상상할 수있는 레이아웃을 곧 설계 할 수 있습니다. 레이아웃 구조를 단순화하고 "전문 섹션"의 필요성을 제거하며 페이지의 모든 부분에 새로운 유연성을 제공합니다.

이것을 중첩 행과 결합하면 코드가 적고 성능이 향상되어 완전히 반응이 좋고 깊은 사용자 정의 레이아웃을 구축 할 수 있습니다.

Divi는 빠르게 움직이고 있습니다

우리는 놀라운 새로운 기능, Divi의 속도 향상을 시작했으며 현대적이고 유연한 편집자에서 모든 작업을 수행했습니다.

그리고 이제 HSL 색상과 Flexbox가 데크 (및 기타 발표되지 않은 기능)를 통해 디자이너에게 그들이 기다리고있는 도구를 제공합니다.

참고 : Divi 5는 새로운 웹 사이트에서 사용할 준비가되었지만 기존 사이트를 Divi 5로 변환하는 것은 권장하지 않습니다.