사용자 정의 Elementor 블로그 게시물 템플릿을 만드는 방법(쉬운 가이드)

맞춤형 Elementor 블로그 게시물 템플릿을 만드는 방법에 대한 가장 쉬운 자습서를 찾고 있습니까?

블로그는 제품에 대한 인지도를 높이는 가장 인기 있고 효과적인 방법 중 하나입니다. 그러나 콘텐츠 마케팅의 이점을 최대한 활용하려면 블로그 페이지가 올바른 정보와 함께 매력적인 모양인지 확인해야 합니다.

블로그 게시물을 매력적으로 만들려면 사용자 정의 블로그 템플릿을 만들어야 합니다. 그리고 Elementor를 사용하여 청중을 참여시키는 뛰어난 블로그 게시물 템플릿을 얻을 수 있습니다. Elementor 사용자 정의 블로그 페이지 를 처음부터 만들 수 있을 뿐만 아니라 미리 빌드된 템플릿을 사용하여 만들 수도 있습니다.

이 기사에서는 가능한 가장 간단한 방법으로 두 가지 방법을 사용하여 Elementor 블로그 게시물 템플릿을 만드는 방법을 배웁니다. 따라서 계속 읽으십시오 ...

맞춤형 Elementor 블로그 게시물 템플릿을 만들기 위해 설치해야 하는 플러그인

Elementor 페이지 빌더를 사용하여 WordPress에서 블로그 게시물을 쉽게 만들려면 두 가지가 모두 필요합니다.

• 엘리멘터(무료)

• 그리고 엘리멘터 프로.

Elementor 사용자 정의 블로그 페이지 템플릿을 처음부터 만드는 방법

Elementor Pro는 처음부터 멋진 맞춤형 블로그 게시물 템플릿을 만드는 데 필요한 모든 위젯을 제공합니다. 아래에 언급된 단계에 따라 단일 Elementor 포스트 템플릿을 생성하면 됩니다.

1단계: 새 단일 블로그 템플릿 만들기

먼저 단일 블로그 템플릿을 만들어야 합니다. 이를 위해 WordPress 대시보드로 이동한 다음 템플릿 ⇒ 새로 추가 로 이동합니다.

새로 추가 버튼을 클릭합니다 . 새 창이 열리면 드롭다운에서 단일 게시물 을 템플릿 유형으로 선택하고 원하는 이름 을 입력한 다음 템플릿 만들기 를 클릭합니다.

이제 미리 만들어진 레이아웃이 표시되어야 합니다(나중에 이를 사용하는 방법을 다룹니다). 블로그 템플릿을 처음부터 만들 것이므로 오른쪽 상단 모서리에 있는 십자 버튼을 클릭하여 이 창을 닫습니다.

2단계: 블로그 게시물 템플릿의 구조/레이아웃 선택

이제 블로그 템플릿의 구조를 선택해야 합니다. 사용자가 읽기 어려워지므로 페이지의 전체 너비를 사용하지 않는 것이 좋습니다. Elementor 사용자 정의 블로그 페이지 템플릿의 구조를 선택하려면 + 아이콘 을 클릭하고 원하는 것을 선택한 다음 구조를 클릭하여 삽입하기만 하면 됩니다.

참고: 만들고 있는 템플릿으로 블로그가 어떻게 보이는지 보려면 동적 콘텐츠 미리 보기 옵션에서 기존 블로그를 선택하십시오. 이를 설정하려면 왼쪽 하단 모서리에 있는 설정 옵션을 클릭합니다.

그런 다음 드롭다운으로 동적 콘텐츠 미리보기 에서 게시 를 선택하고 아래 두 번째 드롭다운에서 선택하려는 블로그 이름을 입력합니다. 마지막으로 적용 및 미리보기 를 클릭합니다.

3단계: 추천 이미지 위젯 추가 및 이미지 스타일 옵션 사용자 지정

레이아웃이 있으면 왼쪽 편집기 표시줄에서 추천 이미지 위젯을 검색합니다. 위젯을 찾은 후 원하는 위치에 드래그 앤 드롭하세요.

위젯이 로드된 후 이미지 크기, 정렬, 캡션, 링크 및 라이트박스 옵션을 사용자 지정합니다.

스타일 설정을 변경하려면 스타일 탭 으로 이동합니다. 여기 에서 높이, 너비, 불투명도, 테두리, 반경 등 을 변경할 수 있습니다.

4단계: Elementor Post Info 위젯 추가 및 사용자 지정

피처 이미지 뒤에는 게시물 정보 위젯으로 할 수 있는 게시물 관련 정보를 표시해야 합니다. 추천 이미지와 마찬가지로 먼저 게시물 정보 위젯을 검색 한 다음 추천 이미지 위젯 아래로 끌어다 놓기 만 하면 됩니다.

Elementor Editor Content 탭 에서 레이아웃을 기본 또는 인라인으로 설정할 수 있습니다. 작성자, 날짜, 시간 및 댓글 옵션을 편집/삭제할 수 있습니다. + 새 항목 추가 버튼을 클릭하여 게시물 정보 위젯에 사용자 정의 필드를 추가 할 수도 있습니다.

