요소 튜토리얼

Elementor 전역 설정 가이드:전체 웹사이트에 Elementor 사이트 설정을 사용하는 방법

Elementor Pro 전역 스타일 설정은 전체 설정입니다.,설치만 됨엘리멘터 프로그래야만 전역 설정을 할 수 있습니다,유사한 테마에 대한 테마 설정,전체 웹사이트 색상 스타일을 미리 설정하는 데 도움이 될 수 있습니다.,글꼴 스타일, 레이아웃, 요소 사전 설정 등,이를 통해 후반 작업 웹 사이트의 작업량이 크게 줄어듭니다.。

예를 들어,여러 가지 전체 색상을 설정할 수 있습니다,그런 다음 콘텐츠 색상을 설정할 때 이러한 전체 색상에 대한 직접적인 책임은 귀하에게 있습니다.

이 튜토리얼에서는 Elementor 웹 편집기의 전역 스타일 및 설정의 일반적인 기능을 소개합니다.,예를 들어 전역 글꼴 설정、색상、페이지 콘텐츠 너비、요소의 기본 간격 등。

[사이트 설정]에 들어갑니다.

Elementor Pro를 설치하고 활성화한 후,모든 페이지의 Elementor 편집기 창에 들어가십시오.,왼쪽 상단에 있는 버튼을 클릭하세요.,그런 다음 아래 이미지와 같이 사이트 설정을 클릭하십시오.

Elementor的全局样式与设置

그러면 다음 구성 옵션을 볼 수 있습니다.。

Elementor的全局样式与设置

디자인 시스템/디자인 시스템

전역 색상 및 전역 글꼴 설정。

전역 색상전역 색상 설정

글로벌 컬러 설정의 가장 큰 장점은 웹사이트의 컬러 스타일을 빠르게 전환할 수 있다는 점입니다.,예를 들어 현재 웹사이트는 주로 녹색입니다.,파란색 스타일로 변경하려면 전체 색상의 색상 설정만 수정하면 웹사이트 색상 스타일이 빠르게 전환됩니다.。이를 위해서는 페이지를 디자인하고 생성할 때 모든 색상이 전체 색상을 통해 구성되어야 합니다.,색상을 수동으로 추가하는 경우,그런 다음 수동으로 수정해야 합니다.。

글로벌 컬러 설정 및 사용 방법은 다음과 같습니다.:

사이트 설정을 통해 전체 색상을 설정할 수 있습니다,몇 가지 공통 전역 색상 설정。

Elementor的全局样式与设置

전역 색상에는 시스템 색상과 사용자 정의 색상이 포함됩니다.,시스템 색상은 4개뿐입니다.,삭제할 수 없습니다.,하지만 수정이 가능해요。

필요에 따라 사용자 정의 색상을 추가하고 이름을 바꿀 수 있습니다.。

Elementor全局设置指南:如何为整个网站使用 Elementor 站点设置

글로벌 컬러를 설정한 후,Elementor에서 모든 요소의 색상 설정을 호출하여 전체 색상을 설정할 수 있습니다.。

Elementor全局设置指南:如何为整个网站使用 Elementor 站点设置

전역 글꼴전역 글꼴 설정

글로벌 컬러와 동일,전역 글꼴을 사용자 정의하여 여러 글꼴을 추가할 수 있습니다.,페이지를 디자인할 때,필요에 따라 전역 글꼴을 선택하면 효율성이 향상될 수 있습니다.、또한 나중에 통합 교체가 용이해집니다.。

Elementor全局设置指南:如何为整个网站使用 Elementor 站点设置

전역 글꼴에는 네 가지 시스템 글꼴 설정이 있습니다.,삭제할 수 없습니다.,하지만 수정이 가능해요。

동시에 사용자 정의 전역 글꼴을 추가할 수 있습니다.。

Elementor全局设置指南:如何为整个网站使用 Elementor 站点设置

특정 전역 글꼴의 경우,글꼴을 설정할 수 있습니다.,크기,무게,대소문자 변환,스타일(이탤릭체 등),장식(밑줄、밑줄 등),행 높이,문자 간격,단어 간격 내용。

Elementor全局设置指南:如何为整个网站使用 Elementor 站点设置

테마 스타일 전역 테마 스타일 설정

구성 가능한 글꼴、단추、그림、테이블 필드 스타일。

