Rich Text Editor

O Editor de Rich Text é um elemento básico fundamental para introduzir o conteúdo textual no AEM. É a base de vários componentes, incluindo:

  • Texto
  • Imagem de texto
  • Tabela

Editor de Rich Text

A caixa de diálogo de edição WYSIWYG fornece uma grande variedade de funcionalidades:

cq55_rte_basicchars

OBSERVAÇÃO

Os recursos disponíveis podem ser configurados para projetos individuais, por isso podem variar de acordo com a sua instalação.

Edição no local

Além do diálogo com base no modo de Edição de Rich Text, o AEM também fornece o modo de edição local, o qual permite a edição direta do texto enquanto é exibido no layout da página.

Clique duas vezes em um parágrafo (um clique duplo lento) para entrar no modo de edição local (a borda do componente fica laranja).

Você poderá editar o texto diretamente na página, em vez de dentro de uma janela de diálogo. Basta fazer as alterações e elas serão salvas automaticamente.

cq55_rte_inlineediting

OBSERVAÇÃO

Se o localizador de conteúdo estiver aberto, uma barra de ferramentas com as opções de formatação do ERT será exibida na parte superior da guia (como mostrado acima).

A barra de ferramentas não será exibida se o localizador de conteúdo não estiver aberto.

No momento, o modo de Edição local está habilitado para elementos de página gerados pelos componentes de Texto e Título.

OBSERVAÇÃO

O componente Título foi projetado para conter um texto curto se quebras de linha. Ao editar um título no Modo de edição no local, inserir uma quebra de linha abrirá um novo componente de Texto abaixo do título.

Recursos do Editor de Rich Text

O Editor de Rich Text fornece vários recursos, esses dependem da configuração do componente individual. Os recursos estão disponíveis para a interface otimizada ao toque e clássica.

Formatos básicos de caracteres

Aqui, é possível aplicar a formatação aos caracteres selecionados (destacados); algumas opções também têm teclas de atalho:

  • Negrito (Ctrl+B)
  • Itálico (Ctrl+I)
  • Sublinhado (Ctrl+U)
  • Subscrito
  • Sobrescrito

cq55_rte_basicchars_use

Todos funcionam como uma alternância, assim, selecionar novamente removerá o formato.

Estilos e formatos pré-definidos

cq55_rte_stylesparágrafo

Sua instalação pode incluir estilos e formatos predefinidos. Estão disponíveis com as listas suspensas de estilo e formato e podem ser aplicados ao texto selecionado.

Um estilo pode ser aplicado a uma sequência específica (um estilo correlaciona-se com CSS):

cq55_rte_styles_use

Considerando que um formato é aplicado a todo o parágrafo do texto (um formato é baseado em HTML):

cq55_rte_parameter_use

Um formato específico pode ser apenas alterado (o padrão é Parágrafo).

Um estilo pode ser removido; coloque o cursor dentro do texto ao qual o estilo foi aplicado e clique no ícone para remover:

ATENÇÃO

Não selecione novamente nenhuma parte do texto ao qual o estilo foi aplicado ou, o ícone será desativado.

Cortar, copiar, colar

As funções padrão de recortar e copiar estão disponíveis. Vários tipos da função colar são fornecidos para atender a diferentes formatos.

  • Cortar (Ctrl-X)

  • Copiar (Ctrl-C)

  • Colar
    Este é o mecanismo de colagem padrão (Ctrl-V) para o componente; quando instalado e pronto, isso é configurado para ser Colar do Word.

  • Colar como texto: Remove todos os estilos e formatação para colar apenas o texto sem formatação.

  • Colar do Word: Isso cola o conteúdo como HTML (com alguma reformatação necessária).

Desfazer, refazer

O AEM mantém um registro de suas últimas 50 ações no componente atual, mantidas em ordem cronológica. Essas ações podem ser desfeitas (e, em seguida, refeitas), em ordem rigorosa, se necessário.

ATENÇÃO

O histórico é mantido somente para a sessão de edição atual. Ele é reiniciado sempre que você abrir o componente para edição.

OBSERVAÇÃO

Cinquenta é o número padrão de tarefas. Isso pode ser diferente para a sua instalação.

