[워드프레스] Enfold 테마에서 포트폴리오를 사용하는 방법

Enfold 테마 포트폴리오 사용법

Enfold아바다, X 테마 다음으로 많이 판매되는 베스트 셀링 워드프레스 테마 중 하나입니다.

Enfold에는 포트폴리오(Portfolio)와 갤러리(Gallery) 등 다양한 기능이 기본적으로 탑재되어 있습니다. 포트폴리오를 구성하려면 알림판(대시보드)의 Portfolio Items에서 포트폴리오 항목을 추가할 수 있습니다. 사용법은 일반 포스트(글)를 작성하는 것과 유사합니다.

엔폴드 포트폴리오 항목

포트폴리오 항목을 추가했다면 엔폴드에서 사용되는 페이지 빌더인 Avia Layout Builder에서 포트폴리오를 추가할 수 있습니다.

엔폴드 포트폴리오 그리드 요소

그림과 같이 "Portfolio Grid" 컨텐츠 요소를 끌어다가 원하는 곳에 배치하도록 합니다.

엔폴드에서 요소 편집

위의 그림에서 Edit Element(요소 편집) 아이콘을 누르면 포트폴리오 그리드의 옵션을 지정할 수 있습니다.

portfolio-grid-edit

원하는 대로 구성하도록 합니다. 예를 들어, 컬럼 개수(열 개수)와 글 개수, Excerpt(요약문)과 Title(제목)을 표시할지 여부 등 다양한 옵션을 지정할 수 있습니다. 그러면 다음과 같이 페이지에 표시됩니다.

엔폴드 포트폴리오

테스트로 대강 만들어도 깔끔하게 표시되네요.

썸네일 사이에 공백(간격)을 추가하려면 어떻게 해야 하는지 문의하신 분이 계셨습니다. 참고로 Enfold 포트폴리오 그리드 요소 내에서는 padding(안쪽 여백), margin(여백) 등을 조정하는 옵션이 없습니다. 이런 작업은 CSS로 해 주어야 합니다.

가령 포트폴리오에서 썸네일 사이가 붙어 있는데, 조금 간격을 주고 싶다면 다음과 같은 CSS 코드를 사용할 수 있습니다.

#portfoliogrid article.main_color.inner-entry {
padding-right: 5px;
padding-left: 5px;
}

#portfoliogrid는 외부 컨테이너에 아이디를 지정한 것입니다. 적절히 지정하시면 됩니다. 위 코드를 테마의 스타일시트 파일에 추가하도록 합니다("워드프레스에서 CSS 추가하기" 참고).

위의 코드를 추가하여 포트폴리오 페이지를 새로고침하면 다음과 같이 간격이 추가됩니다.

엔폴드 포트폴리오

경우에 따라 각 포트폴리오 항목 사이에 테두리선이 있을 수 있습니다. 그런 경우에도 CSS로 조정해주시면 됩니다.

최근 들어 워드프레스 카페에서 엔폴드 테마를 사용하는 분을 많이 봅니다. Enfold는 깔끔하면서도 가벼운 느낌의 프리미엄 테마입니다.

Enfold의 경우 위에서처럼 CSS를 조금 알고 있어야 레이아웃 조정이 어느 정도 가능합니다. 만약 CSS나 코딩을 전혀 모르는 초보인 경우에는 Avada(아바다) 테마가 더 적당할 수 있습니다.

아바다 테마에서는 위와 같은 옵션(여백, 안쪽 여백 등)을 세밀하게 조정할 수 있습니다.

아바다에서는 패딩값, 마진값, 테두리 등의 레이아웃을 세밀하게 조정하는 옵션을 제공합니다.
아바다에서는 패딩값, 마진값, 테두리 등의 레이아웃을 세밀하게 조정하는 옵션을 제공합니다.

이상으로 엔폴드에서 포트폴리오를 설정하는 방법에 대해 살펴보았습니다.

참고:

Leave a Comment

프리미엄 테마 그래픽 동영상 템플릿 무료 다운로드