Divi를 위한 플러그인 선택 가이드

필요 없는 플러그인 헤더, 풋터 스크립트 삽입 Insert Headers and Footers Divi의 테마 옵션에 해당 기능이 내장되어 있기 때문에 사용할 필요가 없다. 엘리먼트 고정 Sticky Menu (or Anything!) 이름 그대로 고정 기능을 제공하는 플러그인. 해당 기능이  내장되어 있기 때문에 불필요하다. Divi Sticky Options 스크롤 지원 scroll to id 모든 Divi 모듈은 클래스나 아이디를 넣을 수 있고, anchor로 이동시킬...

일반 페이지 편집 – DIVI 빌더 사용

페이지는 글/상품 등이 아닌 일반적인 소개 페이지 기능에서 필요한 리스트 페이지 들이 있습니다. 전체 페이지는 관리자 > 페이지> 모든 페이지에서 리스트에서 찾아 클릭하여 접근할수 있습니다. 리스트에서 제목 옆에 -DIvi 로 표시된 페이지들은 디비 빌더로 작성된 페이지입니다. 빌더로 작성된 페이지가 아닌것은 일반 텍스트 페이지 또는 테마 빌더에서 디자인 레이아웃이 적용된 페이지입니다. 편집모드 브라우저 상단 관리자바에 아래처럼 페이지 편집하기/시각빌더 활성화...

메뉴 변경 및 스타일 변경

메뉴 추가 및 변경 테마디자인(외모) > 메뉴에서 메뉴 설정을 변경할수 있습니다. 상단에서 편집할 메뉴를 선택한 후 왼쪽 페이지 리스트 및 글/상품 등에서 메뉴에 추가할 페이지를 선택후 메뉴에 추가할수 있습니다. 외부 및 SNS 링크가 필요할 경우 사용자 정의 링크 항목을 이용합니다. 자세한 메뉴 설정 설명은 한국 워드프레스 사용자 모임의 가이드를 참고해주세요. 한국 워드프레스 사용자 모임의 가이드 – 메뉴 설정 메뉴 스타일 변경 에듀마스터 등 테마 빌더...

Divi Module을 조건에 따라 보여주기

구현방법 1. Divi Display Logic  또는 Hide & Show 두 플러그인 모두 제공되는 로직의 종류가 다를 뿐 대동소이하다. 2. Content Visibility for Divi Builder 심플하지만 강력하다. 사실 이 플러그인 설치 후, 빌더 화면에서 별로 바뀌는 건 없다.  그저 보이기 설정에 Content Visibility라는 필드가 추가될 뿐이다. 하지만, 이 필드는 모든 PHP boolean expression을 입력할 수 있어...

관련 포스트 타입 보여주기

구현 방법 1. Related Posts By Taxonomy 리소스 Related Posts by Taxonomy 장점 풍부한 숏코드 옵션 → 별도의 개발지식 없이 다양한 추출 로직 가능. 무료 단점 인덱싱 X → 포스트가 많으면, 부하를 일으킨다. 디스플레이에서 커스텀 필드를 가져오려면 개발 지식이 필요하다. 플러그인 이름 데로 관련도 로직에 Taxonomy만 사용할 수 있고, custom fields는 사용할 수 없습니다. 2. SearchWP SearchWP는...

디비 커스텀 루프 기본 사용법

개념 디비 커스텀 루프 모듈은  반복대상의 템플릿을 DIVI 라이브러리도 대체 할수 있습니다. 적용 Divi 라이브러리 에서 반복대상의 구조를 생성합니다. Divi > 테마 빌더 에서 “디비 커스텀 루프” 모듈을 선택합니다. 빌더 화면에서 모듈 설정 하기 디비 커스텀 루프 모듈의 설정을 합니다. 반복대상 레이아웃 에서  Divi 라이브러리 에서 생성한 레이아웃을 선택합니다. 디자인은 그리드, 리스트 를 선택할수 있습니다. 페이징 방식은 페이지 방식...

Divi 라이브러리 이미지 사이즈 선택

개념 디비 이미지 모듈의 대표이미지의 사이즈를 선택할수 있습니다. 기본 제공되는 이미지 모듈의 경우 사이즈는 원본 사이즈 적용됩니다. 적용  

메뉴 편집을 위한 드래그 앤 드랍이 잘 안됩니다.

원인. 마이크로소프트 엣지 마이크로소프트 엣지 87.0.664.55 버전에서 드래그 앤 드랍 이상을 확인했습니다. 이 이외의 버전에서도 동일 문제가 있다는 해외 보고가 많습니다. 해결방법 1. 물론 가장 간단한 해결방법은 브라우저를 변경하면 됩니다. 해결방법 2. 엣지를 메인 브라우저로 쓰면서 변경이 번거롭다면 테마의 사용자 정의하기를 써도 됩니다.  ...

Divi theme builder 에서 Learndash 3.2.3.1 이슈

Learndash  버전 3.2.3.1  기준  Divi Theme Builder 에서 강의 페이지 적용시 컨텐츠 게시 모듈을 통해 강의 상세 페이지 구현되어 있다면, Learndash 의 강의 테마 를 거치지 않아서 수업진도율, 강의 연결된 수업 목록등의 내용이 나오지 않고 강의 에서 작성된 컨텐츠만 출력됩니다. 아래 내용을 wp-config.php 에 추가해 주시면 테마 빌더에서 강의 페이지를 구현하더라도 정상적으로 Learndash  에서 제공되는  template 를...

드롭다운 메뉴의 폭(width) 변경하기

