Elementor로 블로그 페이지를 만드는 방법(무료, 프로 필요 없음)

무료 Elementor 는 게시물을 나열할 수 없습니다. 게시물 위젯,기록 보관 게시물,게시물 제목 및 나머지 게시물 위젯은 모두 Elementor Pro 입니다. 무료 설치에서는 자물쇠가 있고 다른 것은 없는 위젯 패널에 표시됩니다. Pro 비용을 지불하지 않고 블로그 페이지를 구축하려면 무료를 설치하십시오 마스터 애드온 그리드, 목록 또는 석조로 게시물을 나열하고 일반 Elementor 편집기 내에서 작동하는 블로그 게시물 위젯을 플러그인하고 사용하십시오.

이 가이드는 Elementor 4.2.4 및 Master Addons 3.2의 스크린샷을 무료 설치로 처음부터 끝까지 구축합니다. 레이아웃 선택, 쿼리 필터, 대부분의 튜토리얼에서 놓친 카테고리 필터 탭, 그리드가 깔끔해 보이는지 또는 너덜너덜해 보이는지를 결정하는 두 가지 설정을 다룹니다.

Elementor free에는 블로그나 게시물 위젯이 있나요?

아니오. 무료 설치에서 위젯 패널에서 “게시물”을 검색하면 이것이 돌아옵니다.

블로그 게시물 및 타임 라인은 보라색 마스터 애드온 배지를 가지고 드래그 할 준비가되어 있습니다. 게시물,게시물 제목,게시물 발췌,보관 게시물,게시물 댓글,게시물 탐색 및 게시물 정보는 모두 무료 플러그인 내부에서 Pro 를 광고하는 Elementor 인 자물쇠를 가지고 있습니다.

따라서 네 가지 옵션이 있습니다:

이 가이드의 나머지 부분은 무료 Master Addons 위젯을 사용합니다. 아래에 표시된 모든 컨트롤은 무료 플러그인에 있습니다. 블로그 게시물 위젯의 어떤 것도 잠겨 있지 않습니다.

시작하기 전에 필요한 것

• 워드프레스 with 엘리멘터 설치되었습니다. 무료 버전은 괜찮습니다.
• 무료 마스터 애드온 플러그인. 설치 노트는 여기 당신이 그들을 원한다면.
• 게시된 게시물 몇 개. 여섯 개 이상이 레이아웃을 판단하기 쉽게 만듭니다.
• 모든 게시물에 특집 이미지. 하나가없는 게시물은 그리드에 간격을두고, 레이아웃 설정이 그 수정하지 않습니다.

Elementor 블로그 페이지를 무료로 만드는 방법은 단계별로입니다

1 단계: 페이지 만들기

로 이동 페이지 → 새 페이지 추가, 제목을 블로그로 지정한 다음 클릭합니다 Elementor 로 편집. WordPress 콘텐츠 영역을 비워 두십시오. 모든 일은 Elementor 캔버스에서 발생합니다.

설정 → 읽기 아래 워드 프레스 게시물 페이지로이 페이지를 설정하지 마십시오. 즉,테마에 URL 을 손을 Elementor 디자인을 폐기합니다. 더 아래로 할 수있는 올바른 방법에 섹션이 있습니다.

2 단계: 블로그 게시물 위젯 추가

위젯 패널을 검색하세요 블로그 그리고 드래그하세요 블로그 게시물 캔버스 위로. 최신 게시물을 바로 렌더링하므로 변경하면서 변경하는 내용을 볼 수 있습니다.

3 단계: 레이아웃 선택하기

오픈 디스플레이 옵션. 여기의 컨트롤은 페이지의 모양을 설정합니다.

가장 중요한 두 컨트롤은 맨 위에 있습니다:

• 블로그 레이아웃: Classic 또는 Cards. Classic 은 페이지 배경에 텍스트를 넣습니다. 카드는 각 게시물을 자체 패널로 감싸줍니다.
• 블로그 유형: 그리드 레이아웃, 목록 레이아웃 또는 벽돌 레이아웃.

그 이하로 설정하세요 열 수. 그것은 반응 제어,그래서 당신은 데스크탑 세 열을 줄 수 있고 편집기의 상단에 장치를 전환하여 모바일 하나를 제공합니다. 세 이미지가있는 블로그에 대한 안전한 기본값입니다.