다시 스타일 탭으로 이동하여 목록 사이의 간격, 정렬, 아이콘 색상 및 크기, 텍스트 색상, 타이포그래피와 같은 스타일 설정을 사용자 정의합니다.

5단계: 게시물 제목 위젯을 끌어다 놓고 사용자 지정

이제 게시물 제목 위젯을 검색 하고 게시물 정보 위젯 아래로 끌어다 놓습니다 .

게시물 제목 태그의 크기, HTML 태그 및 정렬을 사용자 지정할 수 있습니다.

스타일 탭에는 텍스트 색상, 타이포그래피, 텍스트 획, 텍스트 그림자 및 혼합 모드를 사용자 정의하는 옵션이 있습니다.

6단계: 게시물 콘텐츠 위젯 추가 및 사용자 지정

이제 게시물 콘텐츠 위젯을 드래그 앤 드롭합니다 . ElementsKit의 게시물 콘텐츠 위젯은 블로그 게시물의 본문(주요 콘텐츠)을 나타냅니다.

7단계: 소셜 아이콘 위젯을 끌어다 놓아 소셜 공유 옵션 추가

게시물 내용 뒤에 끌어서 놓기로 소셜 아이콘 위젯을 추가합니다 . 소셜 아이콘은 다양한 소셜 플랫폼에서 블로그를 공유할 수 있는 옵션을 제공합니다.

소셜 아이콘을 원하는 만큼 추가/삭제할 수 있습니다. 또한 아이콘의 모양, 표시해야 하는 열 수 및 정렬을 사용자 지정할 수 있습니다. 또한 각 소셜 아이콘에 대한 소셜 플랫폼 아이콘, 색상 및 링크를 사용자 정의할 수 있습니다.

스타일 탭으로 이동하여 아이콘 크기, 색상, 패딩, 간격, 테두리 유형을 변경합니다.

8단계: 작성자 상자 위젯 추가 및 위젯 설정 사용자 지정

Author Box 를 검색 하고 Social Icons 뒤에 위젯을 끌어다 놓습니다. 소스 드롭다운에서 원하는 경우 사용자 정의 작성자 를 추가할 수도 있습니다. 프로필 사진, 표시 이름 및 약력을 숨기거나 숨기는 방법 을 선택할 수 있습니다. HTML 태그, 링크, 레이아웃, 정렬과 같은 다른 설정을 사용자 정의할 수도 있습니다.

스타일 탭으로 이동하여 이미지 크기, 테두리, 색상 및 저자 이름, 약력 등의 활자체 와 같은 옵션을 사용자 정의합니다.

9단계: 페이지 매김 옵션에 대한 게시물 탐색 위젯 추가

Elementor Post Navigation 위젯 은 독자에게 탐색 옵션을 제공하여 독자가 다른 블로그로 전환할 수 있도록 합니다. 게시물 탐색 위젯을 추가하려면 편집기에서 검색 전과 같이 작성자 상자 위젯 뒤에 드래그 앤 드롭합니다.

페이지 매김 레이블 또는 화살표 기호를 표시하거나 숨길 수 있습니다. 화살표에 대해 약 8개 이상의 디자인 옵션을 얻을 수 있습니다. 이전 및 다음 수준 텍스트를 사용자 지정할 수도 있습니다.

일반 보기와 호버 보기 모두에 대해 레이블, 제목, 화살표 및 테두리의 색상과 타이포그래피를 변경할 수 있습니다.

10단계: 게시물 위젯을 드래그 앤 드롭하여 관련 게시물 표시

관련 게시물을 보여주기 위해 Elementor Posts 위젯 을 사용할 것입니다. 따라서 게시물 탐색 위젯 뒤에 게시물 위젯을 끌어다 놓습니다. 이 위젯을 사용하여 피부색을 변경하고, 열 수, 페이지당 게시물 수, 이미지 위치 및 더 많은 설정을 설정할 수 있습니다 . 레이아웃, 상자, 이미지 및 콘텐츠의 다양한 스타일을 변경할 수도 있습니다.

11단계: 게시물 댓글 위젯 추가

사용자가 게시물에 댓글을 달 수 있는 옵션을 제공하려면 게시물 댓글 위젯을 추가해야 합니다. 게시물 댓글 위젯을 검색하고 게시물 위젯 아래로 끌어다 놓습니다.

12단계: Elementor 사용자 정의 블로그 페이지 템플릿 업데이트 및 보기

이제 모든 디자인이 완료되었으므로 업데이트 버튼 을 클릭합니다 . 게시 설정 창이 나타나면 저장 후 닫기를 클릭합니다.

다음은 방금 만든 사용자 지정 Elementor 블로그 게시물 템플릿의 미리 보기입니다.

위에 설명된 방법이 너무 시간이 많이 걸린다고 생각되면 처음부터 각 섹션을 빌드하고 디자인할 필요가 없는 아래에 언급된 방법을 선택할 수 있습니다.

미리 만들어진 Elementor 템플릿을 사용하여 단일 게시물 페이지를 만드는 방법

