Divi 5와 단축 코드에서 벗어나다

게시 됨: 2023-09-29

또 다른 Divi 5 업데이트로 돌아왔습니다! 아시다시피 우리는 성능, 확장성 등 근본적인 개선에 초점을 맞춰 Divi Builder를 재구축하는 대규모 프로젝트를 진행하고 있습니다.

저는 커뮤니티에 우리의 진행 상황을 알리기 위해 매달 빠른 업데이트를 제공합니다. 지난 달 저는 Divi 5 출시에 앞서 진행될 4가지 베타 단계 중 두 번째인 Divi 5 Dev Beta 출시를 발표했습니다. Dev Beta 출시와 Divi 5 API 완성으로 우리는 공개 알파를 향해 노력하고 있습니다. 우리는 첫 번째 공개 베타 버전을 널리 사용할 수 있도록 Divi의 핵심 기능을 충분히 완성했습니다.

이번 달에 우리가 성취한 것

이번 달에는 Accordion 모듈, Social Follow 모듈, 아이콘 모듈, 검색 모듈, 코드 모듈 등 더 많은 Divi 모듈의 변환을 완료하여 많은 성과를 거두었습니다. 우리는 더 많은 버그를 수정하고, 더 많은 개선을 이루고, 더 많은 문서를 업데이트하고, 공개 알파 단계를 향한 전진을 계속했습니다.

다음은 최신 Divi 5 변경 로그 항목입니다.

Divi 5용 지도 및 지도 핀 모듈 추가
Divi 5에 가격표 및 가격표 모듈이 추가되었습니다.
Divi 5용 슬라이더 및 슬라이드 모듈 추가
Divi 5용 비디오 모듈 추가
클라우드 앱을 통해 미리 만들어진 레이아웃 가져오기를 시각적 빌더로 구현합니다.
채워진 텍스트 상자에도 표시되도록 동적 콘텐츠 버튼을 수정했습니다.
모듈 설정 모달에 중첩된 옵션 그룹에 대한 UI 개선 사항이 추가되었습니다.
모듈 메타데이터 속성 값이 검증되었는지 확인하기 위해 입력된 ts 파일에서 module.json을 생성했습니다.
업데이트된 PHP 스냅샷 테스트
하위 테마가 활성화된 경우 Divi 스타일시트가 빌더에 로드되지 않는 버그를 수정했습니다.
시각적 빌더에서 나가는 포트폴리오 링크를 수정했습니다.
사용자 지정 호버 이미지를 재설정하면 FE에서 충돌이 발생하는 문제가 해결되었습니다.
도움말 모달을 도킹 해제하면 도움말 모달이 원래 크기보다 크게 나타나는 도움말 모달 크기 문제가 해결되었습니다.
Divider 모듈의 기본 가중치를 수정했습니다.
Blurb 모듈의 아이콘 기본 크기를 수정했습니다.
CTA 및 로그인 버튼 테두리와 텍스트 색상이 기본적으로 비어 있도록 업데이트되었습니다.
연결된 이미지 요소를 렌더링하는 데 작동하는 ModuleElements 클래스에 elementType imageLink를 도입했습니다.
래퍼 요소를 렌더링하는 데 작동하는 ModuleElements 클래스에 elementType 래퍼를 도입했습니다.
이미지 요소를 렌더링하는 데 작동하는 ModuleElements 클래스에 elementType 이미지를 도입했습니다.
코드 모듈에 대한 D4와 D5 간의 HTML 차이를 수정했습니다.
Divi 5용 아코디언 및 아코디언 아이템 모듈 추가
Divi 5에 소셜 미디어 및 소셜 미디어 항목 모듈이 추가되었습니다.
Divi 5용 아이콘 모듈 추가
Divi 5에 검색 모듈이 추가되었습니다.
Divi 5용 전폭 코드 모듈 추가
Divi 5 PHP 액션 및 필터 후크용 문서 생성기를 만들었습니다.
PHP 액션 후크 문서 선언이 업데이트되었습니다.
PHP 필터 후크 문서 선언이 업데이트되었습니다.
PHP API에 대한 문서가 업데이트되었습니다.
모듈 설정 및 일반적인 모달에 대한 UI 개선 사항이 추가되었습니다.
모듈 개발의 최신 개선 사항을 통합하도록 튜토리얼을 업데이트했습니다.
새로운 필드 라이브러리 구성요소 추가: 경고
`animationClassnames` 구현을 리팩터링
`module.json`의 모듈 메타데이터에 대한 `moduleClassname` 및 `moduleOrderClassname` 속성을 추가했습니다.
`ModuleElement.scriptData()` 메소드를 추가했습니다.
`ModuleElement.styleComponents()` 메소드를 추가했습니다.
향상된 UI를 활성화하는 옵션이 추가되었습니다.
애니메이션 스타일을 변경하면 모듈이 충돌하는 문제가 해결되었습니다.
상태 선택기 모달에서 올바른 상태(데스크탑, 태블릿 등)가 선택되지 않는 문제가 수정되었습니다.
고정에 대한 잘못된 선택기를 수정했습니다.
문서 사이트에 남아 있는 defaultAttrs 및 defaultPrintedStyleAttrs 참조를 수정했습니다.
필드 소품이 명시적으로 선언되지 않은 경우 고정 모듈 설정 필드가 반응형/호버/고정 값을 올바르게 처리하지 않습니다.
Firefox의 버튼에 있는 페이지 설정 표시줄 아이콘이 중앙에 위치하지 않는 문제 수정
Blurb 모듈에서 D4에서 D5로 링크 옵션을 가져오는 문제가 수정되었습니다.
CTA 모듈에서 D4에서 D5로 링크 옵션을 가져오는 문제가 수정되었습니다.
탭 모듈의 콘텐츠 패널에 동적 하위 항목 제목을 표시하는 문제가 수정되었습니다.
고정 수직 및 수평 오프셋은 전체 폭 헤더 모듈의 상대 위치에서 작동하지 않습니다.
테마 스타일 다음에 패키지 스타일을 적절하게 대기열에 추가합니다.
개발자 베타 튜토리얼에서 사용되는 기능의 문서 페이지가 업데이트되었습니다.