/* 드롭다운 메뉴 폭 변경 */ .nav li ul { width: 320px !important; /* 드롭다운 메뉴의 폭 */ } .nav li li ul { left: 320px !important; /* 위에 입력한 동일 크기를 입력합니다. */ } #top-menu li li a { width: 280px; /* 위에 입력한 값보다 40px를 줄여서 입력합니다. */ }...

기본폰트를 시스템 폰트로 지정하기

아래 CSS를 사용합니다. /* 폰트 – 애플산돌고딕, 맑은고딕 적용 */ h1,h2,h3,h4,h5,h6,body, input, textarea, select, p{ font-family:’Apple SD Gothic Neo’,’Malgun Gothic’, sans-setif, Arial !important; }...

갤러리에서 슬라이드-인 효과 없애기

고급 > 갤러리 아이템에 아래 CSS를 추가합니다. -webkit-animation: none !important; -moz-animation: none !important; -o-animation: none !important; -ms-animation: none !important; animation: none !important;

빌더에서 지정한 버튼 스타일이 적용되지 않습니다.

원인 버튼 스타일을 상위 CSS에서 ‘!important’로 강제해서 발생하는 문제입니다. 해당 CSS는 대개 아래 2개에 존재합니다. 원인1: 테마 사용자 정의하기의 버튼 옵션원인2: 자식 테마의 style.css 문제해결 원인 1에 대한 해결: 테마 사용자 정의하기에서 버튼에 대한 모든 설정을 기본값으로 돌립니다. 원인 2에 대한 해결: 자식 테마의 style.css에 버튼에 대한 지정이 있다면 모두 삭제합니다. 이해하기 2019년 7월에 도입된...

페이지가 출렁 거립니다.

페이지가 출렁 거린다는 것은 CSS 로딩에 문제가 있는 경우입니다. 물론 캐싱된 페이지는 정상일 수 있습니다. 디비는 캐싱이되지 않더라도 정적(static) CSS 파일을 생성하여, 이 문제를 해결해 줍니다. 결국 출렁거린다는 건 정적 CSS 파일이 제대로 만들어 지지 않는 상태입니다. 아래 순서로 시도해 보십시오. 정적 CSS 파일은 페이지를 처음 로딩할 때, 만들어 집니다. 따라서, 정상적인 경우라도 첫 로딩에서는 효과가 없습니다. 1) 정적 HTML 생성 옵션 확인 디비...

Divi 라이브러리 이미지 사이즈 선택

개념 디비 이미지 모듈의 대표이미지의 사이즈를 선택할수 있습니다. 기본 제공되는 이미지 모듈의 경우 사이즈는 원본 사이즈 적용됩니다. 적용  

Extra child theme 만들기

 제작  목표 고객이 손쉽게 변경할 수 있도록 한다. 국내 사용자에게 익숙한 UX를 제공한다. 제작 준비 ① 데모 사이트 호스팅 준비 프리 호스팅을 이용해 호스팅 발급. 2차 도메인은 demo-‘child theme 이름’으로 지정 예) demo-newsbisp.wpcorona.com ManageWP 등록 단비크루의 직접 등록은 안되므로 단비랩스의 기술지원 담당자에게 요청. ② 미디어 엑스퍼트팩 설치 ManageWP를 이용해 미디어 엑스퍼트팩을 데모...

Divi 로컬 캐시 제거

Divi / Extra 테마를 사용하다보면 가끔씩 브라우저에 저장된 캐시 때문에 모듈 업데이트 내용(개발자의 경우)이 반영이 되지 않고 이전 버전이 계속 보이는 경우가 있습니다. 새로운 번역을 적용했을 경우에도 이와 유사한 현상이 발생하기도 합니다. 이 것은 디비가 모듈의 빠른 로딩을 위해 브라우저의 로컬캐시를 이용하여 모듈의 템플릿을 저장해 두기 때문인데요, 이를 리셋하는 방법을 소개합니다. 브라우저의 북마크바에 임의의 새로운 북마크(페이지)를 생성합니다. 이름 부분에는...

Divi Theme 설치 후, 해야할 설정

날짜 형식 변경 디비 테마를 기본값은 날짜가 부자연스럽게 출력된다. Divi > 테마 옵션 > 일반에서 날짜 형식을 다음으로 변경한다. Divi & Extra 한글폰트 설치 Divi Builder는 한글 폰트를 지원하지 않습니다. 단비스토어에서 배포하는 Divi & Extra 한글폰트를 설치하면, 한글폰트를 사용할 수 있습니다. 또한, CSS 없이 기본폰트를 변경할 수 있습니다.참고로 워드프레스의 시간 표시 형식도 아래로 변경하는 게 자연스럽습니다,....

엑스트라 테마 개요

단비에서 설계한 미디어 사이트는 대부분 Extra 테마를 기본 테마로 사용하고, 이를 지원하는 자식 테마를 통해 구현되었습니다.   Extra 테마의 특징 엑스트라 테마는 Elegant Themes에서 개발한 웹진 및 블로그 전용 테마입니다. Elegant  Themes는 디비 테마와 엑스트라 테마를 개발하고 있습니다. 디비가 다목적(multi-purpose) 테마라면, 엑스트라는 미디어에 최적화된 기능을 제공합니다. 디비 빌더 내장: 테마에 디비 빌더가 내장되어...

Divi Theme 번역파일 위치

Divi Theme의 번역파일은 한 곳이 아니라, 3곳에 위치하며 각각의 폴더는 아래와 같습니다. divi/include/builder/languages divi/core/languages/ divi/lang/