Criar Disposições de Conteúdo com o Oracle Content Management

Crie uma disposição de conteúdo para dispor os campos num item de conteúdo ao apresentar numa página do site. Quando um item de conteúdo é acrescentado a uma página, irá utilizar a disposição de conteúdo escolhida.

Um utilizador empresarial pode criar e utilizar itens de conteúdo com base nos tipos e disposições de conteúdo fornecidos por si enquanto programador. Pode criar novas disposições de conteúdo a partir da disposição por omissão. Múltiplas disposições de conteúdo associadas ao tipo de conteúdo permitem que o criador do site apresente os itens de conteúdo em diferentes contextos sem alterar o conteúdo.

Se utilizar uma disposição de conteúdo num componente de lista de conteúdos, a disposição de conteúdo é repetida uma vez por cada item de conteúdo. As disposições de conteúdo são então organizadas pela disposição da secção.

Pode exportar uma disposição de conteúdo para a modificar offline e, em seguida, importá-la para substituir a disposição de conteúdo existente.

Para criar uma disposição de conteúdo:

Na página principal do Oracle Content Management, clique em Programador na navegação lateral.
É apresentada a página Programador.
Clique em Visualizar todos os Componentes.
A partir do menu pendente Criar à direita, escolha Criar Disposição de Conteúdo.
Na caixa de diálogo Criar Disposição de Conteúdo, selecione os tipos de conteúdo que utilizarão a disposição, escolha os campos para apresentar e ative Acrescentar suporte para definições customizadas em utilização em Sites se pretender que os criadores de sites possam acrescentar definições customizadas e estilos acrescentando componentes da lista de conteúdo e item de conteúdo a uma página.
Forneça um nome e uma descrição para o seu componente de disposição de conteúdo e clique em Criar.

A disposição de conteúdo é acrescentada aos seus componentes.

Nota:
Só os caracteres alfanuméricos, hífenes e caracteres de sublinhado são válidos em títulos de disposição de conteúdo.
Para exportar a disposição do conteúdo para edição, selecione-a e, em seguida, clique em Exportar no menu do botão direito do rato ou clique em na barra de ações.
1. Navegue para uma pasta existente ou selecione Criar, em seguida, Pasta para criar uma nova pasta e forneça um nome e, opcionalmente, uma descrição.
2. Selecione a caixa de seleção junto à pasta e clique em OK.
3. Clique no ícone ou nome da pasta para abri-la.
Um ficheiro do pacote da disposição é criado na pasta selecionada com o nome da disposição de conteúdo e uma extensão .zip. Descarregue o ficheiro para o seu ambiente de desenvolvimento para editar os ficheiros.

Estes ficheiros controlam a disposição dos campos nos itens de conteúdo que utilizam a disposição de conteúdo Employee-Card. Se tiver ativado Acrescentar suporte para definições customizadas em utilização em Sites, um ficheiro adicional denominado settings.html também é criado, o que fornece uma composição por omissão de um único item de conteúdo para que possa ser apresentado.

Descrição da ilustração GUID-1B7C7C81-7057-4E9C-B98C-C982CC483961-default.png

Edite os ficheiros design.css, layout.html e render.js para obter a disposição de conteúdo que pretende.

Por exemplo, os ficheiros seguintes especificam a disposição de conteúdo Employee-Card:

Edite o ficheiro design.css:

.scs-tile-layout {
    font-family: 'Helvetica Neue', 'Segoe UI', sans-serif-regular, Helvetica, Arial;
    font-size: 16px;
    margin: 0px;
    padding: 0px;
    font-style: normal;
    color: #333;
}

.scs-tile-layout li {
    list-style: none;
    font-size: 14px;
    font-style: normal;
    font-variant-caps: normal;
    font-weight: 200;
    margin: 0px;
}

.scs-tile-layout-img-container {
    height: 150px;
    width: 100px;
    float: left;
    margin: 0em 0.5em 0em 0em;
    padding: 0px;
    border-radius: 3px;
    overflow: hidden;
    position: relative;
}

.scs-tile-layout-img {
    position: absolute;
    left: -100%;
    right: -100%;
    top: -100%;
    bottom: -100%;
    margin: auto;
    height: 100%;
    min-width: 100%;
}

.scs-tile-layout p {
    margin: 0px;
}

Edite o ficheiro layout.html:

{{#data.employee_profile_pictureURL}}
<div class="scs-tile-layout-img-container">
    <img class="scs-tile-layout-img" src="{{data.employee_profile_pictureURL}}" />
</div>
{{/data.employee_profile_pictureURL}}
<ul class="scs-tile-layout">
    <li>
        <p><b>{{name}}</b></p>
    </li>
    <li>&nbsp;</li>
    <li>
        <p>{{data.employee_job_title}}</p>
        <p>{{data.employee_location}}</p>
        <p><b>Phone: </b>{{data.employee_phone}}</p>
    </li>
    {{#scsData.detailPageLink}}
    <li>
        <a href="{{scsData.detailPageLink}}" title="Go to detail page"><span class="detail-page">Profile</span></a>
    </li>
    {{/scsData.detailPageLink}}
</ul>

Edite o ficheiro render.js:

/* globals define */

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

    function ContentLayout(params) {
        this.contentItemData = params.contentItemData || {};
        this.scsData = params.scsData;
        this.contentClient = params.contentClient || (params.scsData ? params.scsData.contentClient : null);
        // retrieve the custom settings
        this.customSettiings = this.scsData.customSettingsData
        || {};
    }

    ContentLayout.prototype = {

        render: function(parentObj) {
            var template,
                content = $.extend({}, this.contentItemData),
                contentClient = this.contentClient,
                contentType,
                secureContent = false;

            if (this.scsData) {
                content = $.extend(content, { 'scsData': this.scsData });
                contentType = content.scsData.showPublishedContent === true ? 'published' : 'draft';
                secureContent = content.scsData.secureContent;
            }

            if (contentClient) {
                var params = {
                    'itemGUID': typeof content.data.employee_profile_picture === 'string' ?
                        content.data.employee_profile_picture : content.data.employee_profile_picture.id,
                    'contentType': contentType,
                    'secureContent': secureContent
                };
                content.data.employee_profile_pictureURL = contentClient.getRenditionURL(params);
            }

            console.log(content);

            try {
                // Mustache
                template = Mustache.render(templateHtml, content);

                if (template) {
                    $(parentObj).append(template);
                }
            } catch (e) {
                console.error(e.stack);
            }
        }
    };

    return ContentLayout;
});

Para obter informações sobre a edição do render.js e de outros ficheiros, consulte Desenvolver Componentes.

Importe os seus ficheiros modificados para substituir a disposição de conteúdo existente.
1. Na página principal, clique em Documentos.
2. Carregue a disposição de conteúdo modificada para uma pasta, num ficheiro com uma extensão .zip, que inclui os mesmos nomes da pasta e ficheiros que exportou.
  Se pretender importá-la como uma nova disposição de conteúdo, necessita de alterar a GUID da disposição de conteúdo em _folder.json.
3. Na página principal, clique em Programador.
  É apresentada a página Programador.
4. Clique em Visualizar todos os Componentes.
5. A partir do menu Criar, escolha Importar Componente.
6. Selecione a caixa de seleção junto ao ficheiro comprimido carregado que contém o componente modificado e clique em OK.
A sua disposição de conteúdo modificada é importada para Componentes.

Pode também exportar uma disposição de conteúdo para a copiar ou deslocar para outra instância do Oracle Content Management e importá-la ali.