Divi 블로그 모듈 내부의 "현재 페이지에 대한 게시물" 옵션 이해

Divi 블로그 모듈을 생각할 때 우리는 일반적으로 블로그 페이지를 생각합니다. 그러나 Divi의 블로그 모듈에는 다양한 페이지를 구축하는 데 도움이 되는 기능이 포함되어 있습니다. 현재 페이지에 대한 게시물은 블로그 모듈 내의 옵션으로 게시물을 동적으로 표시합니다. 이 기사에서 우리는 현재 페이지에 대한 게시물을 자세히 살펴보고 그것이 무엇을 하고 어떻게 사용하는지 알아볼 것입니다.

현재 페이지에 대한 게시물 옵션은 무엇입니까?

현재 페이지에 대한 게시물은 블로그 모듈의 콘텐츠 섹션에 있는 옵션입니다. 기본적으로 비활성화되어 있습니다. 활성화되면 모듈 내의 몇 가지 옵션이 변경됩니다.

모듈에는 일반적으로 게시물 유형을 선택하는 옵션이 포함됩니다. 여기에는 페이지, 게시물, 미디어 및 프로젝트가 포함됩니다. 사용자 정의 게시물 유형이 있는 경우 해당 유형도 포함됩니다.

또한 일반적으로 포함된 범주라는 옵션이 있습니다. 이렇게 하면 모듈에 표시할 카테고리를 선택할 수 있도록 카테고리 목록이 제공됩니다. 여기에는 페이지의 카테고리에 관계없이 모든 카테고리의 게시물을 표시하는 모든 카테고리가 포함됩니다. 또 다른 옵션은 현재 범주입니다. 사용자가 선택한 카테고리의 게시물을 표시합니다.

현재 페이지에 대한 게시물을 활성화하면 게시물 유형 및 포함된 카테고리 옵션이 비활성화됩니다. 이를 통해 Divi는 동적으로 선택할 수 있습니다. 이것을 동적 콘텐츠와 함께 사용하면 선택한 카테고리의 게시물이 표시됩니다. 이것은 현재 범주와 유사하지만 더 광범위합니다.

현재 페이지의 게시물은 Divi 테마 빌더의 아카이브 템플릿과 잘 작동합니다. 특정 태그와 같은 특정 게시물에 할당된 템플릿에서도 잘 작동합니다.

블로그 템플릿과 함께 현재 페이지에 대한 게시물 옵션 사용

작동 방식을 보여주는 간단한 아카이브 페이지 템플릿을 만들 것입니다. 이 템플릿에는 제목과 두 개의 블로그 모듈이 포함됩니다. 아카이브 페이지 템플릿을 생성하려면 WordPress 대시보드에서 Divi > Theme Builder 로 이동합니다. 새 템플릿 추가 를 선택합니다.

모든 카테고리 페이지에 할당

템플릿이 할당될 많은 옵션이 있는 모달이 열립니다. Use On 에서 Archive Pages 까지 아래로 스크롤하고 All Category Pages 를 선택합니다. 모달 하단에서 템플릿 만들기 를 클릭합니다. 그러면 템플릿을 만들 편집기가 열립니다.

카테고리 템플릿 만들기

사용자 정의 본문 작성 을 선택하십시오. 참고로 저는 Divi의 Blogger 레이아웃 팩용 무료 카테고리 페이지 템플릿의 글꼴과 색상을 사용하고 처음부터 레이아웃을 만들고 있습니다. 템플릿으로 사용하고 내가 추가하는 모듈을 따라갈 수도 있습니다.

섹션 스타일 지정

먼저 파란색 톱니바퀴를 클릭하여 섹션의 설정 을 엽니다.

배경 까지 아래로 스크롤하고 #fbf9f4 색상을 추가합니다. 섹션의 설정을 닫습니다.

• 배경색: #fbf9f4

행 추가

녹색 아이콘 을 클릭하고 1열 행 을 추가합니다.

동적 제목 만들기

다음으로, 행에 텍스트 모듈 을 추가하십시오.

본문 콘텐츠의 경우 동적 콘텐츠 사용 을 선택합니다.

표시할 동적 콘텐츠를 선택할 수 있는 옵션 목록이 열립니다. 게시물 카테고리 를 선택합니다.