이제 두 가지 더 설정할 가치가 있습니다. 제목 HTML 태그 기본값은 블로그 인덱스에 적합한 H2 로,페이지 제목이 H1 이고 각 게시물 제목이 그 아래에 있기 때문입니다. 그리고 소스 최신 게시물 및 현재 쿼리 중에서 선택합니다. 일반 블로그 페이지의 최신 게시물에 남겨주세요; Current Query is for 아카이브 템플릿위젯은 자체 설정 대신 보고 있는 카테고리나 작성자를 따라야 합니다.

4 단계: 카드 또는 목록 스타일을 선택하십시오

블로그 레이아웃을 카드로 설정하고 a 카드 레이아웃 컨트롤은 일곱 가지 디자인으로 나타납니다.

기본값,콘텐츠 오버랩,왼쪽 상단 메타,오른쪽 정렬 카드,중앙 정렬 카드,중앙 정렬 그라데이션 BG 및 배너 카드. 콘텐츠 오버랩 및 배너 카드는 이미지 위에 텍스트를 넣으므로 공간이있는 사진이 필요합니다. 기본 및 오른쪽 정렬 카드는 혼합 된 추천 이미지 세트에 대해보다 안전한 선택입니다.

블로그 유형을 목록으로 전환하면 카드 컨트롤이 다음으로 대체됩니다 목록 레이아웃 유형, 7개가 더 있어요.

이는 세 가지 레이아웃 유형 외에 그리드용 7개, 목록용 7개 등 총 14개의 기성 디자인이므로 처음부터 카드 스타일을 지정할 필요가 거의 없습니다.

5 단계: 썸네일 크기 및 호버 효과를 설정합니다

오픈 썸네일 설정. 누더기 블로그 페이지는 일반적으로 여기에 고정됩니다.

기본적으로 위젯은 각 추천 이미지를 자체 비율로 유지하므로 풍경 행에 있는 인물 사진 한 장이 해당 카드를 페이지 아래로 밀어냅니다. 회전 사용자 정의 높이 에와 설정 min 과 max 같은 값으로,주위 200 ~ 240px,모든 썸네일은 같은 상자에 자릅니다. 썸네일 핏 덮개로 설정하면 작물이 무엇이든 찌그러지는 것을 방지할 수 있습니다.

그 아래, 호버 애니메이션 elementor 자신의 애니메이션을 사용, 그리고 색상 효과 열여섯 오버레이 효과 중 하나를 추가: 확대 및 축소, 회전 및 확대, 슬라이드, 회색 스케일, 흐림, 세피아, 두 흐림 조합, 두 불투명 페이드, 플러싱, 광택과 원. 썸네일 모양 상단에 5개의 프레임을 추가합니다: 프레임, 대각선, 경계, 그라데이션 경계 및 사각형.

하나의 효과를 골라 모든 곳에서 사용하세요. 한 페이지에 걸쳐 세 개의 다른 것을 노이즈로 읽습니다.

6 단계: 표시할 메타를 선택합니다

오픈 게시물 설정 그리고 독자가 필요로 하지 않는 것은 모두 끄십시오.

발췌 길이 기본값은 카드에 긴 55 단어입니다. 그리드가 스캔 가능한 상태로 유지되고 클릭이 요약이 아닌 게시물로 이동하도록 15 ~ 25 로 놓습니다. 더 읽기 텍스트 는 자유 텍스트이므로 “가이드 읽기” 는 “자세히 읽기” 뿐만 아니라 작동합니다.

아래의 토글은 제어 게시물 제목,저자 아바타,저자 이름,날짜, 카테고리,태그 및 댓글 수를 독립적으로 계산합니다. 전환 카테고리를 표시하시겠습니까? on은 독자들에게 관련 게시물에 대한 두 번째 방법을 제공하기 때문에 일반적으로 그만한 가치가 있습니다.

7 단계: 어떤 게시물이 나타나는지 필터링합니다

오픈 고급 설정. 쿼리 섹션입니다.

• 카테고리별로 필터링하세요, 태그별로 필터링하세요 그리고 작성자별로 필터링하세요 쿼리 범위를 좁힙니다. 각각은 여러 값을 받아들입니다.
• 제외할 게시물입니다 특정 게시물을 이름으로 삭제하면 메인 그리드에서 고정된 공지를 유지하는 방법입니다.
• 오프셋 게시물 수 첫 번째 N 개의 게시물을 건너뜁니다. 그리드 위에 추천 위젯을 설정하여 최신 3 개를 표시한 다음 그리드를 3 개로 오프셋하면 게시물이 두 번 나타나지 않습니다.
• 새 탭의 링크 그것이 말하는 것을 행한다.

