워드프레스 엘리멘터용 포스트 그리드 플러그인 Post Grid Elementor Addon

인기 워드프레스 페이지 빌더인 엘리멘터(Elementor)를 사용하면 코딩 지식이 없어도 수월하게 사이트를 만들 수 있습니다. 하지만 워드프레스 글을 나열하는 기능은 엘리멘터 프로에서만 제공됩니다. 엘리멘터 무료 버전에서 포스트를 나열하고 싶은 경우 무료 엘리멘터용 포스트 그리드 플러그인인 Post Grid Elementor Addon을 사용할 수 있습니다.

워드프레스 기본 에디터인 구텐베르그를 사용하는 경우 "워드프레스 포스트 그리드 플러그인"에서 소개하는 Stackable 등의 플러그인을 활용할 수 있습니다.

워드프레스 엘리멘터용 포스트 그리드 플러그인 Post Grid Elementor Addon

엘리멘터에는 다양한 엘리먼트/위젯이 제공되지만, 포스트를 그리드 혹은 리스트 형식으로 표시하는 기능은 Elementor Pro에서만 지원됩니다. 무료 버전에서는 Posts, Portfolio 등의 프로 위젯은 잠금 상태가 되어 드래그할 수 없습니다.

워드프레스 엘리멘터 프로 위젯

엘리멘터 유료 버전을 사용하면 프로 위젯과 프로 템플릿뿐만 아니라 테마 빌더(Theme Builder)를 사용하여 사이트에서 헤더에서 푸터까지 모든 요소를 테마에 의존하지 않고 페이지 빌더로 사이트를 만들 수 있습니다.

하지만 단순히 워드프레스 글을 나열하는 기능만 원하는 경우에는 Post Grid Elementor Addon과 같은 무료 플러그인을 사용할 수 있습니다.

워드프레스 글을 그리드 형식으로 나열하는 엘리멘터용 Post Grid Elementor Addon 플러그인

Post Grid Elementor Addon은 워드프레스 알림판 > 플러그인 > 새로 추가에서 검색하여 설치할 수 있습니다. 이 플러그인을 활성화하면 Post Grid 위젯이 엘리멘터에 추가됩니다.

워드프레스 엘리멘터용 포스트 그리드 플러그인 Post Grid Elementor Addon

이 플러그인은 Elementor Pro의 Posts 위젯과 비슷한 기능을 합니다. 다음은 엘리멘터의 Posts 위젯을 보여줍니다.

엘리멘터의 포스트 위젯
엘리멘터의 Posts 위젯.

아래는 Post Grid Elementor Addon의 Post Grid 위젯을 배치했을 때의 모습을 보여줍니다.

워드프레스 엘리멘터용 Post Grid Elementor Addon의 Post Grid 위젯
Post Grid Elementor Addon의 Post Grid 위젯.

엘리멘터의 Posts 위젯을 사용할 경우 옵션을 조정하여 그리드 형식(컬럼 형식)뿐만 아니라 리스트 형식, 카드 형식 등 레이아웃을 비교적 자유롭게 변형이 가능하고, 커스텀 포스트 타입, 쿼리(Query) 등 고급 기능이 지원됩니다.

엘리멘터 포스트 위젯 - 리스트 형식
글을 목록 형식으로 표시(Elementor의 Posts 위젯).

Post Grid Elementor Addon에서는 그리드 형식으로만 글을 나열할 수 있고 커스텀 포스트 타입(사용자 정의 글 유형)은 유료 버전에서만 지원됩니다.

Post Grid Elementor Addon 무료 vs. 프로 비교

기능FREEPRO
여러 개의 레이아웃OO
사용자 정의 옵션O고급
제목, 이미지, 메타, 요약문, 더 읽기 표시/숨기기OO
Read More 링크OO
정렬 (왼쪽, 중앙, 오른쪽)OO
포스트 정렬(Post Oder) 파라미터OO
기본 이미지 옵션 (특정 이미지가 없는 경우)XO
링크 비활성화 (제목 & 이미지)XO
메타 설정 (날짜 형식, 댓글 링크, 카테고리, 태그 등)XO
요약문 줄임 기호XO
포스트 필터XO
페이지네이션XNormal, Ajax, Load More
커스텀 포스트 타입 지원XO
우커머스 & Easy Downloads 지원XO
추가 레이아웃(+오버레이)XO
쿼리 파라미터 (포스트 타입, 카테고리, 분류, 태그 등)기본고급
글 제외XO

Essential Addons for Elementor

포스트 그리드뿐만 아니라 다양한 엘리먼트가 필요한 경우 Essential Addons for Elementor 플러그인을 사용할 수 있습니다. 이 플러그인도 무료 버전과 프리미엄 버전이 있습니다. Essential Addons for Elementor은 현재 100만 개가 넘는 사이트에 설치되어 사용되고 있습니다.