단축 코드에 대해 이야기합시다

또한 Divi 5의 가장 중요한 변경 사항 중 하나인 단축 코드 제거와 WordPress의 미래에 맞는 보다 현대적인 저장 형식으로의 마이그레이션에 대해 잠시 논의하고 싶었습니다.

왜 단축 코드에서 벗어나야 할까요?

Divi 5가 단축 코드에서 벗어나면 여러 가지 이점이 있습니다. 첫째, WordPress는 점점 더 많은 사용자가 새 편집기를 선호함에 따라 필연적으로 단축 코드를 더 이상 사용하지 않을 것이며, 우리는 계속 앞서 나가기를 원합니다.

또한 단축 코드에는 무한히 중첩된 요소와 같은 특정 작업을 수행하기 어렵거나 불가능하게 만드는 제한 사항이 있으며 게시물 콘텐츠 내의 특정 문자가 단축 코드 논리를 깨뜨리는 등 종종 추악한 머리를 뒤흔드는 본질적인 문제도 있습니다. 근본적인 문제를 해결하기 위한 지나치게 복잡한 솔루션.

또한 단축 코드는 구문 분석에 복잡한 정규 표현식이 필요할 수 있으므로 성능이 떨어집니다. 반면에 새로운 저장소 형식은 구문 분석이 훨씬 쉬워서 성능이 약간 향상됩니다.

마지막으로 Divi에서 벗어난 후 게시물 콘텐츠에 단축 코드가 남아 있는 문제가 있는데, 이는 Divi 5에서는 더 이상 문제가 되지 않습니다. Divi 5로 웹사이트를 구축한 후 새로운 테마나 빌더로 전환하는 경우 , 게시물 콘텐츠에 원하지 않는 단축 코드를 사용하는 대신 빈 상태로 시작하게 됩니다.

기존 웹사이트에서 단축 코드를 어떻게 마이그레이션합니까?

이러한 전환을 수행하려면 프로그래밍 방식으로 귀하의 웹사이트를 검색하고 단축 코드를 새로운 형식으로 변환해야 합니다. Divi 5로 업그레이드한 후에는 변환을 완료하기 위해 시작하는 마이그레이션 프로세스가 있습니다. 이전 Divi 4 단축 코드는 여전히 Divi 5에서 작동하지만 성능 비용이 발생하므로 전체 웹 사이트가 Divi 5 프레임워크를 사용하도록 모든 사람이 웹 사이트를 마이그레이션하고 타사 Divi 모듈을 업데이트하는 것이 좋습니다.

반면에 Divi 5에서 새 웹사이트를 구축하는 경우 모든 것이 기본적으로 새 프레임워크를 사용합니다. 라이브러리에 있는 이전 레이아웃이나 Divi 4에서 내보낸 이전 레이아웃은 가져올 때 자동으로 Divi 5 형식으로 변환됩니다.

추가 업데이트를 계속 지켜봐 주시기 바랍니다

이번 달 Divi 5 업데이트에 대한 내용은 여기까지입니다. 또 다른 소식으로, 앞으로 몇 주 안에 AI로 코드를 생성할 수 있는 Divi AI 업데이트가 출시될 예정이며 이를 통해 Divi와 해당 모듈을 그 어느 때보다 쉽게 맞춤 설정할 수 있습니다. Divi의 디자인 설정에서 벗어나 자신만의 CSS를 작성하고 싶은 분들에게 이 업데이트가 매우 유용할 것이라고 생각합니다.

계속 지켜봐 주시기 바랍니다. 다음 업데이트에서 뵙겠습니다. 모든 최신 뉴스를 보려면 이메일로 팔로우하고 YouTube 채널을 구독하세요.