Alinhamento

O texto pode ser alinhado na esquerda, centralizado ou na direita.

cq55_rte_alignment_use

Recuo

O recuo de margem de um parágrafo pode ser aumentado ou diminuído. O parágrafo selecionado será recuado, qualquer novo texto inserido manterá o nível atual de recuo de margem.

cq55_rte_native_use

Listas

As listas com marcadores e numeradas podem ser criadas dentro do texto. Selecione o tipo de lista e comece a digitar ou destaque o texto a ser convertido. Em ambos os casos, um avanço de linha iniciará um novo item da lista.

Para listas aninhadas, recue um ou mais itens da lista.

Para alterar o estilo de uma lista, basta posicionar o cursor dentro da lista e, em seguida, selecionando o outro estilo. Uma sublista também pode ter um estilo diferente da lista que a contém. Isso pode ser aplicado quando a sublista tiver sido criada (por recuo).

cq55_rte_lista_use

Um link para um URL (dentro do seu site ou de um local externo) é gerado destacando o texto necessário e clicando no ícone de hiperlink:

Uma caixa de diálogo permitirá que você especifique a URL de destino; e se deve também ser aberta em uma nova janela.

cq55_rte_link_use

É possível:

  • Digite um URI diretamente
  • Usar o mapa do site para selecionar uma página dentro do site
  • Digite o URI e anexe a âncora do público alvo; por exemplo, www.TargetUri.org#AnchorName
  • Insira somente uma âncora (para fazer referência à "página atual"); Por exemplo, #anchor
  • Procure uma página no localizador de conteúdo e arraste e solte o ícone da página na caixa de diálogo Hiperlink
OBSERVAÇÃO

A URL pode ser anexada a quaisquer protocolos configurados para sua instalação. Em uma instalação padrão, eles são https://, ftp:// e mailto:. Os protocolos não configurados para sua instalação são rejeitados e marcados como inválidos.

Para quebrar o link, coloque o cursor em qualquer lugar no texto do link e clique no ícone Desvincular:

Âncoras

Uma âncora pode ser criada em qualquer lugar dentro do texto ao posicionar o cursor ou selecionar algum texto. Em seguida, clique no ícone âncora para abrir a caixa de diálogo.

Digite o nome da âncora, em seguida, clique em OK para salvar.

cq55_rte_anchor_use

A âncora é exibida quando o componente está sendo editado e agora pode ser usada dentro de um destino para os links.

chlimage_1-104

Localizar e substituir

O AEM fornece as funções Localizar e Substituir.

As funções tem um botão Localizar próximo para pesquisar o componente aberto para o texto especificado. Também é possível especificar caso precise que a letra (maiúscula/minúscula) coincida.

A pesquisa sempre iniciará da posição atual do cursor dentro do texto. Quando o final do componente for atingido uma mensagem vai informá-lo que a próxima operação de busca começará do início.

cq55_rte_find_use

A opção Substituir permite Localizar e Substituir uma instância individual por um texto especificado, ou Substituir todas as instâncias no componente atual.

cq55_rte_findreplace_use

Imagens

As imagens podem ser arrastadas do localizador de conteúdo para adicioná-las ao texto.

cq55_rte_image_use

OBSERVAÇÃO

O AEM também oferece componentes especializados para uma configuração mais detalhada da imagem. Os componentes Imagem e Imagem de texto, por exemplo, estão disponíveis.

Verificador ortográfico

O verificador ortográfico vai conferir todo o texto no componente atual.

Quaisquer erros de ortografia serão destacados:

cq55_rte_spellchecker_use

OBSERVAÇÃO

O verificador ortográfico operará no idioma do site utilizando a propriedade de idioma da subárvore ou extraindo o idioma do URL. Por exemplo, a ramificação en será verificada para inglês e a ramificação de para alemão.

Tabelas

As tabelas estão disponíveis:

  • Como o componente de Tabela

    chlimage_1-105

  • No componente Texto

    OBSERVAÇÃO

    Embora as tabelas estejam disponíveis no RTE, recomenda-se usar o componente Table ao criar tabelas.

