# Como inserir um FAQ no editor por Componentes

Objetivo: Ensinar como inserir um FAQ na página.\
Para que serve: Com uma lista FAQ, é possível disponibilizar respostas de perguntas frequentes na sua página para os contatos que a acessarem.

### &#x20;Requisito Obrigatório:&#x20;

Ter uma página criada no Construtor por Componentes, o editor padrão da leadlovers.

## Como inserir o FAQ dentro do editor? <a href="#como-inserir" id="como-inserir"></a>

Nº1– Dentro do editor, selecione a opção “Lista FAQ”.

Nº2– Arraste o elemento até o local da sua página em que deseja inseri-lo.

<figure><img src="https://legado.leadlovers.site/wp-content/uploads/2022/02/img01.png" alt=""><figcaption></figcaption></figure>

Nº3– No pop-up que abrir, você deverá selecionar um modelo. As duas opções disponíveis são “Modelo 001” e “Modelo 002”.

<figure><img src="https://legado.leadlovers.site/wp-content/uploads/2022/02/img02.png" alt=""><figcaption></figcaption></figure>

Nas imagens abaixo, mostramos um preview de cada um deles.&#x20;

### “Modelo 001”:

<figure><img src="https://legado.leadlovers.site/wp-content/uploads/2022/02/img03.png" alt=""><figcaption></figcaption></figure>

### “Modelo 002”:

<figure><img src="https://legado.leadlovers.site/wp-content/uploads/2022/02/img04.png" alt=""><figcaption></figcaption></figure>

Ensinaremos a seguir quais são as edições possíveis de fazer em ambos os modelos.

### Modelo 001 <a href="#modelo-001" id="modelo-001"></a>

Nº4– No primeiro campo, escolha quantas colunas o seu FAQ deve ter. É possível dividir em até três.

Nº5– Defina aqui a cor de fundo do FAQ. Você pode deixá-la transparente, se assim desejar.

Nº6– Neste campo, escolha a cor da seção de cada pergunta.

Nº7– Você também pode alterar a cor do título de cada seção.&#x20;

Nº8– Por fim, é possível escolher a cor do texto das respostas.

Nº9– Caso queira retornar para o layout padrão, clique em “Resetar configurações do modelo”.

Nº10– Adicione um novo item clicando no botão que fica ao final do FAQ.

<figure><img src="https://legado.leadlovers.site/wp-content/uploads/2022/02/img05.png" alt=""><figcaption></figcaption></figure>

Nº11– Se quiser excluir uma seção, basta passar o mouse sobre ela e clicar no ícone de lixeira.

<figure><img src="https://legado.leadlovers.site/wp-content/uploads/2022/02/img06.png" alt=""><figcaption></figcaption></figure>

Nº12– Para alterar o conteúdo do título ou do texto de uma seção, clique sobre ele e edite-o. Caso queira fazer mais ajustes, selecione todo o texto que pretende alterar e escolha dentre as opções disponíveis:

![](https://legado.leadlovers.site/wp-content/uploads/2022/02/icon-negrito.png): Pressionando este botão, o texto selecionado ficará em negrito.

![](https://legado.leadlovers.site/wp-content/uploads/2022/02/icon-italico.png): Para deixá-lo em itálico, clique aqui.

![](https://legado.leadlovers.site/wp-content/uploads/2022/02/icon-link.png): Se quiser inserir um link em uma determinada parte do texto, selecione esta opção.&#x20;

![](https://legado.leadlovers.site/wp-content/uploads/2022/02/icon-desfazer.png): Utilize estes botões para desfazer ou refazer uma ação no texto.

Nº13– Veja aqui um preview de como seu FAQ está ficando.&#x20;

Nº14– Para salvar as alterações, clique em “Aplicar”.

<figure><img src="https://legado.leadlovers.site/wp-content/uploads/2022/02/img07.png" alt=""><figcaption></figcaption></figure>

Nº15– Depois que seu FAQ já estiver na sua página, clique sobre ele para habilitar o menu à direita. No primeiro botão, você poderá voltar para a sua edição.

Nº16– Nesta opção, é possível esconder o bloco de FAQ. Verifique [neste material como fazer esse procedimento.](https://central.ajudaleadlovers.com/paginas/construtores-leadlovers/construtor-de-paginas/como-esconder-elementos-no-construtor-por-componentes)

Nº17– Por fim, você pode ativar um identificador para esse bloco. Esta funcionalidade pode ser utilizada [para criar uma âncora na página](https://central.ajudaleadlovers.com/paginas/construtores-leadlovers/construtor-de-paginas/componentes-como-fazer-ancora-na-pagina), por exemplo.

<figure><img src="https://legado.leadlovers.site/wp-content/uploads/2022/02/img08.png" alt=""><figcaption></figcaption></figure>

Lembre-se de verificar em sua página final como o FAQ ficou e testar também se todas as seções estão abrindo corretamente para retornar e editá-lo, se necessário.

<figure><img src="https://legado.leadlovers.site/wp-content/uploads/2022/02/img09.png" alt=""><figcaption></figcaption></figure>

### Modelo 002 <a href="#modelo-002" id="modelo-002"></a>

Nº4– No primeiro campo, escolha quantas colunas o seu FAQ deve ter. É possível dividir em até três.

Nº5– Escolha a cor do título principal.

Nº6– Também é necessário selecionar uma cor para o subtítulo.

Nº7– Defina aqui a cor de fundo do seu FAQ. Você pode deixá-la transparente, se assim desejar.

Nº8– Altere neste campo a cor do título de cada seção.&#x20;

Nº9– Além disso, é possível escolher a cor do texto das respostas.

Nº10– Defina aqui a cor do botão que fica logo abaixo das perguntas.

Nº11– Por fim, selecione a cor do texto de dentro do botão.

Nº12– Caso queira retornar para o layout padrão, clique em “Resetar configurações do modelo”.

Nº13– Adicione um novo item clicando no botão que fica ao final do FAQ.

<figure><img src="https://legado.leadlovers.site/wp-content/uploads/2022/02/img10.png" alt=""><figcaption></figcaption></figure>

Nº14– Se quiser excluir uma seção, basta passar o mouse sobre ela e clicar no ícone de lixeira.

<figure><img src="https://legado.leadlovers.site/wp-content/uploads/2022/02/img11.png" alt=""><figcaption></figcaption></figure>

Nº15– Para alterar o conteúdo do título ou do texto de uma seção, clique sobre ele e edite-o. Caso queira fazer mais ajustes, selecione todo o texto que pretende alterar e escolha dentre as opções disponíveis:

![](https://legado.leadlovers.site/wp-content/uploads/2022/02/icon-negrito.png): Pressionando este botão, o texto selecionado ficará em negrito.

![](https://legado.leadlovers.site/wp-content/uploads/2022/02/icon-italico.png): Para deixá-lo em itálico, clique aqui.

![](https://legado.leadlovers.site/wp-content/uploads/2022/02/icon-link.png): Se quiser inserir um link em uma determinada parte do texto, selecione esta opção.&#x20;

![](https://legado.leadlovers.site/wp-content/uploads/2022/02/icon-desfazer.png): Utilize estes botões para desfazer ou refazer uma ação no texto.

<figure><img src="https://legado.leadlovers.site/wp-content/uploads/2022/02/img12.png" alt=""><figcaption></figcaption></figure>

Nº16– Para habilitar as edições do botão disponível nesse modelo de FAQ, dê um clique sobre o seu texto.

![](https://legado.leadlovers.site/wp-content/uploads/2022/02/icon-href.png): Essa informação será substituída pelo link que você inserir no botão.

![](https://legado.leadlovers.site/wp-content/uploads/2022/02/icon-editar.png): Para editar ou adicionar um link, clique no ícone de lápis.

![](https://legado.leadlovers.site/wp-content/uploads/2022/02/icon-link-1.png): Para removê-lo, selecione esta opção. Assim que fizer isso, o botão se tornará imediatamente um texto normal e não será possível inseri-lo novamente pela edição do FAQ.

Observação: Se clicar nesta opção sem querer, para desfazer basta utilizar o atalho CTRL + Z logo após a ação. Caso não funcione, será necessário remover a seção e adicionar uma nova. &#x20;

Nº17– Veja aqui um preview de como seu FAQ está ficando.&#x20;

Nº18– Para salvar as alterações, clique em “Aplicar”.

<figure><img src="https://legado.leadlovers.site/wp-content/uploads/2022/02/img13.png" alt=""><figcaption></figcaption></figure>

Nº19– Depois que seu FAQ estiver na sua página, clique sobre ele para habilitar o menu à direita. No primeiro botão, você poderá voltar para a sua edição.

Nº20– Nesta opção, é possível esconder o bloco de FAQ. Verifique [neste material](https://central.ajudaleadlovers.com/paginas/construtores-leadlovers/construtor-de-paginas/como-esconder-elementos-no-construtor-por-componentes) como fazer esse procedimento.

Nº21– Por fim, você pode ativar um identificador para esse bloco. Esta funcionalidade pode ser utilizada para criar uma âncora na página, por exemplo.

<figure><img src="https://legado.leadlovers.site/wp-content/uploads/2022/02/img14.png" alt=""><figcaption></figcaption></figure>

Lembre-se de verificar em sua página final como o FAQ ficou e testar também se todas as seções estão abrindo corretamente para retornar e editá-lo, se necessário.

<figure><img src="https://legado.leadlovers.site/wp-content/uploads/2022/02/img15.png" alt=""><figcaption></figcaption></figure>

**Suporte**

Se surgir qualquer dúvida ou situação, ou se precisar de qualquer ajuda durante este procedimento, por favor, **entre em contato com o nosso suporte**!
