Elementor를 다크 모드로 어떻게 변경합니까?

게시 됨: 2022-10-18

고기능 웹사이트를 구축하는 것은 사전 경험이 없어도 쉽게 할 수 있는 일입니다. Elementor와 같은 WordPress 플러그인을 사용하면 됩니다. 그러나 웹사이트의 가독성을 높이려면 요소를 어두운 모드로 변경하는 것을 고려해야 합니다. 이제 처음에 elementor를 다크 모드로 변경하는 방법이 궁금할 것입니다.

음, QS 다크 모드와 같은 플러그인과 달리 elementor에는 기본 다크 모드 플러그인이 없습니다. 즉, 타사 플러그인을 설치해야 합니다. QS 다크 모드 플러그인을 사용하는 또 다른 이점은 구현하기 쉽고 elementor보다 사용자 친화적이기 때문입니다.

따라서 이 튜토리얼에서는 다른 플러그인을 통해 요소 또는 다크 모드를 변경하는 방법에 대한 단계를 살펴보겠습니다.

Elementor를 다크 모드로 어떻게 변경합니까?

목차

Elementor 다크 모드를 활성화해야 하는 이유는 무엇입니까?

elementor 다크 모드의 사용은 필요성과 인기 모두에서 증가하고 있습니다. 따라서 실제로 다크 모드를 활성화 해야 하는지 여부가 궁금한 경우 여기에 답이 있습니다.

눈의 피로를 최소화

청색광에 매우 오랫동안 노출되면 디지털 눈의 피로와 안구 건조 및 두통과 같은 증상을 유발할 수 있습니다. 따라서 요소 또는 다크 모드를 활성화하면 눈부신 빛으로 인한 눈의 피로와 피로로부터 눈을 보호할 수 있습니다.

가독성 향상

elementor에 다크 모드를 사용하는 또 다른 이점은 가독성을 높이기 위해 화면을 보다 효율적으로 만든다는 것입니다. 특히 방에 햇빛이 너무 많이 들어와서 읽기가 어려울 때 특히 그렇습니다. 따라서 블로그가 있는 경우 사용자는 웹사이트에서 더 오랜 시간을 보낼 것입니다.

더 나은 가시성

어두운 모드를 사용하면 저조도 설정에서도 편리합니다. 간단히 말해서 어둡거나 어두운 환경에서 더 나은 가시성을 제공합니다. 예를 들어, 파트너를 깨울까 봐 걱정하지 않고 침대에서 사용할 수 있습니다.

배터리 수명 절약

elementor 또는 wordpress 다크 모드 android 는 모두 일반 모드에 비해 에너지를 덜 사용하는 경향이 있습니다. 결과적으로 휴대전화나 노트북의 배터리가 더 오래 갈 수 있습니다. 일부 전문가들은 배터리 수명을 약 30% 증가시킬 수 있다고 제안합니다.

미적 목적을 위해

요소 또는 일반 모드의 다른 색 구성표와 비교하여 이 모드는 정말 보기 좋고 세련된 사용자 인터페이스를 제공합니다. 신비롭고 새로운 느낌을 선사합니다.

Elementor를 다크 모드로 변경하려면 어떻게 합니까?

Elementor를 다크 모드로 어떻게 변경합니까?

그렇다면 웹 사이트의 요소를 다크 모드로 정확히 어떻게 변경합니까? 결국 요소 또는 블로그에서 기본적으로 다크 모드 기능을 활성화하는 방법은 없습니다. 이 경우 WP Dark Mode 또는 Elementor용 Plus Addons와 같은 타사 플러그인을 사용하면 됩니다. 두 옵션 모두 무료 및 Pro 버전에서 사용할 수 있습니다.

방법 1: WP 다크 모드 사용

이것은 요소를 다크 모드로 변경하기 위한 가장 일반적이고 인기 있는 플러그인입니다. elementor 위젯의 다크 모드와 여러 스위치 스타일을 포함하여 많은 기능을 제공합니다. 다음은 이 플러그인을 사용하는 방법에 대한 단계입니다.

1단계: 다크 모드 색상 계획

