본 문서는 Framer를 배우는 국내 사용자들이 한글 자료의 부족으로 겪는 어려움을 해결하고자, 공식 블로그의 내용을 한글로 번역하고 실무에 유용한 정보를 추가했습니다. 프레이머를 사용하는 여러분께 작게나마 도움이 되길 바랍니다.

웹사이트에 카테고리 페이지를 만들고 싶다면 여러 CMS 컬렉션을 결합하는 방법을 고려해 보세요. 이 방법을 사용하면 하나의 템플릿만으로도 현재 페이지에 맞춰 콘텐츠를 필터링할 수 있습니다.

CMS 설정

YouTube 채널 을 구독하세요

작동 방식을 이해하기 위해 달리기를 주제로 한 간단한 블로그를 예로 들어보겠습니다. 이 블로그에는 게시물 그리드, 게시물 상세 페이지, 작성자 페이지가 있고, 작성자 페이지에는 작성자의 약력과 작성자가 쓴 글이 표시됩니다.

이를 위해 두 개의 컬렉션이 필요합니다.

• articles : 게시물 정보를 담는 컬렉션

• authors : 작성자 정보를 담는 컬렉션

게시물에 작성자를 지정해 두면, 작성자 정보를 한 곳에서 업데이트할 수 있습니다.

또한 articles 컬렉션에서 작성자의 slug를 참조해, 이후 authors 컬렉션에서 해당 작성자의 데이터를 불러올 수 있습니다.

중첩 컬렉션

게시물 상세 페이지에 작성자 이름을 표시하려면 다른 컬렉션 안에 컬렉션을 중첩해야 합니다. 작성자의 slug를 기준으로 데이터를 필터링해 게시물 페이지에 표시할 수 있습니다. 이 방식은 게시물 페이지뿐 아니라 기사 페이지, 작성자 페이지 등 다른 모든 페이지에도 동일하게 활용할 수 있습니다.

컬렉션 결합의 이점

컬렉션을 결합하면 카테고리 페이지를 손쉽게 만들고, 현재 페이지 조건에 따라 콘텐츠를 필터링할 수 있습니다.
이 기술은 매우 효과적이며, 웹사이트에 템플릿과 카테고리를 설정할 때 시간을 절약할 수 있는 효율적인 방법입니다.

Stride 프로젝트로 연습하기 →

본 글은 Framer 공식 블로그의 ‘Combining multiple CMS collections for category pages’를 번역·각색한 콘텐츠입니다.