다음 옵션 세트를 닫습니다. 기본 설정을 사용하겠습니다.

그런 다음 디자인 탭 으로 이동합니다. 텍스트를 Vidaloka로 변경하고 색상을 #161616으로 변경합니다. 바탕 화면 글꼴 크기를 80px로 설정하고 전화 아이콘을 클릭하여 전화 글꼴 크기를 60px로 설정합니다. 라인 높이를 1.15em으로 변경합니다. 텍스트 모듈의 설정을 닫습니다.

• 글꼴: Vidaloka
• 색상: #161616
• 크기: 80px, 60px
• 줄 높이: 1.15em

첫 번째 블로그 모듈 추가

다음으로 두 개의 블로그 모듈 중 첫 번째 모듈을 추가합니다. 이 게시물은 추천 게시물을 표시하고 다른 게시물은 페이지 콘텐츠를 기반으로 블로그 피드를 제공합니다.

현재 페이지에 대한 게시물 선택

먼저 현재 콘텐츠에 대한 게시물을 활성화 합니다. 게시물 개수에 1을 입력합니다.

• 현재 콘텐츠에 대한 게시물: 예
• 게시물 수: 1

첫 번째 블로그 모듈 스타일 지정

집단

요소 까지 아래로 스크롤하고 페이지 매김 표시를 비활성화합니다. 우리는 이것을 두 번째 블로그 모듈에 사용할 것입니다.

• 페이지 매김 표시: 아니요

배경

배경 까지 아래로 스크롤하고 색상을 rgba(255,255,255,0)로 변경합니다.

• 그리드 배경: rgba(255,255,255,0)

제목 텍스트

그런 다음 디자인 탭 으로 이동합니다. 레이아웃을 전체 너비로 변경합니다. 이것은 영웅 영역에서 우리의 추천 게시물로 작동합니다. 오버레이를 비활성화합니다.

• 레이아웃: 전폭
• 오버레이: 끄기

그런 다음 제목 텍스트 로 스크롤합니다. 글꼴에 Vidaloka를 사용하고 색상을 #161616으로 변경합니다. 라인 높이를 1.4em으로 변경합니다.

• 글꼴: Vidaloka
• 색상: #161616
• 줄 높이: 1.4em

메타 텍스트

메타 텍스트 까지 아래로 스크롤하고 색상을 #e2c29d로 변경합니다.

• 색상: #e2c29d

간격

다음으로, Spacing 으로 이동하여 Top Margin을 0vw로 변경합니다. 이렇게 하면 모듈이 제목과 겹치지 않습니다.

• 최고 여백: 0vw

박스 섀도우

마지막으로 Box Shadow 로 이동하여 비활성화합니다. 이제 이 모듈을 닫고 두 번째 모듈을 위해 복제하겠습니다.

• 상자 그림자: 없음

두 번째 블로그 모듈 추가

이제 첫 번째 모듈을 복제 하고 설정을 엽니다. 이 블로그 모듈은 블로그 피드를 표시합니다. 설정부터 시작하여 몇 가지를 더 추가하고 일부를 변경하겠습니다.

콘텐츠

포스트 개수 를 6으로 변경하고 포스트 오프셋 번호 를 1로 변경합니다.

• 게시물 수: 6
• 포스트 오프셋: 1

포스트 오프셋 설정은 Divi에게 건너뛸 포스트 수를 알려줍니다. Divi는 최신 게시물부터 시작하여 게시물 수를 세고 오프셋 수에서 시작합니다. 추천 블로그 모듈에 이미 게시물을 표시하고 있기 때문에 이것이 필요합니다.

집단

요소 까지 아래로 스크롤하고 더 읽기 버튼 및 페이지 매김을 활성화합니다.

• 더 읽기 버튼: 예
• 페이지 매김: 예

두 번째 블로그 모듈 스타일 지정

그런 다음 디자인 탭 으로 이동합니다. 이미 스타일을 지정한 모듈을 복사했으므로 모듈에서 사용하지 않은 요소의 스타일만 지정하면 됩니다.

레이아웃 에서 그리드로 변경합니다.

• 레이아웃: 그리드

더 읽어보기

더 읽기 텍스트 설정으로 스크롤합니다. 글꼴을 Vidaloka로 변경하고 스타일을 밑줄로 변경합니다.

