Divi 사이드바 테두리를 제거하는 방법

게시 됨: 2021-07-25

거의 모든 Divi 사용자가 Divi 테마로 수행하는 방법을 알고 싶어하는 한 가지는 사이드바 테두리를 제거하는 것입니다. 다행히도 이것은 간단한 작업입니다. 코드로 할 수 있지만 더 중요한 것은 Divi 테마 빌더로 하기 쉽습니다. 이 기사에서는 두 가지 방법을 모두 사용하여 Divi 사이드바 테두리를 제거하는 방법을 보여주고 Divi 테마 빌더를 사용하여 최상의 결과를 얻을 수 있는 이유를 알아보겠습니다.

기본 Divi 사이드바

Divi 기본 페이지 및 게시물 레이아웃은 콘텐츠와 사이드바 사이에 선을 배치합니다. 많은 사이드바 요소는 테마 커스터마이저로 스타일을 지정하거나 조정할 수 있지만 이 라인은 그 중 하나가 아닙니다. 이것은 WordPress 옵션이 부족한 영역입니다.

기본 Divi 사이드바

Divi 테마 옵션을 사용하면 사이드바를 오른쪽이나 왼쪽으로 이동할 수 있지만 스타일 옵션은 포함되지 않습니다.

기본 Divi 사이드바

Divi는 또한 페이지 및 게시물 수준에서 사이드바 레이아웃을 선택할 수 있는 설정을 추가합니다. 여기에는 위젯이 표시되지 않도록 사이드바를 제거하는 옵션도 포함되어 콘텐츠 영역에서 웹 페이지의 전체 너비를 사용할 수 있습니다.

이러한 옵션을 사용하면 레이아웃을 제어할 수 있지만 스타일을 제어할 수 없으며 사이드바 테두리를 제거하지 않습니다. Divi 사이드바 테두리의 스타일을 지정하거나 제거하는 두 가지 방법을 살펴보겠습니다.

코드로 Divi의 사이드바 테두리 제거 또는 스타일 지정

먼저 Divi에 코드를 추가하여 Divi 테마 사이드바 테두리를 제거하거나 스타일을 지정하는 방법을 살펴보겠습니다.

Divi 테마 옵션 사용자 정의 CSS 필드에 일부 CSS를 추가해야 합니다. 사용자 정의 CSS 필드에 액세스하려면 WordPress 대시보드 메뉴에서 Divi > 테마 옵션 으로 이동합니다. 일반 탭에서 설정 하단으로 스크롤하여 코드를 붙여넣습니다.

필요한 CSS는 다음과 같습니다.

#main-content .container:before {
width:0;
}
.et_pb_widget_area_right { border-left:0 !important; }
.et_pb_widget_area_left { border-right:0 !important; }

이 코드는 위젯 영역 테두리에 너비가 없어 표시되지 않음을 WordPress에 알립니다.

코드로 Divi의 사이드바 테두리 제거 또는 스타일 지정

사용자 정의 CSS 필드에 코드를 붙여넣고 변경 사항을 저장합니다.

코드로 Divi의 사이드바 테두리 제거 또는 스타일 지정

이제 테두리가 제거되었습니다. CSS는 사이드바 테두리를 제거하기 위해 Divi 테마와 함께 작동하지만 이상적이지는 않으며 모든 사람이 어떤 종류의 코드도 처리하기를 원하지 않습니다. Divi Builder로 블로그 페이지를 만들고 싶다면? 가장 좋은 옵션은 Divi 테마 빌더를 사용하는 것입니다.

Divi의 테마 빌더를 사용하여 코드 없이 Divi 사이드바 테두리를 제거하는 방법

Divi 테마를 사용하여 코드 없이 사이드바 테두리를 제거하는 것도 가능합니다. WordPress 대시보드 메뉴에서 Divi > 테마 빌더 를 선택하여 Divi 테마 빌더로 이동합니다. 블로그 레이아웃이 아직 없는 경우 새 템플릿 추가 를 선택합니다.

이 템플릿은 블로그 페이지, 아카이브 페이지 또는 원하는 다른 페이지에 할당되므로 이 페이지를 먼저 생성해야 합니다.