Elementor 에서 타임라인을 추가하는 방법
이 단계에서는 무료 사용자 지정 타임라인을 빌드합니다. 위젯은 세 개의 샘플 항목으로 시작하므로,무엇이든 변경하기 전에 레이아웃을 볼 수 있습니다.
- Elementor에서 위젯 패널에서 “타임라인”을 검색하고 마스터 애드온 위젯을 페이지로 드래그합니다.
- 사용자 지정 타임라인에 타임라인 유형을 유지하고 수직 타임라인 또는 수평 타임라인을 선택합니다.
- 항목 아래의 각 행을 열고 날짜나 사용자 정의 레이블, 콘텐츠, 이미지 및 링크를 설정합니다.
- 더 많은 마일스톤을 보려면 항목 추가를 클릭하고 행을 드래그하여 순서를 변경하세요.
- 수평 타임라인의 경우 탐색 및 회전목마 설정을 설정합니다.
- 스타일 탭에서 카드, 날짜, 줄 및 포인트를 스타일링한 다음 게시합니다.
우리의 타임라인 튜토리얼 스크린샷으로 각 설정을 거치며, 이 페이지 상단의 비디오는 동일한 단계를 보여줍니다.
Elementor 또는 Elementor Pro에는 타임라인 위젯이 있습니까?
아니요. Elementor 나 Elementor Pro 모두 타임라인 위젯이 포함되어 있지 않으므로,컨테이너, 테두리 및 사용자 정의 CSS 로 만든 애드온 또는 손으로 만든 레이아웃이 필요합니다. Master Addons 타임라인 위젯은 Elementor 와 자체적으로 작동하며,Elementor Pro 가 필요하지 않습니다. 위젯이 다루는 내용은 다음과 같습니다.
| 타임라인 위젯 | |
|---|---|
| 레이아웃 | 수직 또는 수평 회전목마 |
| 카드 정렬 | 왼쪽, 중앙, 오버레이 또는 오른쪽 |
| 콘텐츠 소스 | 손으로 추가하는 항목 또는 블로그 게시물(포스트 타임라인, Pro) |
| 각 품목 | 날짜 또는 사용자 정의 라벨, 풍부한 콘텐츠, 이미지 및 전체 카드에 대한 링크 |
| 포인트 유형 | 점, 아이콘, 이미지, 숫자 또는 문자 |
| 수평 탐색 | 선택적인 스크롤바가 있는 화살표, 점, 분수 또는 진행률 표시줄 |
| 스타일 섹션 | 카드, 날짜, 줄, 포인트가 포함된 10개입니다 |
| 필요 | Elementor 및 마스터 애드온 |
사용자 지정 타임라인 (무료) 또는 포스트 타임라인 (Pro)
사용자 지정 타임라인은 무료 옵션입니다. 각 항목은 날짜를 가져오며,이를 “1 단계”와 같은 사용자 지정 레이블,풍부한 텍스트 콘텐츠 영역,이미지 및 전체 카드에 대한 선택적 링크로 바꿀 수 있습니다. 항목에는 고유한 포인트 및 색상 설정도 있습니다. Pro 의 일부인 포스트 타임라인은 게시물에서 타임라인을 빌드합니다: 카테고리,태그 또는 작성자별로 필터링하고,특정 게시물을 제외하며,순서 및 오프셋을 설정하고,제목, 추천 이미지 및 발췌를 표시할지 여부를 선택합니다.
- 사용자 정의 타임라인: 각 항목에 대한 날짜 또는 사용자 정의 레이블, 콘텐츠, 이미지 및 링크입니다.
- 포인트, 카드, 날짜 색상에 대한 항목별 스타일링입니다.
- 게시물 타임라인(Pro): 카테고리, 태그 및 작성자 필터, 제외된 게시물, 오프셋 및 주문.
- 엽서에는 제목, 주요 이미지, 발췌문 및 자세한 내용을 읽을 수 있는 링크가 표시될 수 있습니다.
Elementor의 수직 타임라인
수직 타임라인은 중앙선을 따라 카드를 쌓습니다. 왼쪽,중앙, 오른쪽 또는 오버레이로 정렬하고 스위치 하나로 카드 위치를 반대로 만듭니다. 가로 간격 및 세로 간격으로 간격을 설정합니다. 태블릿과 휴대폰에서 카드는 라인의 한쪽으로 이동합니다.
- 수평 정렬: 왼쪽, 중앙, 오버레이 또는 오른쪽.
- 역방향 카드 위치는 어느 쪽이 먼저 오는지 뒤집습니다.
- 카드용 수직 정렬 및 두 개의 간격 슬라이더.
- 태블릿과 휴대폰에서 카드는 한쪽으로 이동합니다.
Elementor(회전목마)의 수평 타임라인
타임라인 스타일을 가로 타임라인으로 설정하면 사용자 지정 타임라인이 회전식 회전목마가 되며 카드 위 줄에 점이 표시됩니다. 탐색에서 화살표 및 점,화살표 및 분수,화살표, 점,진행 또는 없음을 선택하고 원하는 경우 스크롤바를 추가합니다. 회전목마 설정에는 표준 또는 커버플로 레이아웃,자체 속도로 자동 재생,호버에서 일시 중지,루프 및 스크롤할 슬라이드가 있습니다.
- 6가지 탐색 옵션과 옵션 스크롤바.
- 회전목마 또는 Coverflow 레이아웃.
- 자동 재생, 호버링, 루프 및 중앙 슬라이드에서 일시 중지.
- 사용자 정의 타임라인에 사용할 수 있습니다.
라이브로 만나보세요 수평 로드맵 데모.
타임라인 게시: 블로그 게시물에서 타임라인을 구축하세요(Pro)
포스트 타임라인은 마스터 애드온 프로의 일부입니다. 타임라인 유형을 포스트 타임라인으로 전환하면 위젯이 게시된 게시물을 기본적으로 가장 최신의 첫 번째 줄에 나열하므로 게시할 때마다 타임라인이 늘어납니다. 페이지당 게시물,게시 순서 및 순서별로 게시물을 설정하고,카테고리, 태그 또는 작성자별로 필터링하고,배제할 게시물로 게시물을 건너뛰고,오프셋 게시물 수를 사용하여 목록 아래에서 더 시작합니다. 포스트 타임라인은 수직입니다.
- 쿼리: 페이지당 게시물, 게시물 순서, 순서 및 오프셋 게시물 수.
- 필터: 제외할 카테고리, 태그, 작성자 및 게시물.
- 제목, 이미지, 발췌 및 자세히 읽기 버튼을 표시하거나 숨깁니다.
- 링크 활성화는 각 카드를 해당 게시물에 연결합니다.
그리드나 게시물 목록의 경우 다음을 사용하십시오 블로그 위젯.
선과 점 스타일링
배경색,진행색, 두께 및 테두리로 선을 스타일링합니다. 포인트는 일반 점,아이콘, 이미지,숫자 또는 문자가 될 수 있으며 각각 크기,배경색, 포인트 색상 및 텍스트 그림자에 대한 기본,호버 및 집중 스타일이 있습니다. 그렇게 하면 방문자가 보고 있는 이정표가 나머지와 차별화됩니다.
- 선 배경, 진행 색상, 두께 및 테두리.
- 다섯 가지 포인트 유형: 점, 아이콘, 이미지, 숫자 또는 문자.
- 모든 지점에 대한 기본값, 호버 및 집중 상태입니다.
애니메이션이 포함된 카드 및 날짜 스타일링
카드는 패딩,여백, 콘텐츠 패딩,경계 반경 및 별도의 제목 및 콘텐츠 타이포그래피를 얻습니다. 색상,배경, 상자 그림자 및 텍스트 그림자는 기본,호버 및 집중 상태에서 변경될 수 있습니다. Animate 카드를 켜서 보기로 스크롤되는 각 카드를 표시합니다. 날짜에는 세 가지 상태 모두에 대해 고유한 타이포그래피,패딩, 여백,텍스트 그림자 및 색상이 있습니다.
- 카드 간격, 반경 및 타이포그래피 컨트롤.
- 카드 및 날짜에 대한 기본, 호버 및 집중 스타일.
- 항목을 스크롤하여 볼 때 항목을 표시하는 카드 애니메이션.
사용자 지정 타임라인 vs 포스트 타임라인
두 타임라인 유형을 비교하는 방법은 다음과 같습니다.
타임라인 예제
아래 뷰어는 16 개의 준비된 디자인을 가지고 있습니다. 그 중 어떤 것이라도 열어 라이브로 볼 수 있습니다.
- 회사 역사의 이정표.
- 릴리스 노트에 대한 다크 체인젤로그.
- 제품 단계에 대한 수평 로드맵.
- 날짜 순서에 게시물에 대한 게시물 타임 라인 블로그.
- 사진이 포함된 프로젝트 단계에 대한 사례 연구 이미지입니다.
- 프로세스를 위한 오버레이 단계.
- 일정에 따른 이벤트 일정입니다.
타임라인에 대해 자주 묻는 질문
Post Timeline 또는 Custom Timeline 을 사용해야 합니까?
우리의 기록 페이지나 로드맵처럼 모든 날짜와 항목을 제어하고 싶을 때 무료인 사용자 지정 타임라인을 사용하십시오. 뉴스 아카이브처럼 블로그 게시물에서 타임라인이 자체적으로 업데이트되어야 하는 경우 Master Addons Pro의 일부인 포스트 타임라인을 사용하십시오.
"집중" 상태는 어떻게 작동합니까?
Focused state 는 방문자가 타임라인을 스크롤하거나 캐러셀을 통해 이동할 때 현재 활성화된 항목을 스타일링합니다. 다른 카드 배경,날짜 색상 또는 더 큰 지점을 지정하여 현재 마일스톤이 눈에 띄게 합니다.
플러그인 없이 Elementor 에서 타임라인을 빌드할 수 있나요?
예,간단한 것입니다. 열에 컨테이너를 쌓고 각 줄에 왼쪽 테두리를 제공하고 점에 대해 절대 위치로 설정된 Position 으로 테두리에 Icon 위젯을 배치합니다. 교대 측면,수평 레이아웃 및 스크롤 애니메이션에는 사용자 정의 CSS 또는 타임 라인 위젯이 필요합니다.
Elementor 에서 가로 타임라인을 어떻게 추가하나요?
타임라인 위젯을 추가하고,사용자 지정 타임라인에서 타임라인 유형을 유지하고 타임라인 스타일을 가로 타임라인으로 설정합니다. 그런 다음 탐색에서 화살표나 점을 선택하고,캐러셀 설정에서 자동 재생 및 루프를 설정합니다.
Elementor 타임라인 위젯은 무료인가요?
예. 타임라인은 사용자 지정 타임라인 유형과 수직 및 수평 레이아웃을 모두 포함하는 무료 위젯입니다. 블로그 게시물에서 항목을 빌드하는 포스트 타임라인 유형에는 Master Addons Pro 가 필요합니다.
전체 타임라인 카드를 페이지에 연결할 수 있나요?
예. 각 사용자 지정 타임라인 항목에는 전체 카드를 클릭할 수 있게 만드는 링크 필드가 있습니다. 게시물 타임라인에는 각 카드를 해당 게시물에 연결하는 링크 활성화 스위치가 있습니다. 링크 내의 링크는 허용되지 않으므로 링크된 카드 내부의 다른 링크를 피하십시오.
타임 라인이 블로그 게시물을 자동으로 가져올 수 있습니까?
예, Master Addons Pro의 Post Timeline 유형을 사용하면 게시된 게시물을 읽고 순서, 게시물 수, 카테고리, 태그 또는 작성자 필터를 제어할 수 있습니다.
스크롤할 때까지 카드가 비어 있는 것처럼 보이는 이유는 무엇입니까?
Animate 카드가 켜져 있습니다. 각 카드는 보기 방향으로 스크롤될 때까지 숨겨져 있다가 슬라이드 인됩니다. 시작부터 모든 카드를 표시하려면 스타일 탭의 카드 섹션에서 Animate 카드를 끕니다.
트렌드 엘리먼트 위젯 및 확장
더 짧은 시간에 정교한 웹사이트를 구축하세요.
![Elementor용 마스터 애드온 게시물/페이지 복제기 확장: 랜딩 페이지를 생성하는 WordPress 페이지 목록의 MA 복제기 행 링크 - [복제된 #128] 초안](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/09/15102930/post-page-duplicator-768x403.webp)
