Editor do Wix Studio: adicionar e personalizar texto recolhível
4 min de leitura
Neste artigo
- Adicionar texto recolhível
- Ajustar o layout do texto recolhível
- Editar o texto recolhível
- Fazer o design da caixa de texto recolhível
O texto recolhível é uma ótima opção se você quiser exibir muitas informações. Partes do texto ficam ocultas e os visitantes podem visualizar o texto completo ao clicar em um botão de expansão ou em um link para o corpo completo do texto.
![Exemplo de um site online, ao clicar em um botão para expandir o texto recolhível na página](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/19/7c34f5ba-6783-4f79-8b3a-4c993a47be67/92bc1749-a662-4ea0-b107-43a250cd0042.gif)
Adicionar texto recolhível
Dependendo do que precisar, você pode adicionar diferentes estilos de texto recolhível à página. Algumas predefinições incluem um botão que expande o texto na página atual, outras mostram um link que leva os visitantes para outra página para ler o corpo completo do texto.
Para adicionar um texto recolhível:
- Clique em Elementos
no lado esquerdo do editor.
- Clique em Texto.
- Clique em Texto recolhível.
- Arraste a caixa de texto escolhida para a página.
![Uma captura de tela da aba Texto no painel Elementos, onde você pode encontrar o texto recolhível](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/19/085e446b-4281-44a5-b28f-bd88e73d8109/6dbf30ec-4273-42f7-9228-6b797dd262b0.png)
Ajustar o layout do texto recolhível
Escolha como os visitantes podem ler o corpo completo do texto. Adicione um botão que abre o texto completo na página atual ou um link que direciona os visitantes para o texto completo.
Você também pode definir o alinhamento, o espaçamento e o número de linhas que aparecem antes que um visitante precise clicar.
Para ajustar o layout do texto:
- Clique na caixa de texto recolhível.
- Clique no ícone Layout
.
- Personalize o layout usando as opções:
- Escolha como o texto aparece: escolha como todo o texto é exibido:
- Recolhido: os visitantes veem uma prévia de texto e precisam clicar em um botão ou link para ler o corpo completo do texto.
- Mostrar tudo: o texto inteiro é exibido na página, não recolhido.
- Número de linhas exibidas: escolha quantas linhas de texto mostrar antes que os visitantes precisem clicar em um botão para ver o resto.
- Botão Alinhar: alinhe à esquerda, à direita ou ao centro o botão em que os visitantes clicam para ler mais.
- Espaço entre texto e botão: aumente ou diminua o espaçamento entre o texto e o botão.
- Escolha como o texto aparece: escolha como todo o texto é exibido:
![Uma captura de tela do painel de layout do texto recolhível e as opções disponíveis](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/19/165f305c-66fb-4edf-bc48-4c7c04d3ea7b/de897860-4b95-4adb-bacf-54f8cbc39e87.png)
Editar o texto recolhível
Após adicionar uma caixa de texto recolhível, clique em Alterar texto para inserir o corpo completo do texto (até 120.000 caracteres). Você também pode editar o texto do botão ou link que permite que os visitantes leiam mais.
Para inserir ou editar o texto:
- Clique na caixa de texto recolhível.
- Clique em Alterar texto.
- Digite ou cole o texto completo em Alterar texto.
- Escolha a função do botão:
- Expandir: clicar no botão expande a caixa de texto na página atual para mostrar o texto inteiro.
- Link: clicar no botão redireciona os visitantes para outra página com o texto completo. Certifique-se de escolher o destino em Link para.
- Insira o texto que você quer que apareça no botão.
![Uma captura de tela do painel e das opções que aparecem ao clicar em Alterar texto em uma caixa de texto recolhível](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/19/70153a29-1618-4d0f-803a-6b877921c581/e8c4709d-642c-476b-8996-2f27188adc35.png)
Fazer o design da caixa de texto recolhível
Faça o design da caixa de texto recolhível para combinar com a estética da página. Você pode ajustar a aparência da própria caixa (por exemplo: a cor do background), formatar o texto e personalizar o botão/link que leva ao texto completo.
Para fazer o design da caixa de texto recolhível:
- Clique na caixa de texto recolhível.
- Clique na seta Abrir inspetor
no canto superior direito do editor.
- Role para baixo até Design.
- Escolha uma opção em O que você deseja criar?:
- Texto: personalize a caixa que contém o texto (por exemplo: cor do background, bordas, sombra), assim como o texto (fonte, tamanho e mais).
- Botão: personalize o link ou botão em que os visitantes clicam para visualizar o texto completo. Você pode ajustá-la em 3 estados diferentes - Normal, Interativo e Desativado.
Observação:
Atualmente, a opção de dimensionar o texto não está disponível para texto recolhível.
![Uma captura de tela mostrando as opções de design disponíveis para o texto recolhível no painel Inspetor](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2023/07/19/981ee6f3-d9b3-40f4-a2fb-760d9d096692/86e9ff33-3c2e-4d60-9bc9-2a87ed32a885.png)