Divi 3.0은 사용자를위한 놀라운 프런트 엔드 빌더를 제공합니다. WooCommerce SHOP

Divi 우리가 선택한 WordPress 테마입니다. WooCommerce, 그리고 새로운 Divi 3.0 사용자 인터페이스를위한 최신 JavaScript 라이브러리 인 React를 사용하여 처음부터 다시 작성된 완전히 새로운“비주얼 빌더”(“프론트 엔드 편집기”라고도 함)를 소개합니다. 이 새로운 빌더를 사용하면 간단하고 아름다운 시각적 컨트롤을 사용하여 웹 사이트의 프런트 엔드에서 WordPress 페이지를 편집 할 수 있습니다. 빌더를 활성화하면 웹 사이트의 프론트 엔드에 표시되는 것과 정확히 동일한 페이지가 표시됩니다.

그러나 빌더가 활성화 된 상태에서 페이지는 다음을 사용하여 편집 할 수 있습니다. Divi의 방대한 콘텐츠 요소 및 디자인 설정. 단락을 클릭하고 입력을 시작하고, 텍스트를 강조 표시하고, 글꼴, 크기 및 스타일을 조정하거나, 요소에 대한 설정을 열고 내용, 모양 및 위치를 변경할 수 있습니다. 요소를 드래그, 드롭, 크기 조정, 복사, 붙여 넣기, 삭제 및 복제하는 것도 쉽습니다.

자연스럽고 직관적 인 방식으로 모든 것을 조작 할 수 있기 때문에 페이지가 활기차고 각 요소가 눈에 띄게 느껴집니다. 디자인을 변경하거나 페이지에 새 내용을 추가하면 이러한 변경 사항이 즉시 나타납니다. 새로운 비주얼 빌더는 기존로드에 의존하지 않기 때문에 빌더 경험의 대부분 동안 페이지 새로 고침 또는 Ajax로드 바가 필요하기 때문입니다. 이것이 WYSIWYG의 미래입니다.

다음에서 새 콘텐츠 추가 Divi의 40 개 이상의 모듈

새로운 콘텐츠 추가 Divi 3.0은 간단합니다. 페이지에서 원하는 위치로 마우스를 가져간 다음 "+"버튼을 클릭하여 새 요소를 추가합니다. 다음 목록이 표시됩니다. Divi거의 모든 종류의 웹 사이트를 구축하는 데 사용할 수있는의 40 개 이상의 콘텐츠 모듈. 중앙 도크에서 콘텐츠를 끌어다 놓을 필요가 없습니다. Divi의 콘텐츠 툴팁은 필요할 때 항상 있습니다.

인라인 에디터 -1

모든 것을 쉽게 사용자 정의

의 아름다움 Divi 3.0은 콘텐츠 디자인을 조정하기 시작할 때 분명해집니다. 모든 것을 사용자 정의 할 수 있으며 이러한 변경 사항이 나타나는 것을 볼 수 있습니다. 실시간:

  • 수십 개의 사용자 정의 글꼴 중에서 선택하십시오.
  • 텍스트 색상, 크기, 줄 높이 및 문자 간격을 조정하십시오.
  • 사용자 정의 패딩 및 여백을 추가하십시오.
  • 열 구조와 행 높이를 변경하십시오.
  • 배경색과 이미지를 추가하십시오.
  • 시차 배경 및 비디오 배경을 활성화합니다.
  • 컨텐츠 요소를 끌어다 놓기, 복사 및 붙여 넣기
  • 반응 형 중단 점마다 다른 디자인 설정을 적용하십시오.
  • 행 높이와 너비를 조정하려면 드래그하십시오.
  • 아름다운 인라인 편집 경험을 즐기십시오

새 비주얼 빌더가 활성화되면 페이지의 모든 텍스트를 편집 할 수 있습니다. 텍스트 콘텐츠를 조정하기 위해 요소의 설정을 열 필요가 없습니다. 단락을 클릭하고 입력을 시작하여 텍스트를 추가하거나 텍스트를 강조 표시하여 글꼴, 크기, 스타일 및 간격을 조정하십시오. 그들은 매우 부드럽고 사용하기 좋은 자체 인라인 편집기 UI를 만들었습니다. 바쁜 표준 TinyMCE 인터페이스에 실망한 적이 있다면 다음을 사용할 때 즐겁게 놀라게 될 것입니다. Divi 3.0.

믿을 수없는 속도를 경험하십시오

Divi 3.0의 비주얼 빌더는 아마도 지금까지 사용 해본 가장 빠른 온라인 웹 사이트 구축 경험 일 것입니다. 페이지 새로 고침이나 Ajax 로딩 바가 거의 또는 전혀 없습니다. 사실, 대부분의 건축 과정에서 어떤 종류의 전통적인 적재도 없습니다. 이는 JavaScript가 빌더를 지원하고 건물 경험이 전적으로 브라우저에서 발생하기 때문입니다.

변경 사항이 발생하기 위해 브라우저와 서버 간의 통신에 의존하는 대신 Divi 3.0 빌더는 애플리케이션이 각 변경 사항을 계산하는 데 걸리는 시간 만 기다리면됩니다. 괜찮은 컴퓨터와 최신 브라우저와 함께 사용하면 콘텐츠를 추가하고 조정할 때 거의 즉각적인 업데이트를 경험할 수 있습니다. 서버로드, 서버 속도 및 인터넷 속도는 더 이상 요소가 아닙니다.

"보이지 않는"및 사용자 정의 가능한 빌더 인터페이스

맞춤형 인터페이스 -2

그들은 새로운 비주얼 빌더의 디자인을 "보이지 않는 인터페이스"라고 코드 명으로 지정했습니다. 이것은“좋은 디자인은 종종 눈에 띄지 않게된다”는 그들의 핵심 디자인 철학 중 하나를 나타냅니다. 최고의 UI는 방해가되지 않는 UI와 의도를 예측하고 솔루션을 제공하는 UI입니다. 이것이 인터페이스가 진정으로 "직관적"이라는 의미입니다. Divi 3.0은 불필요한 격자, 선 및 버튼으로 당신을 공격하지 않습니다. 화면 공간을 훔치는 플로팅 헤더 나 사이드 바나 시야를 가리기위한 오버레이가 없습니다. 빌더를 처음로드 할 때 거기에 있는지조차 모를 수도 있지만 마우스로 페이지를 탐색하기 시작하면 컨트롤이 분명해집니다.

Divi 3.0의 비주얼 빌더는 사용자 정의 가능한 인터페이스를 제공하는 최초의 WordPress 페이지 빌더입니다. 즉, 빌더의 컨트롤이 표시되는 방식과 관련하여 특정 UI 규칙을 따르지 않습니다. 이러한 설정이 모달 팝업에 나타나도록 선택하거나 해당 팝업을 페이지 측면에 스냅하고 "사이드 바"모드로 들어갈 수 있습니다. 조정할 수 있습니다
화면 크기 나 페이지의 내용에 따라 공간을 최적화 할 수 있도록 팝업 및 사이드 바의 크기와 위치

카탈린 조르지 니

나는 웹 디자인 블로거이고 몇 주를 보냈다가 최고의 전자 상거래 플랫폼 나 자신을 위해. 내 현재 확인 10 대 전자 상거래 사이트 구축 업체.