8 단계: 결과를 게시하고 확인합니다

게시를 누르고 일반 브라우저 탭에서 페이지를 엽니다. 여기에 완성된 그리드가 있습니다: 세 개의 열,카드, 균일 축소판,상단에 걸쳐 있는 카테고리 탭.

컨트롤이 어디에 있는지 알게 된 후 총 시간은 10분 미만입니다.

블로그 페이지에 카테고리 필터 탭 추가

해당 스크린샷 상단의 필터 탭은 무료이며 사람들이 놓치는 부분입니다. 독자는 페이지를 떠나지 않고도 카테고리별로 그리드를 좁힐 수 있습니다.

켜다 카테고리 필터 탭 고급 설정에서. 그런 다음 카테고리별로 필터 필드에서 탭으로 원하는 카테고리를 선택합니다. 탭은 페이지의 게시물 카테고리가 아닌 해당 선택에서 빌드됩니다. 필드를 비워 두면 하나의 모든 탭과 다른 아무 것도 얻을 수 없습니다. 깨진 것처럼 보이지만 디자인대로 작동합니다.

모든 텍스트 첫 번째 탭의 이름을 변경하고 정렬 행을 왼쪽,중앙 또는 오른쪽으로 이동합니다. 필터 탭과 캐러셀은 상호 배타적이므로 캐러셀을 활성화하면 탭의 렌더링이 중지됩니다.

그리드, 목록 또는 석조: 사용할 레이아웃입니다

그리드 는 기본값이며 대부분의 블로그에 적합합니다. 동일한 카드,가로가 3 개,스캔 가능. 사용자 정의 썸네일 높이와 함께 사용하여 행이 정렬됩니다.

리스트 텍스트 옆에 축소판이 있는 행당 하나의 게시물을 배치합니다. 목록으로 전환할 때 열 수를 1 열로 설정하거나,나란히 꽉 찬 세 개의 목록 항목을 얻습니다.

목록은 발췌한 숨쉴 공간을 제공하므로 요약이 판매되는 에세이 스타일 블로그에서 작동합니다.

벽돌 열은 유지하지만 고정된 행 높이는 떨어지므로 카드는 내용별로 쌓이고 간격은 닫힙니다.

Masonry 는 Custom Height 를 꺼두어야 하는 한 가지 경우입니다. 고르지 않은 높이가 작동하게 만드는 요소이기 때문입니다. 사진 주도 블로그에 적합하며 모든 추천 이미지가 동일한 모양일 때 무너집니다.

블로그 그리드를 회전목마로 바꿔보세요

동일한 위젯은 블로그 페이지 자체가 아닌 홈 페이지에서 원하는 게시물 회전 목마와 두 배가됩니다.

스위치 회전목마를 활성화하시겠습니까? 켜짐 및 회전목마 설정 섹션이 열립니다: 자동 재생 및 자동 재생 속도, 호버링 시 일시 중지, 장치별로 스크롤할 슬라이드, 중앙 슬라이드, 커서 잡기, 드래그 프리 모드, 루프 및 애니메이션 속도 레이아웃 컨트롤은 자체 회전, 늘이기, 수정자 및 깊이 설정으로 커버플로우 효과도 제공합니다.

관찰자 캐러셀이 탭, 아코디언 또는 페이지 로드에 숨겨진 다른 항목 내부에 있는 경우 예여야 합니다. 그렇지 않으면 너비가 0으로 측정되어 스택으로 렌더링됩니다.

게시된 날짜 대신 수정된 날짜를 표시합니다

블로그 게시물 위젯이 가능합니다 정렬 수정 날짜별: set 주문 기준 디스플레이 옵션에서 마지막으로 수정한 내용과 최근에 업데이트한 게시물이 맨 위로 올라갑니다. 새로 고친 콘텐츠를 계속 표시하기 때문에 그것만으로도 사람들이 실제로 원하는 경우가 많습니다.

수정된 날짜를 보이는 텍스트로 표시하는 것이 다릅니다. 위젯은 게시된 날짜를 카드에 인쇄하는 반면 기본은 인쇄합니다 <time datetime> 속성은 수정된 날짜를 전달합니다. 검색 엔진은 속성을 읽으므로 카드에 달리 표시되어 있어도 업데이트된 날짜가 게시되지만 독자는 원래 날짜를 봅니다.

