콘텐츠 레이아웃 개발

콘텐츠 레이아웃을 사용하여 사용자는 사이트 페이지에서 사용된 콘텐츠 목록 또는 콘텐츠 위치 표시자 구성요소를 통해 콘텐츠 항목의 데이터를 볼 수 있습니다. 콘텐츠 유형에 대해 여러 콘텐츠 레이아웃을 생성하여 다양한 뷰를 생성하거나 콘텐츠 항목의 다른 부분을 나타낼 수 있습니다.

예를 들어, Blog-Post 콘텐츠 유형은 Blog-Bost 콘텐츠가 사용될 방법과 위치에 따라 다른 콘텐츠 레이아웃이 필요할 수 있습니다. 사이트의 홈 페이지는 Blog-Post 항목의 목록을 표시할 수 있지만, 홈 페이지에서 블로그 게시물을 누르면 세부정보 페이지에 해당 블로그 게시물에 대한 세부정보가 표시될 수 있습니다.

홈 페이지에 구성된 콘텐츠 목록은 Blog-Post-Summary 콘텐츠 레이아웃을 항목 뷰로 사용하여 Blog-Post 콘텐츠 유형의 항목을 나열합니다.

세부정보 페이지는 콘텐츠 위치 표시자에 Blog-Post-Header 콘텐츠 레이아웃을 사용하여 헤더 이미지 및 제목을 보여줍니다. 2열 섹션 레이아웃은 Blog-Post-Content 및 Blog-Post-Author 콘텐츠 레이아웃을 사용하여 두 개의 콘텐츠 위치 표시자를 70% 대 30% 너비로 묶습니다. 보시다시피, 4개의 다른 콘텐츠 레이아웃이 동일한 콘텐츠 유형 시각화에 사용됩니다.

다음 두 가지 방법 중 하나로 콘텐츠 레이아웃을 생성할 수 있습니다.

Oracle Content Management에서 개발자 > 모든 구성요소 보기 > 생성 > 콘텐츠 레이아웃 생성을 선택합니다.
OCE Toolkit 프로젝트에서 cec create-contentlayout 명령을 사용합니다.

Oracle Content Management는 콘텐츠 유형에 대한 기본 콘텐츠 레이아웃을 생성합니다. 기본 콘텐츠 레이아웃을 수정하려면 다음 파일을 편집할 수 있습니다.

assets/layout.html

이 파일을 편집하여 HTML 뷰를 변경합니다.
assets/design.css

이 파일을 편집하여 콘텐츠 레이아웃을 스타일링합니다.
assets/render.js

이 파일을 편집하여 layout.html에서 사용된 데이터를 변경하거나 콘텐츠 레이아웃에 동적 동작을 추가합니다.

콘텐츠 레이아웃 구성요소는 Oracle Content Management 서버에서 콘텐츠 항목을 렌더링합니다. 대부분의 자산은 Oracle Content Management 서버에 저장됩니다. 때때로 스타일링 목적의 배경 이미지와 같이 콘텐츠 레이아웃 자체에서 로컬로 제공되는 정적 자산을 사용하려는 경우가 있습니다. 예를 들어, 다음 콘텐츠 레이아웃에서 images/background.jpg의 절대 URL을 render.js에 생성하고 layout.html에서 사용할 수 있습니다.

절대 URL을 생성하는 가장 쉬운 방법은 내장 requirejs 파일을 사용하는 것입니다. 다음 코드와 같이 'require'를 종속성으로 정의하고 require.toURL()을 사용하여 URL을 생성합니다.

define([
    'require',
    'jquery',
    'mustache',
    'text!./layout.html',
    'css!./design.css'
], function (require, $, Mustache, templateHtml, css) {
    'use strict';

   var imageURL = req.toUrl('./images/background.jpg');

다음 항목은 콘텐츠 레이아웃을 개발하는 방법을 설명합니다.