Imagens com Texto

Você pode usar o componente de imagem e texto que combina os componentes de um parágrafo e uma imagem em um só componente fácil de usar.

  1. Navegue até a página que deseja editar e verifique se Controle de edição está definido como Editar.
  2. Adicione o componente à página.
  3. Clique na área de parágrafo do componente para adicionar texto. Todo o texto assume o formato do estilo padrão do componente. Pressione Enter para adicionar mais linhas de texto.
  4. Se você quiser alterar a formatação padrão de qualquer parte do texto, selecione o texto que deseja formatar e escolha qualquer uma das opções na barra de ferramentas de formatação, como fonte, cor ou alinhamento.
  5. Para remover a formatação aplicada com estas opções, selecione o texto e clique em Ícone Remover Formatação.
  6. Para editar o componente e sua aparência, clique em seu ícone de menu Ícone Menu do Componente e escolha Definições.
  7. Escolha Componentes para definir os detalhes sobre o conteúdo que é exibido.

    • Imagem:

      • Clique em Selecionar para usar uma imagem. Selecione uma imagem do repositório de sites, uma imagem da pasta de documentos que foi compartilhada com você ou faça upload de uma imagem para uma pasta de documentos. Localize e selecione a imagem que deseja usar. Caso você não veja qualquer ativo digital, clique em ícone Filtro de ativos e altere o filtro de coleção para Todos. Se você tiver selecionado uma imagem de uma pasta de documentos, poderá vinculá-la ao arquivo em vez de copiá-la para o site. Para vincular ao arquivo, selecione Usar uma referência ao arquivo original em vez de copiar o arquivo para o site. Se você não selecionar essa opção, uma cópia do arquivo será armazenada com o site e referenciada nele. Um link para o arquivo original evita duplicar o conteúdo. O link permite que os visitantes do site vejam o conteúdo mesmo que as permissões no arquivo sejam alteradas, ou então restringiria a visualização. Clique em OK. Se você tiver selecionado um ativo digital, poderá selecionar uma renderização específica. Se você não selecionar uma renderização, o tamanho original será utilizado. Se você quiser que a versão mais recente do ativo seja publicada quando o site for publicado, selecione Usar a versão mais recente do ativo.

        Para editar a imagem, clique em Ícone Editar e edite a imagem com qualquer uma das seguintes ações:

        • Para cortar a imagem, clique em Ícone Cortar Cortar. Selecione uma das proporções de imagem predefinidas na barra de ferramentas de corte ou arraste os controles de corte na imagem conforme desejar. Quando estiver satisfeito, na barra de ferramentas de corte, clique em Cortar.
        • Para girar ou rotacionar a imagem, clique em Ícone Girar Girar. Na barra de ferramentas de rotação, digite um grau de rotação personalizado, use os botões para girar a imagem para a esquerda ou para a direita, ou então selecione se a imagem será girada horizontalmente ou verticalmente.
        • Para adicionar uma marca d'água à imagem, clique em Ícone de Marca d'água Marca d'água. Adicione texto à imagem, alterando o tamanho, estilo, cor e opacidade do texto conforme desejado com as ferramentas de marca d'água.
        • Para alterar o formato da imagem, clique em Ícone Opções Opções; em seguida, selecione um novo formato na lista drop-down Formato.
        • Para alterar a cor do plano de fundo, clique em Ícone Opções Opções; em seguida, selecione uma opção no menu drop-down Cor do Plano de Fundo.
        • Se estiver editando um arquivo .jpg ou .webp (disponível nos browsers Google Chrome), você poderá alterar a qualidade da imagem para criar um arquivo de tamanho menor. Clique em Ícone Opções Opções, depois insira o novo percentual na caixa Qualidade.
        • Para desfazer ou refazer sua alteração, clique em Ícone Desfazer ou Ícone Refazer. Para remover todas as alterações feitas, clique em Redefinir.
        • Para alterar a ampliação da imagem, use os controles de zoom (Controle de zoom).

      • Título: informe o texto que você gostaria de exibir em uma dica de ferramenta.

      • Texto Alternativo: informe o texto alternativo que será exibido para fins de acessibilidade.

      • Legenda: informe uma legenda que aparecerá sob a imagem.

      • Alinhamento, Largura e Espaçamento: altere o layout da imagem conforme necessário.

    • Parágrafo: altere o espaçamento do texto.

  8. Use a guia Geral para modificar espaçamento, alinhamento e outras opções de apresentação do componente.
  9. Use a guia Estilo para adicionar formatação em volta do texto e personalizar a cor do plano de fundo, as fontes e as bordas.