> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://ajuda.kiwify.com.br/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Como editar a área de membros via código?

# O que é o Editor de Código da Área de Membros?

O Editor de Código é uma funcionalidade avançada que permite personalizar completamente o layout da sua Área de Membros na Kiwify, utilizando HTML, CSS e Liquid.
Diferente do editor padrão (que permite trocar cores, imagens, textos e organizar seções), o editor de código permite alterar diretamente os arquivos do tema, dando liberdade total para modificar a aparência e a experiência dos seus alunos.


### Como acessar o Editor de Código?

Ao acessar a área de membros, clique em **Personalizações&#32;**para abrir o editor padrão. Em seguida, clique no botão </> para abrir o Editor de Código.

![](https://storage.crisp.chat/users/helpdesk/website/-/b/c/e/d/bceda219e6714000/image_1qdp2pl.png =700x249)

Além disso, você pode selecionar uma seção específica e abrir o Editor de Código diretamente nessa seção: 
![](https://storage.crisp.chat/users/helpdesk/website/-/b/c/e/d/bceda219e6714000/image_z0r3w7.png =700x276)

### Para quem é indicado? 

O **Editor de Código** é ideal para produtores com conhecimento técnico ou que contam com o apoio de **programadores**. Ele é recomendado para quem precisa de maior liberdade de personalização, com um visual exclusivo e funcionalidades além do que o editor visual tradicional oferece.

Caso você queira apenas personalizar a sua área de membros com as funcionalidades que já existem, você pode seguir o passo a passo a seguir: [Como personalizar a área de membros completa](https://ajuda.kiwify.com.br/pt-br/article/como-personalizar-a-area-de-membros-li3lyj/).


### O que posso editar?

* **Estrutura da página (HTML):** permite reorganizar seções, criar novos blocos, alterar a disposição dos elementos.
* **Estilos (CSS):** possibilita ajustar cores, fontes, tamanhos e espaçamentos.
* **Conteúdo dinâmico (Liquid):** permite usar dados da plataforma para exibir conteúdos de forma condicional.

**Atenção:&#32;**Como você esta editando o tema diretamente via código, existe o risco de quebrar o layout da área de membros, tornar o conteúdo inacessível para os alunos ou gerar falhas na navegação. 
Mas, não se preocupe, pois se algo der errado, basta abrir o seletor de versões dentro do editor, escolher a versão original e tudo será revertido para o estado inicial.

![](https://storage.crisp.chat/users/helpdesk/website/-/b/c/e/d/bceda219e6714000/image_1cixsje.png =700x331)



### Limitações 

* **Não tem suporte para JavaScript**: qualquer script adicionado será salvo como texto e não será executado.
* **Não tem suporte para** **Iframe**: por questões de segurança, conteúdos de outros sites não podem ser embutidos.


### E como funciona no aplicativo da Kiwify?

Personalizações via código não são compatíveis com o aplicativo. Sempre que uma alteração no código for feita, a sincronização será desativada e, com isso, você poderá editar o layout do aplicativo de forma isolada ao da web. 
![](https://storage.crisp.chat/users/helpdesk/website/-/b/c/e/d/bceda219e6714000/image_1f2qpzx.png =700x273)


### Documentação técnica

Para entender como utilizar Liquid, HTML e CSS corretamente dentro do editor, acesse a [Documentação Técnica Oficial da Kiwify.](https://docs.kiwify.com.br/members-area/general)



# Perguntas Frequentes

###### Não sei programar. Posso usar mesmo assim?
Sim, mas é recomendável ter noções básicas de HTML e CSS. 
Para mudanças mais avançadas, recomendamos o apoio de um desenvolvedor.

###### Posso usar JavaScript ou iframe?
Não. Por questões de segurança, JavaScript e iframe são bloqueados.
Se você colar um desses códigos, eles serão salvos como texto e não funcionarão.

###### Onde fica o botão de restaurar?
Dentro do editor de código, no canto superior da tela.
Basta clicar em "Atual" e selecionar para qual versão você deseja retornar.