Nos componentes Texto e Tabela a funcionalidade de tabela está disponível por meio do menu de contexto (normalmente, o botão direito do mouse) clicado na tabela; por exemplo:

cq55_rte_tablemenu

OBSERVAÇÃO

No componente Tabela, uma barra de ferramentas especializada também está disponível, incluindo várias funções do editor de rich text padrão juntamente com um subconjunto de funções específicas de tabela.

As funções específicas da tabela são:

Propriedades da tabela

cq55_rte_tableproperties_icon

As propriedades básicas da tabela podem ser configuradas antes de clicar em OK para salvar:

cq55_rte_tableproperties_dialog

  • Largura: A largura total da tabela.

  • Altura: A altura total da tabela.

  • Borda: O tamanho da borda da tabela.

  • Preenchimento da célula: Isso define o espaço em branco entre o conteúdo da célula e suas bordas.

  • Espaçamento da célula: Isso define a distância entre as células.

OBSERVAÇÃO

Algumas propriedades de células, como Largura e Altura, podem ser definidas como pixels ou porcentagens.

ATENÇÃO

O Adobe recomenda que você defina uma largura para a tabela.

Propriedades da célula

cq55_rte_cellproperties_icon

As propriedades de uma célula específica ou a série de células, podem ser configuradas:

cq55_rte_cellproperties_dialog

  • Largura
  • Altura
  • Alinhamento horizontal - Esquerda, Centro ou Direita
  • Alinhamento vertical - Parte superior, Meio, Parte inferior ou Linha de base
  • Tipo de célula - Dados ou cabeçalho
  • Aplicar a:célula única, linha inteira, coluna inteira

Adicionar ou excluir linhas

cq55_rte_lines

As linhas podem ser adicionadas acima ou abaixo da linha atual.

A linha atual também pode ser excluída.

Adicionar ou remover colunas

cq55_rte_columns

As colunas podem ser adicionadas à esquerda ou à direita da coluna atual.

A coluna atual também pode ser excluída.

Selecionar linhas ou colunas inteiras

chlimage_1-105

Seleciona toda a linha ou coluna atual. As ações específicas (por exemplo, mesclar) estarão, em seguida, disponíveis.

Mesclar células

cq55_rte_ cellmergecq55_rte_cellmerge-1

  • Caso tenha selecionado um grupo de células, você pode mesclá-las em uma.
  • Caso tenha apenas uma célula selecionada, então você pode mesclá-la com a célula à direita ou abaixo.

Dividir células

cq55_rte_cellsplit

Selecione uma única célula para dividi-la:

  • Dividir uma célula horizontalmente vai gerar uma nova célula à direita da célula atual, dentro da coluna atual.
  • Dividir uma célula verticalmente vai gerar uma nova célula abaixo da célula atual, mas dentro da linha atual.

Creating Nested Tables

chlimage_1-107

Criar uma tabela aninhada criará uma nova tabela autossuficiente, dentro da célula atual.

OBSERVAÇÃO

Certos comportamentos adicionais são dependentes de um navegador:

  • IE do Windows: usar o clique do botão do mouse principal + Ctrl (geralmente à esquerda) para selecionar várias células.
  • Firefox: Arraste o ponteiro para selecionar um intervalo de células.

Remove Table

cq55_rte_removetable

Use a opção para remover a tabela do componente Texto.

Caracteres especiais

Os caracteres especiais podem ser disponibilizados para o seu editor de rich text; podem variar de acordo com a sua instalação.

cq55_rte_specialchars_use

Usar o mouse sobre o caractere para visualizar uma versão ampliada do mesmo, em seguida, clicar para que seja incluído na posição atual em seu texto.

Modo de edição de fonte

O modo de edição da origem permite que você visualize e edite o HTML subjacente do componente.

Assim, o texto:

cq55_rte_sourcemode_1

Será como o modo de origem (muitas vezes a origem é muito longa, então será necessário usar a barra de rolagem):

cq55_rte_sourcemode_2

ATENÇÃO

Ao sair do modo de origem, o AEM fará certas verificações de validação (por exemplo, garantindo que o texto está corretamente contido/aninhado em blocos). Isso pode resultar em mudanças para as suas edições.

Nesta página