[워드프레스] Elegant Themes의 Divi 테마에서 포스트 슬라이더 사용하기

Divi 테마에서 포스트 슬라이더 사용하기

Elegant Themes의 Divi 테마에 내장된 Divi 빌더에서 포스트 슬라이더 모듈을 사용하면 별도의 플러그인 없이 다양한 효과의 포스트 슬라이더를 구현할 수 있습니다.

전체 너비 절(Full Width Section)에 포스트 슬라이더를 넣는 경우 "전체폭 게시물 슬라이더(Fullwidth Post Slider)" 모듈을 선택할 수 있습니다.

[워드프레스] Elegant Themes의 Divi 테마에서 포스트 슬라이더 사용하기 7

"전체폭 게시물 슬라이더"를 클릭하면 세부 옵션을 선택할 수 있는 화면이 표시됩니다.

[워드프레스] Elegant Themes의 Divi 테마에서 포스트 슬라이더 사용하기 8

포스트 개수, 카테고리 설정, 정렬 기준, 요약문 길이 등 다양한 옵션을 선택할 수 있습니다. 또, Featured Image(특성 이미지)를 배경으로 배치할 것인지 아니면 위/아래/왼쪽/오른쪽에 배치할 것인지도 선택이 가능합니다. 왼쪽에 배치하면 왼쪽에 썸네일이 표시되고 오른쪽에 제목과 요약문이 표시되는 형태로 표시됩니다.

[워드프레스] Elegant Themes의 Divi 테마에서 포스트 슬라이더 사용하기 9
특성 이미지 위치 설정

Parallax(패럴렉스) 효과를 사용할지 여부도 설정이 가능합니다. Parallax를 "시차효과"라고도 번역되어 있네요. 패럴렉스 기법은 CSS와 트루 패럴렉스 중에서 선택할 수 있습니다.

[워드프레스] Elegant Themes의 Divi 테마에서 포스트 슬라이더 사용하기 10

옵션을 설정한 후에 적용해보면 전체폭(Full width)으로 포스트 슬라이더가 표시됩니다.

[워드프레스] Elegant Themes의 Divi 테마에서 포스트 슬라이더 사용하기 11

표준 절(Standard Section)이나 특수 절(Specialty Section)에서는 "게시물 슬라이더" 모듈을 선택하면 됩니다.

[워드프레스] Elegant Themes의 Divi 테마에서 포스트 슬라이더 사용하기 12

세부 옵션은 전체폭 게시물 슬라이더와 비슷합니다.

자세한 설정은 다음 동영상을 참고해보시기 바랍니다. 영어로 설명하지만 이해하는 데 도움이 될 것입니다.

이 블로그에서는 인기 워드프레스 테마 중 하나인 Enfold 테마를 사용하고 있지만 포스트 슬라이더 기능이 없어서 Master Slider를 통해 포스트 슬라이더를 추가했습니다. Divi 테마의 Divi 빌더 내에서 제공하는 포스트 슬라이더는 다양한 설정이 가능하고 더 깔끔한 레이아웃을 보여주는 것 같습니다.

참고:


댓글 남기기

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