Elementor 사용자 정의 블로그 페이지에 사전 제작된 템플릿을 사용할 계획이라면 단 3단계로 수행할 수 있습니다. 방법을 확인해 보겠습니다.

1단계: 대시보드에서 새 단일 블로그 게시물 템플릿 만들기

첫 번째 방법과 마찬가지로 새 단일 블로그 템플릿을 만들어야 합니다. 새 템플릿을 만드는 방법에 대한 자세한 내용은 위로 스크롤하여 첫 번째 방법(블로그 템플릿을 처음부터 만드는 방법)의 첫 번째 단계를 확인하세요 .

2단계: 미리 만들어진 Elementor Single Post 템플릿 선택

템플릿 만들기를 클릭하면 많은 사용자 지정 단일 게시물 템플릿이 있는 Elementor 라이브러리 창이 표시됩니다. 여기에서 원하는 단일 포스트 블록을 선택할 수 있습니다. 원하는 템플릿에 마우스를 가져간 다음 삽입을 클릭합니다.

3단계: 미리 만들어진 Elementor Single Post 템플릿 선택

템플릿이 로드되면 게시 버튼을 클릭하여 모든 새 블로그 템플릿을 저장합니다.

다음은 미리 만들어진 단일 게시물 템플릿을 사용하여 Elementor 블로그 게시물을 사용하는 블로그 게시물의 최종 모습입니다.

ElementsKit으로 Elementor 최신 게시물 페이지를 만드는 방법

이제 매력적인 단일 게시물 템플릿이 있으므로 모든 블로그가 눈을 편안하고 사용자 친화적인 방식으로 표시되도록 사용자 정의 블로그 목록 페이지를 만들 차례입니다. ElementsKit으로 맞춤형 Elementor 최신 게시물을 만드는 방법을 살펴보겠습니다.

1단계: ElementsKit 설치 및 활성화

Elementor 페이지 빌더와 함께 멋진 블로그 목록 페이지를 만들려면 ElementsKit이 필요합니다. ElementsKit은 85개 이상의 위젯과 모듈이 포함된 Elementor용 올인원 플러그인으로 웹 개발을 그 어느 때보다 쉽게 ​​만들어줍니다.

2단계: 게시물 목록 관련 위젯 활성화

활성화되면 게시물 목록 페이지를 구축하기 위해 게시물 관련 위젯을 켜야 합니다. ElementsKit은 블로그 게시물, 게시물 그리드, 게시물 목록, 게시물 탭 위젯 등 을 포함하는 블로그 목록을 표시하는 여러 위젯을 제공합니다. 사용하려는 위젯을 활성화할 수 있습니다.

3단계: 위젯 추가 및 사용자 지정

이제 블로그 목록 페이지로 이동하여 위젯을 검색하고 끌어다 놓기만 하면 됩니다. 위젯이 로드되면 관련 설정을 사용자 정의하여 블로그 목록 페이지를 개인화할 수 있습니다. 몇 가지 ElementsKit 위젯과 해당 사용자 정의 옵션을 사용하여 블로그 목록 페이지가 어떻게 보이는지 살펴보겠습니다.

블로그 게시물:

블로그 게시물 위젯을 사용하여 블로그를 블록 형식, 엄지손가락이 있는 그리드 및 엄지손가락이 없는 그리드로 표시할 수 있습니다. 행당 표시할 게시물 수, 페이지 매김 활성화/비활성화 및 더 많은 옵션을 설정할 수도 있습니다. 자세한 내용은 최근 블로그 게시물을 표시하는 방법에 대한 블로그를 확인하세요.

포스트 그리드:

포스트 그리드 플러그인을 사용하면 블로그 목록에 표시할 카테고리 블로그를 사용자 정의할 수 있습니다. 표시할 게시물 수와 각 행에 있어야 하는 열 번호를 선택할 수도 있습니다. 자세한 내용은 설명서를 확인하십시오.

게시물 탭 위젯

포스트 탭 위젯을 사용하면 추가 카테고리 탭과 함께 포스트 그리드와 같은 모든 사용자 정의 옵션을 얻을 수 있습니다. 이 옵션을 사용하면 사용자는 카테고리 탭에 마우스를 올려놓고 특정 카테고리의 블로그만 볼 수 있습니다.

위젯을 선택하고 원하는 대로 사용자 정의한 후 업데이트 버튼을 클릭하여 게시하십시오. 이제 최근 Elementor 최신 게시물을 매력적인 방식으로 표시하는 페이지가 있어야 합니다.

마지막 단어

두 가지 방법으로 사용자 지정 Elementor 블로그 게시물 템플릿을 만드는 방법에 대한 쉬운 자습서를 제공하기 위해 최선을 다했습니다. 블로그가 맞춤형 Elementor 블로그 템플릿을 구축하는 데 도움이 되었기를 바랍니다. 단계를 따르고 원하는 대로 레이아웃과 디자인을 변경할 수 있습니다.

ElementsKit 위젯을 사용하여 블로그 목록 페이지에 특별한 터치를 제공하는 것을 잊지 마십시오. ElementsKit은 Elementor를 완벽하게 보완합니다. 시간을 내서 이 애드온이 제공하는 모든 놀라운 위젯을 확인하십시오.