AEM 6.4 chegou ao fim do suporte estendido e esta documentação não é mais atualizada. Para obter mais detalhes, consulte nossa períodos de assistência técnica. Encontre as versões compatíveis here.
Crie uma ClientLibraryFolder com o nome clientlibs
que conterão o JS e o CSS usados para renderizar as páginas do site.
O categories
o valor da propriedade dado a essa biblioteca do cliente é o identificador usado para incluir diretamente essa clientlib de uma página de conteúdo ou para incorporá-la a outras clientlibs.
Usando CRXDE Lite, expandir /etc/designs
Clique com o botão direito em an-scf-sandbox
e selecione Create Node
clientlibs
cq:ClientLibraryFolder
Clique em OK
No Propriedades para o novo clientlibs
, insira o categories
propriedade:
Observação: apresentando o valor das categorias como "aplicativos". é uma convenção para identificar o "aplicativo proprietário" como sendo da pasta /apps, não /libs. IMPORTANTE: Adicionar espaço reservado js.txt
e css.txt
arquivos. (Não é oficialmente uma cq:ClientLibraryFolder sem eles.)
Clique com o botão direito em /etc/designs/an-scf-sandbox/clientlibs
Selecionar Criar arquivo…
Enter Nome: css.txt
Selecionar Criar arquivo…
Enter Nome: js.txt
Clique em Salvar tudo
A primeira linha do css.txt e do js.txt identifica o local base do qual as listas de arquivos a seguir devem ser encontradas.
Tente definir o conteúdo de css.txt como:
#base=.
style.css
Em seguida, crie um arquivo em clientlibs chamado style.css e defina o conteúdo como:
body {
background-color: #b0c4de;
}
No Propriedades para o clientlibs
nó , insira a propriedade String de vários valores embed. Isso incorporará o bibliotecas do lado do cliente (clientlibs) para componentes SCF. Neste tutorial, adicionaremos várias clientlibs necessárias para os componentes das Comunidades.
Observação que essa pode ou não ser a abordagem desejada para usar em um site de produção, pois há considerações de conveniência versus tamanho/velocidade das clientlibs baixadas para cada página.
Se estiver usando apenas um recurso em uma página, você pode incluir a clientlib completa desse recurso diretamente na página, por exemplo, <% ui:includeClientLib categories=cq.social.hbs.forum" %>
Nesse caso, estamos incluindo todas elas, então preferiria as clientlibs do SCF mais básicas, que são as clientlibs do autor:
Nome: embed
Tipo: String
Clique em Multi
Valor: cq.social.scf
<enter> abrirá uma caixa de diálogo
Clique em [+]após cada entrada para adicionar as seguintes categorias clientlib:
cq.ckeditor
cq.social.author.hbs.comments
cq.social.author.hbs.forum
cq.social.author.hbs.rating
cq.social.author.hbs.reviews
cq.social.author.hbs.voting
Clique em Salvar tudo
É assim que /etc/designs/an-scf-sandbox/clientlibs
agora deve aparecer no repositório:
Sem incluir a variável apps.an-scf-sandbox
Categoria ClientLibraryFolder na página, os componentes do SCF não serão funcionais nem estilizados, pois os Javascript e o(s) estilo(s) necessários não estarão disponíveis.
Por exemplo, sem incluir as clientlibs, o componente de comentários do SCF aparece sem o estilo:
Uma vez que apps.an-scf-sandbox clientlibs é incluído, o componente SCF comments aparece no estilo :
A instrução include pertence ao <head>
da seção <html>
script. O padrão foundation head.jsp
inclui um script que pode ser sobreposto: headlibs.jsp
.
Copie headlibs.jsp e inclua clientlibs:
Usando CRXDE Lite, selecione /libs/foundation/components/page/headlibs.jsp
Clique com o botão direito do mouse e selecione Copiar (ou selecione Copiar na barra de ferramentas)
Selecionar /apps/an-scf-sandbox/components/playpage
Clique com o botão direito do mouse e selecione Colar (ou selecione Colar na barra de ferramentas)
Clique duas vezes em headlibs.jsp
para abri-lo
Anexe a seguinte linha ao final do arquivo
<ui:includeClientLib categories="apps.an-scf-sandbox"/>
Clique em Salvar tudo
<%@ page session="false" %><%
%><%@include file="/libs/foundation/global.jsp" %><%
%><ui:includeClientLib categories="cq.foundation-main"/><%
%>
<cq:include script="/libs/cq/cloudserviceconfigs/components/servicelibs/servicelibs.jsp"/>
<% currentDesign.writeCssIncludes(pageContext); %>
<ui:includeClientLib categories="apps.an-scf-sandbox"/>
Carregue seu site na Web no navegador e veja se o plano de fundo não é uma sombra de azul.
http://localhost:4502/content/an-scf-sandbox/en/play.html
Neste ponto, existe uma sandbox minimalista e pode valer a pena salvar como um pacote para que, durante a reprodução, se o seu repositório ficar corrompido e você desejar iniciar novamente, você possa desligar o servidor, renomear ou excluir a pasta crx-quickstart/, ligar o servidor, carregar e instalar esse pacote salvo e não precisar repetir essas etapas mais básicas.
Este pacote existe no Criar uma página de exemplo tutorial para aqueles que não podem esperar apenas para entrar e começar a jogar!..
Para criar um pacote:
De CRXDE Lite, clique no botão Ícone Pacote
Clique em Criar pacote
an-scf-sandbox-minimal-pkg
0.1
Clique em Editar
Selecionar Filtros guia
/apps/an-scf-sandbox
/etc/designs/an-scf-sandbox
/content/an-scf-sandbox
Clique em Salvar
Clique em Criar
Agora você pode selecionar Baixar para salvá-lo em disco e Fazer upload do pacote em outro lugar, bem como selecionar Mais > Replicar para enviar a sandbox para uma instância de publicação de host local, expanda o realm da sandbox.