먼저 다크 모드로 변경할 요소를 결정해야 합니다. 어떤 경우에는 변경할 필요가 없는 어두운 배경이 이미 있을 수 있기 때문입니다. 대부분의 경우 글꼴 및 이미지를 포함한 전체 배경색을 변경해야 할 수 있습니다.

2단계: WP 다크 모드 설치

다음으로 WP 다크 모드 플러그인을 다운로드해야 합니다. WordPress 대시보드에서 플러그인을 검색하고 클릭하기만 하면 됩니다. 그런 다음 새로 추가를 선택하고 WP 다크 모드를 찾습니다. 마지막으로 지금 설치를 클릭하여 플러그인을 활성화합니다.

3단계: 다크 모드 활성화

WP 다크 모드 설치를 완료한 후 다음은 다크 모드를 활성화하는 것입니다. 단일 페이지 또는 전체 웹 사이트에 대해 활성화하도록 선택할 수 있습니다.

4단계: 단일 페이지에 대해 다크 모드 활성화

먼저 새 페이지를 추가하거나 이미 존재하는 페이지를 사용해야 합니다. WordPress 관리 대시보드에서 페이지를 클릭한 다음 새로 추가를 클릭하기만 하면 됩니다. 그런 다음 페이지 이름을 지정하고 오른쪽 사이드바에서 페이지 템플릿을 Elementor Full Width로 선택합니다. 다음으로 Elementor로 편집 옵션을 선택합니다.

그런 다음 검색 위젯 옵션에서 다크 모드를 검색하십시오. 여기에서 위젯을 편집 중인 페이지로 끌어다 놓습니다. 완료되면 페이지를 게시할 수 있습니다.

5단계: 전체 사이트에 대해 WP 다크 모드 활성화

전체 웹사이트에 대해 요소를 변경하거나 어두운 모드로 변경할 수도 있습니다. 이 경우 WordPress 관리 대시보드에서 WP 다크 모드 위젯을 선택한 다음 설정을 선택하여 시작합니다. 그런 다음 일반 설정에서 프런트엔드 다크 모드 활성화를 클릭합니다.

다음으로 설정에서 플로팅 스위치 표시 탭을 클릭하여 켭니다. WordPress 관리 표시줄 상단에 새 토글 스위치가 나타납니다. 이것은 elementor를 다크 모드로 변경하는 데 사용할 것입니다.

6단계: 플로팅 스위치 스타일 선택

wp admin 다크 모드 를 활성화한 후 개인화된 모양으로 사용자 정의할 수 있습니다. 선택할 수 있는 몇 가지 부동 스위치 스타일이 있습니다. 따라서 블로그의 테마와 일치하는 테마를 선택하기만 하면 됩니다.

야간 모드 탭 을 클릭한 다음 스위치 설정을 선택합니다. 밝은 테마와 어두운 테마를 포함하여 프런트 엔드에 대한 다양한 스타일의 플로팅 스위치를 볼 수 있습니다. 마지막으로 설정 저장을 선택합니다. 이제 elementor의 다크 모드가 웹사이트의 모든 페이지에서 활성화되어야 합니다.

방법 2: 플러스 애드온 사용

Elementor를 다크 모드로 어떻게 변경합니까?

elementor용 Plus Addons는 elementor를 사용하여 사이트를 사용자 정의하는 데 도움이 되는 위젯 및 템플릿 모음으로 구성됩니다. 이 플러그인을 사용하면 머리글 또는 바닥글 영역에 위젯을 추가할 수 있습니다. 이 도구를 사용하여 블로그의 요소를 다크 모드로 변경하는 방법에 대한 다음 단계를 따르십시오.

1단계: 플러스 애드온 다운로드

WordPress 관리 대시보드에서 플러그인을 클릭하고 새로 추가를 선택합니다. 플러그인 저장소로 이동합니다. 검색 창에 The Plus Addons for Elementor를 입력하고 지금 설치 버튼을 클릭합니다.

설치 후 플러스 설정이 대시보드 왼쪽 하단에 나타나야 합니다.

2단계: 다크 모드 위젯 활성화

Plus Addons를 설치한 후 Plus Addon 대시보드에서 Plus Widgets를 선택합니다. 그런 다음 검색 상자에 다크 모드를 입력하고 토글을 오른쪽으로 이동하여 켭니다.