무료 버전에서는 40개 이상의 위젯을 제공합니다.

  • Post Grid – 블로그 포스트를 3가지 스타일로 표시할 수 있음
  • Post Timeline – 포스트, 페이지 또는 커스텀 포스트에 타임라인 생성
  • Fancy Text – 8가지 효과로 애니메이션 텍스트를 사용하여 페이지 디자인 가능
  • Creative Buttons – 글이나 페이지에서 빠르게 허버 효과가 적용된 모던한 버튼 추가
  • Countdown (카운트다운)
  • Team Members (팀원)
  • Testimonials – 사용자들의 후기/경험담을 표시하여 신뢰도를 향상시킬 수 있습니다.
  • WooCommerce Product Grid – 추가적인 노력 없이 원하는 곳에 우커머스 상품 표시
  • Contact Form 7 – 컨택트 폼 컨테이너, 필드 등을 디자인
  • Gravity Forms – 완전히 커스터마이징 가능. 모든 스타일링 제어 가능
  • Ninja Forms – 원하는 대로 폼 스타일을 쉽게 생성
  • Caldera Forms – 효과적인 모바일 친화적인 양식 디자인
  • WPForms – 강력한 워드프레스 폼을 짧은 시간에 만들 수 있습니다.
  • weForms – 매우 빠르게 폼을 만들 수 있음
  • Info Box – 미리 정의된 스타일에서 예쁜 정보 상자 디자인
  • Flip Box (플립 박스)
  • Dual Color Headline - 문장에서 한 단어의 컬러를 다르게 하여 강조 표시
  • Call to Action – CTA 버튼 디자인
  • Pricing Table – 가격표를 빠르게 생성 가능
  • Twitter Feed – 방문자들에게 최근 트윗을 표시
  • Data Table – 원하는 곳에 시각적으로 매력적인 데이터 삽입
  • Filterable Gallery – 맞춤형 콘텐츠를 쉽게 표시
  • Image Accordion – 허버 효과로 이미지 강조
  • Content Ticker – 동적 & 커스텀 콘텐츠에 슬라이더 및 티커 효과 등을 사용
  • Tooltip – 아이콘, 이미지, 텍스트 또는 숏코드에 툴팁 설정
  • Advanced Tabs – 정보를 다양한 스타일로 배치하는 탭 포함. 중첩 탭 지원
  • Advanced Accordion – 예쁜 아코디언을 페이지, 포스트 등에 추가. 중첩 아코디언 지원
  • Progress Bar – 4가지 이상의 스타일로 진행률 표시줄 표시
  • Feature List – 사용자 정의 아이콘과 스타일로 특성 목록 표시
  • Fluent Form – Fluent Form 컨테이너, 필드 등을 디자인
  • Facebook Feed – 페이지에서 페이스북 포스트 피드 표시
  • Sticky Video – 유튜브, 비메오 또는 자체 호스팅 동영상을 페이지 스크롤 시에도 고정되어 재생(붙박이)
  • BetterDocs Category Grid – BetterDocs Category 리스트로 커스텀 지식 기반(KB) 레이아웃 생성
  • BetterDocs Category Box – BetterDocs Category 리스트로 커스텀 박스 스타일의 KB 레이아웃 생성.
  • BetterDocs Search Form – BetterDocs Documentation용 실시간 검색 상자 배치 및 디자인
  • Advanced Data Table – 엘리멘터로 유연한 테이블 생성
  • Event Calendar (이벤트 캘린더)
  • Formstack – 엘리멘터 내에서 Formstack 폼 디자인
  • Woo Checkout – 사용자 고유의 WooCommerce 체크아웃 페이지를 생성하고 모든 것을 커스텀/디자인 가능
  • Typeform – 엘리멘터 내에 Typeform 폼을 삽입하여 디자인
  • Login | Register Form – 로그인 / 회원가입 폼
  • Woo Product Compare – WooCommerce 상품 비교표를 곧바로 생성 가능
  • Woo Product Carousel – 쉽게 우커머스 상품 캐러셀 디자인
  • Simple Menu– 워드프레스 사이트용 내비게이션 메뉴를 쉽게 디자인

다음 영상에서 제공되는 위젯들을 간략히 살펴볼 수 있습니다.

엘리멘터 페이지 빌더용 애드온 Element Pack

엘리멘터 페이지 빌더용 애드온 Element Pack

엘리멘토 프로에서 제공하는 프로 위젯/엘리먼트 기능을 사용하고 싶은 경우 Element Pack과 같은 엘리멘터용 애드온 플러그인을 고려해볼 수 있습니다. Element Pack은 Codecanyon 마켓에서 판매되고 있는 인기 워드프레스 플러그인 중 하나입니다.