주목해야 할 점은:일반적으로 테마 자체는 유사한 글꼴을 제공합니다.、컬러 매칭 기능,두 가지를 동시에 사용하면 혼란스러울 수 있습니다.,직접 비교 테스트를 진행해야 합니다.。

각 테마마다 요소와의 호환성이 다르기 때문에,모든 경우에 적용되는 일률적인 솔루션은 없습니다.,동시에,아래를 참조하세요,Elementor는 자체 색상과 글꼴을 비활성화하는 기능도 제공합니다.,그리고 테마 구성을 상속하도록 선택하세요.,이 두 가지 옵션을 통해,스타일 디버깅에도 도움이 됩니다.。

Elementor全局设置指南:如何为整个网站使用 Elementor 站点设置

때때로,테마와 Elementor의 전역 스타일 설정을 함께 사용해야 합니다.。Hello Elementor 테마를 사용하는 경우,그렇다면 이 문제에 대해 걱정할 필요가 없습니다,Elementor의 공식 컴패니언 테마이기 때문에。

타이포그래피/텍스트 레이아웃

[Typesetting]에서는 웹사이트 콘텐츠의 텍스트 색상을 설정할 수 있습니다.、글꼴 스타일、단락 간격,링크 색상、글꼴 스타일 및 호버 효과,H1-H6 태그의 색상 글꼴 스타일。그리고 전역 설정에서 설정된 색상과 글꼴을 직접 사용하여 이러한 타이포그래피 스타일을 설정할 수 있습니다.。

Elementor的全局样式与设置

버튼 전역 버튼 설정

버튼 텍스트의 서식을 지정할 수 있습니다.、텍스트 투영、일반 색상 배경색、마우스를 올리면 텍스트 색상、배경색、테두리 유형 및 색상、코너 반경、내부 거리 설정。

Elementor的全局样式与设置

이미지 전역 이미지 설정

사진에,일반 및 호버에 대한 구성 가능한 테두리、코너 반경、투명도、투사、CSS 필터、정상에서 호버 효과로의 전환 시간。

Elementor的全局样式与设置

양식 필드 전역 양식 필드 설정

웹사이트에서 양식을 사용하는 경우,예를 들어, 해외 무역 웹사이트에서 일반적으로 사용되는 문의 양식、문의 양식,여기를 사용하여 양식 필드의 스타일을 구성할 수 있습니다.。

필드 제목 색상 등、조판,필드 자체의 조판,일반 상황과 입력 상황의 글꼴 색상、배경색、투사、액자、코너 반경,그리고 내부 간격。

Elementor的全局样式与设置

관련 튜토리얼:

환경

사이트 ID 사이트 식별 설정(로고 및 아이콘 설정)

여기에 웹사이트 이름을 업로드할 수 있습니다.、설명하다、로고 및 사이트 아이콘。

Elementor的全局样式与设置

관련 튜토리얼:

배경 전역 배경 설정

여기에서 웹페이지의 배경색을 설정할 수 있습니다.,단색 또는 그라데이션 색상으로 제공됩니다.,배경 이미지를 설정할 수도 있습니다,그리고 모바일 단말기의 배경색을 별도로 설정할 수도 있습니다.。

Elementor的全局样式与设置

