--- title: "Como esconder o rodapé no Mobile View" slug: "how-to-hide-footer-in-mobile-view" description: "When you have a detailed footer, it appears better only on large screens. In this case, the footer would not feel appealing on smaller screens. So you would want to remove the knowledge base footer in the mobile view for a better reader experience." tags: ["Knowledge base design", "Customization"] updated: 2026-06-22T08:58:57Z published: 2026-06-22T08:58:57Z canonical: "docs.document360.com/how-to-hide-footer-in-mobile-view" --- > ## Documentation Index > Fetch the complete documentation index at: https://docs.document360.com/llms.txt > Use this file to discover all available pages before exploring further. # Como esconder o rodapé no Mobile View Rodapés personalizados com múltiplas colunas, links e elementos de branding são projetados para telas de desktop largas. Em telas móveis estreitas, o mesmo rodapé pode parecer apertado, transbordar seu recipiente ou ocupar uma quantidade desproporcional de espaço, tudo isso prejudica a experiência de leitura. Esconder o rodapé no celular permite manter um rodapé rico na área de trabalho enquanto apresenta um layout limpo e desorganizado para os leitores em telas menores. > [!NOTE] > NOTA > > > > > Isso se aplica **apenas a rodapés personalizados**. Isso não afeta o rodapé padrão do Document360. Para informações sobre como configurar um rodapé personalizado, leia o artigo sobre [Rodapé personalizado](https://docs.document360.com/docs/pt/custom-footer). --- ## Quando usar isso Use essa personalização quando quiser: - Evite que um rodapé personalizado complexo e com várias colunas pareça quebrado ou apertado nas telas de celular. - Melhore a experiência de leitura no celular removendo conteúdos de rodapé que não são úteis ou acessíveis em telas pequenas. - Aplique um layout responsivo onde o rodapé seja visível no desktop, mas suprimido no celular. --- ## Antes de começar - Você precisa de acesso às **Configurações** ( ) > **Site da base de conhecimento** > **Personalização do site** > **CSS & JavaScript personalizados** no portal da base de conhecimento. - Um rodapé personalizado já deve estar configurado no seu site de base de conhecimento. Esse CSS esconde o rodapé no celular, não cria um. --- ## Como esconder o rodapé no visualizador móvel 1. Navegar até **Configurações** ( ) > **Site da base de conhecimento** > **Personalização do site** > **CSS & JavaScript personalizados** no portal da base de conhecimento. ![Custom CSS and JavaScript settings panel in the Document360 Knowledge base portal](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Custom%20css%20&%20js.png) 2. No painel de navegação à esquerda, selecione a aba **CSS** e cole o próximo trecho. Esconde o rodapé em telas até `767px` o largo (smartphones e tablets menores). ``` @media only screen and (max-width: 767px) {    site-footer-section {        display: none;    } } ``` 1. Clique **em Salvar** no canto superior direito. ![CSS tab showing the mobile footer hide snippet saved in the Custom CSS and JavaScript panel](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/image-1767005823666.png) --- ## Desfecho O rodapé está escondido nas telas dos celulares e continua exibido nas telas do desktop como de costume. ![Before and after comparison showing the knowledge base site footer hidden on mobile after applying the CSS](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/image-1767006022000.png) --- ## Melhores práticas - **Ajuste o ponto de quebra para combinar com seu layout, se necessário.** Se seu rodapé personalizado começar a parecer problemático em uma largura maior ou mais estreita que o padrão, mude o `max-width` valor no trecho. Por exemplo, também escondo `max-width: 1024px` o rodapé em tablets. - **Teste em um dispositivo real depois de salvar.** Ferramentas para desenvolvedores de navegador oferecem uma prévia móvel razoável, mas testes em um smartphone real confirmam que o rodapé desaparece no ponto de interrupção correto e o layout da página permanece correto. - **Considere o que você está escondendo.** Se seu rodapé personalizado contiver links importantes, como informações de contato, avisos legais ou links de apoio, certifique-se de que eles estejam acessíveis aos leitores móveis por outros meios, como o cabeçalho do site ou a navegação do artigo. - **Para reverter, apague o trecho.** Navegue de volta para a aba **CSS** em **CSS & JavaScript Personalizado**, remova o trecho e clique **em Salvar**. O rodapé reaparece imediatamente no celular.