이 플러그인은 190개 이상의 엘리멘터용 엘리먼트를 제공합니다.

  • Carousel (캐러셀)
  • FAQ (자주 묻는 질문)
  • News Ticker (뉴스 티커)
  • Post Slider (포스트 슬라이더)
  • Post Card (포스트 카드)
  • Post Grid (포스트 그리드)
  • Post Grid Tab (포스트 그리드 탭)
  • Post Gallery (포스트 갤러리)
  • Post List (포스트 리스트)
  • Post Block (포스트 블록)
  • Post Block Modern (포스트 블록 모던)
  • Portfolio Gallery (포트폴리오 갤러리)
  • Portfolio Carousel (포트폴리오 캐러셀)
  • Portfolio List (포트폴리오 리스트)
  • Single Post (단일 포스트)
  • Testimonial Grid (사용자 후기 그리드)
  • Table of Content (목차)
  • Testimonial Slider (사용자 후기 슬라이더)
  • Testimonial Carousel (사용자 후기 캐러셀)
  • Thumb Gallery (썸네일 갤러리)
  • Timeline (타임라인)
  • Accordion (아코디언)
  • Advanced Image Gallery (고급 이미지 갤러리)
  • Business Hours (영업 시간)
  • Breadcrumbs (브레드크럼)
  • Circle Menu (원 메뉴)
  • Circle Info (원 모양으로 정보 제공)
  • Custom Carousel (커스텀 캐러셀)
  • Custom Gallery (커스텀 갤러리)
  • Comment (댓글)
  • Device Slider (디바이스 슬라이더)
  • Document Viewer (문서 뷰어)
  • Fancy Slider (팬시 슬라이더)
  • Fancy List (팬시 리스트)
  • Fancy Card (팬시 카드)
  • Fancy Tabs (팬시 탭)
  • Fancy Icon (팬시 아이콘)
  • Flip Box (플립 박스)
  • Honeycombs (벌집 모양으로 정보 표시)
  • Image Expand (이미지 확장)
  • Panel Slider (패널 슬라이더)
  • Pricing Table (가격표)
  • Pricing List (가격 리스트)
  • Lightbox (라이트박스)
  • Navbar (내비게이션 바)
  • Scroll Image (스크롤 이미지)
  • Simple Contact Form (심플한 컨택트 폼)
  • Slider (슬라이더)
  • Slideshow (슬라이드쇼)
  • Switcher (전환 버튼. 예: '연간 요금제'와 '평생 요금제' 간에 전환할 수 있는 버튼 표시)
  • Tabs (탭)
  • Toggle (토글)
  • Video Gallery (동영상 갤러리)
  • Advanced Button (고급 버튼)
  • Advanced Counter (고급 카운터)
  • Advanced Divider (고급 디바이더)
  • Advanced Heading (고급 헤딩)
  • Advanced Google Map (고급 구글 지도)
  • Animated Heading (애니메이션 헤딩)
  • Advanced Icon Box (고급 아이콘 박스)
  • Advanced Progress Bar (고급 진행 표시줄)
  • Audio Player (오디오 플레이어)
  • Call out (콜아웃: CTA 버튼)
  • Changelog (변경 로그)
  • Charts (차트)
  • Countdown (카운트다운)
  • Cookie Consent (쿠키 동의)
  • Crypto Currency Card (암호화폐 카드)
  • Crypto Currency Table (암호화폐 테이블)
  • Dual Button (이중 버튼)
  • Dropbar (드롭바)
  • Hover Box (허버 박스)
  • Hover Video (허버 동영상)
  • Icon Nav (아이콘 내비게이션)
  • Image compare (이미지 비교)
  • Lottie Image (Lottie 이미지)
  • Lottie Icon Box (Lottie 아이콘 박스)
  • Image Magnifier (이미지 확대경)
  • Instagram (인스타그램)
  • Member (회원)
  • Notification (알림)
  • Open Street Map (오픈 스트리트 맵)
  • Profile Card (프로필 카드)
  • Timezone (타임존)
  • Step Flow (단계 흐름)
  • Dark Mode (다크 모드)
  • 360° Product Viewer (360도 상품 뷰어)
  • Featured Box (특성 박스)
  • Google Reviews (구글 리뷰)
  • Help Desk (헬프데스크)
  • Iframe
  • Interactive Card (인터랙티브 카드)
  • Image Accordion (이미지 아코디언)
  • Logo Grid (로고 그리드)
  • Logo Carousel (로고 캐러셀)
  • Marker (마커)
  • Mailchimp (메일침프)
  • Offcanvas (오프캔버스 - 사이드바에서 패널이 슬라이딩되면서 표시됨)
  • Progress pie (진행률을 파이 모양으로 표시)
  • Protected Content (보호된 콘텐츠)
  • Reading Progress (사용자가 글을 읽을 때 진행률을 표시)
  • Search (검색)
  • Scroll Button (스크롤 버튼)
  • Social share (소셜 공유)
  • Social Proof (Facebook, Google, Yelp 등의 리뷰 평가 점수를 표시)
  • Source Code (소스 코드)
  • SVG Image (SVG 이미지)
  • Tag Cloud (태그 클라우드)
  • Table (테이블, 표)
  • Trailer Box (트레일러 박스)
  • Twitter Grid (트위터 그리드)
  • Twitter Carousel (트위터 캐러셀)
  • Twitter Slider (트위터 슬라이더)
  • QR Code (QR 코드)
  • User Register (사용자 회원가입)
  • User Login (사용자 로그인)
  • Video Player (동영상 플레이어)
  • Vertical Menu (수직 메뉴)
  • Weather (날씨)
  • Booked Calendar (예약 캘린더)
  • bbPress
  • BuddyPress Member (BuddyPress 멤버)
  • BuddyPress Friends (BuddyPress 친구)
  • BuddyPress Group (BuddyPress 그룹)
  • Calendly
  • Contact Form 7 (컨택트 폼 7)
  • Charitable Campaigns (서드파티 Charitable Campaign 위젯)
  • Charitable Donors (기부자 이름, 아바타, 후원액, 위치 등의 기부자 정보 표시)
  • Charitable Donations (기부 내역 표시)
  • Charitable Donation Form
  • Charitable Login (로그인 양식)
  • Charitable Registration (회원가입 양식)
  • Charitable Stat (진행 중인 캠페인의 현재 진행 표시)
  • Charitable Profile (기부자 프로필)
  • Caldera Form (Caldera 폼 - 현재 20만 개 이상 사이트에 설치된 컨택트 폼 플러그인)
  • Download Monitor (다운로드 모니터)
  • Everest Form
  • Event Calendar Countdown (이벤트 캘린더 카운트다운)
  • Event Carousel (이벤트 캐러셀)
  • Event Grid (이벤트 그리드)
  • Event List (이벤트 리스)
  • Easy Digital Downloads
  • Easy Digital Downloads History (EDD 내역)
  • Easy Digital Downloads Purchase History (EDD 구매 내역)
  • Easy Download Portfolio Editor (Easy Download 포트폴리오 에디터)
  • Formidable Forms
  • Gravity Forms
  • Give Form (Give 도네이션 플러그인 기부 양식)
  • Give Receipt (Give 플러그인 - 기부 성공 여부를 표시하는 기부 영수증)
  • Give Login (Give 플러그인 로그인)
  • Give Register (Give 플러그인 회원가입)
  • Give Form Grid (Give 플러그인 - 캠페인을 그리드 형식으로 표시)
  • Give Donor Wall
  • Give Donation History
  • Give Goal
  • Give Totals
  • Give Profile Editor (Give 플러그인 - 프로필 편집기)
  • Instagram Feed (인스타그램 피드)
  • Layer Slider (레이어 슬라이더)
  • Mailchimp For WordPress (메일침프)
  • Ninja Forms
  • QuForm (여러 개의 폼을 빠르고 쉽게 추가할 수 있음)
  • Revolution Slider (레볼루션 슬라이더)
  • TablePress
  • Tutor LMS Course Grid
  • Tutor LMS Course Carousel
  • WP Forms
  • WooCommerce Add to Cart (우커머스 장바구니)
  • WooCommerce Mini Cart (우커머스 미니 장바구니)
  • WooCommerce Cart Page (우커머스 장바구니 페이지)
  • WooCommerce Categories (우커머스 카테고리)
  • WooCommerce Checkout Page (우커머스 결제 페이지)
  • WooCommerce Carousel (우커머스 캐러셀)
  • WooCommerce Products (우커머스 상품)
  • WooCommerce Slider (우커머스 슬라이더)
  • WooCommerce Tracking Form (우커머스 추적 양식)
  • Element Parallax (엘리먼트 패럴랙스)
  • Parallax Background (패럴랙스 배경)
  • Parallax Section (패럴랙스 섹션)
  • Scrollnav
  • Schedule Content
  • Section Particles
  • Sticky Section (고정 섹션)
  • Transform Example (Hover Translate Y (-25px), Hover Translatex (-25px, 25px),Hover Translate X & Y 예시)
  • Widget Tooltip (위젯 툴팁)
  • Widget Equal Height (위젯 동일 높이)

자세한 정보와 데모는 Element Pack 플러그인 소개 사이트를 참고해 보시기 바랍니다.

참고


댓글 남기기

* 이메일 주소는 공개되지 않습니다.