3단계: 요소 편집기에 위젯 추가

다크 모드 위젯을 추가하려면 웹사이트 헤더를 연 다음 '엘리멘터로 편집' 탭을 누르세요. 다음으로 Elementor 위젯 패널에 다크 모드 위젯을 입력합니다. 마지막으로 위젯을 드래그하여 오른쪽에 놓습니다.

4단계: 요소 또는 어두운 모드로 변경

요소 또는 어두운 모드 위젯에서 콘텐츠 탭을 선택합니다. 다크 모드, 위치 및 추가 옵션을 포함한 세 가지 옵션이 표시됩니다. 다크 모드 옵션을 선택하면 다양한 다크 모드에서 웹사이트나 브랜드에 맞는 테마를 선택할 수 있습니다.

그리고 다크 모드를 더 커스터마이징하고 싶다면 추가 옵션 설정을 사용할 수 있습니다. 설정 저장을 클릭하여 변경 사항을 적용합니다. 이 단계에서 elementor는 어두운 모드 설정에 있어야 합니다.

Elementor 일반 모드 대 다크 모드: 차이점은 무엇입니까?

Elementor를 다크 모드로 어떻게 변경합니까?

Elementor 일반 모드에는 미리 정의된 4가지 또는 기본 전역 색상이 있습니다. 이러한 색상에는 기본, 텍스트, 상승 및 보조 색상이 포함됩니다. 기본 색상은 제목 및 아이콘용이고 보조 색상은 목록 항목, 가격표 배경 및 부제목용입니다. 한편, 텍스트 색상은 메뉴 항목 및 단락용이고 강조 색상은 배지 및 링크용입니다.

요소 또는 어두운 모드를 사용하면 더 어두운 배경색과 더 밝은 전경색으로 구성됩니다. 일반 모드와 달리 이 모드는 Elementor의 기본 설정으로 제공되지 않습니다. 따라서 활성화하려면 무료 또는 프로 다크 모드 플러그인을 사용해야 합니다. 어두운 모드에서 elementor는 야간 모드 모양을 만들기 위해 두 세트의 배경색만 사용합니다.

다크 모드 색상 선택기의 용도는 무엇입니까?

Elementor를 다크 모드로 어떻게 변경합니까?

어두운 모드를 사용할 때 웹사이트의 스타일에 맞게 선택할 수 있는 다양한 어두운 색상 팔레트가 있습니다. 색상 선택기는 시각적 요소의 최상의 색상을 선택하는 데 도움이 됩니다. 즉, 어두운 모드 색상 선택기 를 사용하여 디자인에 사용할 색상을 빠르게 선택할 수 있습니다.

색상을 선택할 수 있을 뿐만 아니라 어두운 모드용 색상 선택기를 사용하여 이러한 색상을 저장할 수 있습니다. 자주 사용하는 색상을 쉽게 저장하여 필요할 때마다 쉽게 액세스할 수 있습니다.

또한 색상 선택기를 사용하면 드래그 앤 드롭 기능을 통해 더 이상 필요하지 않은 색상을 삭제할 수 있습니다. 더 중요한 것은 피커에서 직접 최상의 다크 모드 색상을 적절한 순서로 재배열할 수 있다는 것입니다.

결론

가독성이나 가시성 향상을 위해 요소를 변경하거나 어두운 모드로 변경하려는 경우 쉽게 수행할 수 있습니다. 사용할 플러그인과 요소 또는 다크 모드를 활성화하기 위해 따라야 할 단계만 알면 됩니다. 이는 QS 다크 모드 와 같은 플러그인과 달리 elementor에는 기본 제공되는 기본 다크 모드 플러그인이 없기 때문입니다.

운이 좋게도 위에서 이 모든 정보를 찾을 수 있습니다. 그러나 언급할 가치가 있는 것은 요소 또는 다크 모드를 변경하는 데 사용할 수 있는 다른 플러그인이 있다는 것입니다.

추가 편의를 위해 어두운 모드에 색상 선택기를 사용하는 것이 좋습니다. 다른 페이지에 적합한 어두운 모드 색상과 테마를 선택하는 데 시간을 절약할 수 있습니다.

단일 블로그 게시물 템플릿