수정된 날짜를 텍스트로 표시하려면 Pro Posts 또는 Loop Grid 위젯 내부에서 사용되는 Post Date 태그에 수정된 옵션이 있는 Elementor Pro 의 동적 태그가 필요합니다. 무료 Elementor 와 동등한 기능은 없습니다. 왜냐하면 동적 태그는 우선 Pro 기능을 필터링하는 작은 스니펫이 무료의 대안입니다 get_the_time 블로그 템플릿에.

블로그 페이지 또는 게시물 페이지? 올바르게 설정하십시오

WordPress에는 아래에 설정된 자체 게시물 페이지가 있습니다 설정 → 읽기. 방금 만든 페이지는 일반 페이지이며,둘은 다르게 동작합니다.

설정 → 읽기에서 Elementor 페이지를 게시물 페이지로 할당하면 WordPress 가 URL 을 테마의 아카이브 템플릿에 전달하고 Elementor 디자인이 무시됩니다. 즉,완성 된 블로그 페이지가 테마의 기본 목록을 대신 표시하는 가장 일반적인 단일 이유입니다.

제대로 하는 두 가지 방법:

• 정상적인 페이지를 유지하십시오. 설정 → 읽기는 그대로 두고 외관 → 메뉴 아래의 메뉴에 블로그 페이지를 추가합니다.The page renders your Elementor design, what is what you want.
• 실제 아카이브를 구축. WordPress 아카이브 URL 자체가 디자인을 사용하려면 에 아카이브 템플릿을 구축하세요 마스터 애드온 테마 빌더 그리고 블로그 게시물 위젯의 소스를 현재 쿼리로 설정하여 보고 있는 아카이브를 모두 따릅니다.

마스터 애드온 블로그 게시물 vs Elementor Pro 게시물 위젯

Elementor Pro 는 동적 태그,로드 더 및 무한 스크롤에서 승리합니다. 무료 Master Addons 위젯은 레이아웃 다양성,호버 효과,필터 탭 및 내장 된 캐러셀에서 승리합니다. 팝업,양식 및 테마 구축이 이미 Pro 로 끌어 당기고 있다면 Pro 를 고려중인 유일한 이유가 블로그 페이지라면 이것은 아무것도 아닌 것으로 덮습니다 마스터 애드온 라이센스 pro 위젯을 다른 곳에서 원하는 경우에만 살펴볼 가치가 있습니다.

잘못 보이는 블로그 레이아웃에 대한 7 가지 수정 사항

1. 누더기 카드 높이. 썸네일 설정에서 사용자 지정 높이를 켜고 min 과 max 를 동일한 값으로 설정합니다. 열에 아홉 번 수정한 것입니다.
2. 격자무늬의 빈 직사각형. 해당 게시물에는 추천 이미지가 없습니다. 일반 브랜드 그래픽이라도 추가하세요.
3. 카드를 삼키는 발췌문. 발췌 길이를 55개에서 약 20개 단어로 줄입니다.
4. 세 개의 목록 항목이 나란히 있습니다. 목록 레이아웃 필요 열 수 1 열로 설정됨.
5. 모두만 표시하는 필터 탭. 카테고리별로 필터링에서 카테고리를 선택합니다. 탭은 해당 필드에서 옵니다.
6. 하나의 긴 열에 모바일에 쌓인 모든 것. 보통은 맞습니다. 기기 전환기로 확인하고 모바일 열을 우연에 맡기지 않고 일부러 설정하세요. 에 대한 가이드 요소 중단점 나머지는 덮는다.
7. 느린 블로그 페이지. 위젯을 비난하기 전에 추천 이미지의 크기를 확인하십시오. 먼저 압축; 우리의 참조하십시오 이미지 최적화 프로그램 검거 그리고 메모 elementor 사이트 속도 향상.

자주 묻는 질문

관련 읽기

• 블로그 게시물 위젯모든 설정이 나열된 기능 페이지입니다
• 블로그 요소 문서
• Elementor 에서 끈적한 헤더를 만드는 방법
• Elementor를 사용하여 WordPress에서 바닥글을 편집하는 방법
• 마스터 애드온 템플릿 라이브러리, 기성 페이지를 가져오고 싶다면
• WordPress.org의 마스터 애드온