레이아웃 기본 레이아웃 설정(모바일 단말 중단점)

  • 콘텐츠 너비/콘텐츠 너비:웹 페이지 콘텐츠 영역의 기본 너비를 설정하는 데 사용됩니다.,기본값은 1140px입니다.,웹사이트 페이지를 더 넓거나 좁게 만들고 싶을 때,여기에서 조정하면 됩니다。
  • 위젯 공간/가젯 간격:요소들 사이의 간격으로 이해될 수 있습니다.,기본값은 20px입니다.
  • 페이지 제목 선택기/페이지 제목 선택기:여기에 대한 서비스는 다음과 같습니다페이지 제목 숨기기기능성,테마 페이지 제목의 스타일 선택기가 항목 제목이 아닌 경우,그럼 이걸 바꿔야 해,hello elementor 테마를 사용하는 경우,여기서는 변경할 필요가 없습니다.;숨겨진 제목 기능을 사용할 수 없다고 판단되는 경우에만,그런 다음에야 수정을 고려해야 합니다.。
  • 늘어난 단면 맞춤/섹션에 맞게 늘이기:요소의 섹션을 사용할 때,스트레치 설정 스위치가 있습니다,샘플 세트를 지정된 너비로 늘리는 데 사용됩니다.,너비를 지정하는 데 사용됩니다.,여기에는 상위 요소 선택자가 입력되어 있을 뿐입니다.,늘어난 부분이 맞을 것입니다(예: #primary / .싸개 / 메인 등등)。페이지 너비에 맞게 비워 두세요.。기본값은 본체입니다.,기본적으로 이것을 변경할 필요는 없습니다.。
  • 기본 페이지 레이아웃/페이지 기본 레이아웃:페이지의 기본 레이아웃을 설정하는 데 사용됩니다.,기본값은 전체 너비(요소 전체 너비)입니다.,머리글과 바닥글이 포함되어 있습니다.,요소 캔버스로 설정된 경우,페이지에는 머리글이나 바닥글이 없습니다.,하지만 빈 캔버스。테마를 선택하시면,테마 설정을 상속한다는 의미입니다.。또한,다양한 테마는 다양한 레이아웃 옵션도 제공합니다.,디버그하고 필요에 따라 사용하십시오.。
Elementor的全局样式与设置

중단점/중단점,중단점을 수동으로 추가할 수 있습니다.,다양한 해상도의 장치에 웹사이트를 적용하는 데 사용됩니다.,즉, 반응형。

Elementor的全局样式与设置

라이트박스 설정

사진을 위한 팝업창으로 이해될 수 있음,전역 라이트박스 탭에서는 다음 설정을 조정할 수 있습니다.:

  1. 이미지 라이트박스:스위치를 밀어서 라이트박스를 전역적으로 활성화 또는 비활성화하세요.。
  2. 계수기:다중 이미지 갤러리에만 사용 가능。예로 설정된 경우,그런 다음 라이트박스의 왼쪽 상단에 이미지 개수를 추가하세요.。예를 들어,갤러리에 다음이 포함된 경우 6 영화,그러면 카운터가 표시됩니다 1/6、2/6 등으로 "아니요. 6 영화"、“제 6 두 번째 사진" 등등.。
  3. 전체 화면:로 설정한 경우,사용자가 전체 화면 라이트박스에서 이미지를 열 수 있도록 클릭 가능한 아이콘을 추가하세요.。
  4. :로 설정한 경우,그런 다음 사용자가 라이트박스의 이미지를 확대할 수 있도록 클릭 가능한 아이콘을 추가하세요.。이미지를 확대한 후,보기를 이동하고 이미지의 다른 영역으로 스크롤할 수 있습니다.。
  5. 공유하다:로 설정한 경우,라이트박스에 공유 기능이 추가됩니다.,사용자가 트위터에 게시할 수 있도록 허용、Facebook 및 Pinterest에서 이미지 공유,또는 컴퓨터에 다운로드。
  6. 제목:라이트박스의 이미지 아래 캡션을 표시하는 옵션。~에서없음제목표제Alt또는설명에서 선택
  7. 설명하다:라이트박스의 이미지 아래에 설명을 표시하는 옵션。~에서없음제목표제Alt또는설명에서 선택
  8. 배경색:라이트박스의 배경색과 불투명도를 선택하세요.。
  9. UI 색상:선택하다UI 색상。이는 라이트박스 화살표와 포인트 탐색에 영향을 미칩니다.、닫기 버튼 등。
  10. UI 호버 색상:선택하다UI 호버 색상。사용자가 각 버튼 위에 마우스를 올리면,이는 라이트박스 화살표와 포인트 탐색에 영향을 미칩니다.、닫기 버튼 등。

사용자 정의 CSS사용자 정의 CSS

기존 설계 구성이 요구 사항을 충족할 수 없는 경우,추가 CSS를 추가하여 스타일을 정의할 수 있습니다.,전제는:CSS 작성법을 배워야 합니다.

Elementor的全局样式与设置

에 대한 편집부

kuajinggu의 편집진은 WordPress 전문가들로 구성된 팀입니다.,딜런이 이끄는,워드프레스에서、가상 호스트、전자상거래、SEO 및 마케팅 분야에서 10년 이상의 경험。kuajinggu는 다음에서 만들어졌습니다. 2014 년도,현재 업계 최대 규모의 무료 WordPress 리소스 웹사이트,흔히 WordPress의 Wikipedia라고 불립니다.。