• 글꼴: Vidaloka
• 스타일: 밑줄

Text Color를 #161616으로, Size를 16px로, Line Height를 1.8em으로 변경합니다.

• 텍스트 색상: #161616
• 크기: 16픽셀
• 라인 높이: 1.8em

페이지 매김 텍스트

페이지 매김 텍스트 로 이동하여 글꼴을 Vidaloka로 변경하고 색상을 #161616으로 변경합니다.

• 글꼴: Vidaloka
• 색상: #161616

마지막으로 테두리 로 스크롤하고 둥근 모서리를 0px로 변경합니다. 모듈을 닫고 페이지 템플릿을 저장합니다.

• 둥근 모서리: 0px

현재 페이지 결과에 대한 게시물

이제 카테고리를 클릭하면 해당 페이지에 대한 게시물이 있는 아카이브 페이지가 표시됩니다. 제목, 추천 블로그 게시물 및 블로그 피드는 모두 선택한 범주에 따라 콘텐츠를 동적으로 표시합니다. 두 번째 블로그 모듈의 오프셋은 1입니다.

제 엔지니어링 카테고리입니다. 해당 카테고리에 두 개의 게시물이 있습니다.

데모를 위해 첫 번째 모듈로 돌아가 현재 페이지에 대한 게시물을 비활성화하고 모든 카테고리로 설정했습니다. 보기 쉽도록 Meta Font의 크기도 늘립니다.

이제 첫 번째 블로그 모듈은 모든 카테고리의 최신 게시물을 표시하고 두 번째 블로그 모듈은 선택한 카테고리를 기반으로 동적으로 블로그 피드를 표시합니다. 오프셋 때문에 두 번째 모듈은 여전히 ​​Education 범주의 두 번째 게시물에서 시작됩니다.

이제 첫 번째 블로그 모듈의 현재 페이지에 대한 게시물을 복원했으며 이제 페이지는 사용자가 선택한 카테고리를 기반으로 동적으로 콘텐츠를 표시합니다.

또 다른 예 – 태그를 기반으로 하는 현재 페이지에 대한 게시물

예를 하나 더 살펴보겠습니다. 템플릿으로 돌아가서 게시물 태그에 동적 제목을 할당했습니다. 사용자가 태그 링크를 클릭하면 템플릿에 해당 태그가 있는 게시물이 표시됩니다.

이 태그 아카이브 페이지의 태그를 동적으로 표시하도록 제목을 설정했습니다. 카테고리가 선택되지 않았습니다. 보기 쉽도록 추천 게시물을 삭제했습니다.

소프트웨어 엔지니어링 태그에 대한 아카이브 페이지를 선택했습니다. 이 태그는 내 엔지니어링 및 데이터 과학 카테고리의 게시물에 적용됩니다. 제목에 태그가 올바르게 표시됩니다. 그러나 게시물은 내 모든 범주의 것입니다. 이 태그가 있는 게시물만 표시하고 싶습니다.

카테고리별로 게시물을 표시하고 싶지 않습니다. 대신 태그별로 게시물을 표시하고 싶습니다. 우리는 카테고리를 선택할 수 없고 태그를 선택할 수 없습니다. 현재 페이지에 대한 게시물이 최선의 선택입니다. 카테고리가 무엇인지는 중요하지 않습니다. 게시물 간의 동적 관계에만 관심이 있습니다. 이것은 태그 아카이브 페이지이므로 동적으로 태그를 봅니다.

이제 내 태그 아카이브 페이지에 올바른 태그가 있는 게시물만 표시됩니다.

그리고 요점을 설명하기 위해 제목에서 동적 태그를 가져오지 않습니다. 아래 예에서 제목을 제거했습니다. Divi는 태그 아카이브 페이지 자체에서 동적 정보를 가져옵니다.

마무리 생각

이것이 Divi 블로그 모듈 내부의 현재 페이지에 대한 게시물 옵션을 이해하는 방법입니다. 사용이 간편하고 아카이브 페이지를 더 잘 제어할 수 있습니다. 동적이기 때문에 이 옵션은 범주를 사용하는 것보다 훨씬 광범위합니다.

우리는 당신의 의견을 듣고 싶습니다. Divi 블로그 모듈 내에서 현재 페이지에 대한 게시물을 사용합니까? 의견에 알려주십시오.