Alguma vez você já percorreu uma página da Web longa, lutando para encontrar a informação exata de que precisava? É frustrante, não é? A solução está no conteúdo recolhível e expansível, que é uma maneira simples e eficaz de organizar as informações.
Essa técnica permite que você apresente conteúdo detalhado e, ao mesmo tempo, mantenha suas páginas limpas e fáceis de navegar. Sejam perguntas frequentes, descrições de produtos ou postagens de blog, as seções recolhíveis melhoram a usabilidade e o envolvimento.
A boa notícia? Você não precisa se aprofundar na codificação para implementá-la. Com o WordPress, ferramentas como o plug-in Ultimate Blocks tornam isso incrivelmente simples. O Ultimate Blocks, um plug-in projetado especificamente para usuários do Gutenberg, oferece recursos como o Alternância de conteúdo e Expandir blocos para permitir a criação de seções interativas e recolhíveis.
Método 1: Usando o plug-in Ultimate Blocks
Etapa 1: Instale o plug-in Ultimate Blocks
Navegue até o painel de controle do WordPress, vá para a seção "Plugins" seção e clique em "Adicionar novo". Tipo "Blocos definitivos" na barra de pesquisa, localize o plug-in nos resultados, clique em "Instalar agora" e depois "Ativar".
Etapa 2: Adicionar o bloco de alternância de conteúdo
Abra o post ou a página em que você deseja adicionar conteúdo dobrável. Clique no botão Ícone "+" no editor do WordPress para adicionar um novo bloco, procure por "Content Toggle" e selecione-o.
Depois de adicionar o bloco, você verá o bloco de alternância em posição, mas em um formato fechado. Clique no sinal de seta para expandi-lo e coloque o título de seu conteúdo no campo "Título do painel" e, posteriormente, o conteúdo principal no campo "Conteúdo do painel" caixa.
Agora, se você precisar de mais de uma seção expansível ou recolhível, clique no botão + botão na parte inferior do bloco para inserir uma nova alternância. Da mesma forma, se você não quiser nenhuma alternância específica, clique no botão x no final do bloco.
Etapa 3: Personalizar o bloco de alternância de conteúdo
Depois de selecionar o bloco, o painel de configurações do bloco aparecerá à direita do painel. Lá, você encontrará duas guias separadas: Configurações gerais e estilos.
No Configurações gerais você pode:
- Ajuste o Título do painel para uma hierarquia adequada.
- Defina o estado de alternância para controlar se os painéis devem ser recolhidos ou abertos quando a página for carregada.
- Ativar Esquema de perguntas frequentes para melhorar a visibilidade nos resultados dos mecanismos de pesquisa.
- Uso Controle responsivo para ocultar ou exibir o bloco em dispositivos específicos.
- Adicionar um Caixa de pesquisa para facilitar a navegação nas perguntas frequentes. No entanto, esse recurso é limitado aos usuários Pro.
Agora, se você mudar para o Guia EstilosNo site, você pode ajustar cores, ativar bordas, definir estilos e posições de ícones de alternância e ajustar o preenchimento e as margens.
Quando estiver satisfeito, clique em "Publish" (Publicar) ou "Update" (Atualizar) para torná-lo ativo.
Método 2: Usando o bloco de expansão
Etapa 1: Adicionar o bloco de expansão
Navegue até a página ou postagem em que deseja que o conteúdo seja dobrável/expansível. Clique no ícone "+" novamente para adicionar um novo bloco, procure por "Expand" e selecione-o.
Etapa 2: Adicionar conteúdo ao bloco
O bloco fornecerá duas seções: uma para o conteúdo visível (mostrado inicialmente) e outra para o conteúdo oculto (revelado quando clicado). Adicione o conteúdo que deseja que fique visível na primeira seção, acima do "Mostrar mais". Coloque o restante do conteúdo na seção oculta abaixo do texto "Mostrar mais" texto.
Clique no botão + sinal em cada bloco, selecione o bloco de sua preferência e, posteriormente, adicione conteúdo aos blocos. Você pode personalizar o bloco "Mostrar mais" e "Mostrar menos" textos para se adequar melhor ao seu conteúdo ou público. Basta clicar nos textos padrão e substituí-los pelos rótulos desejados.
Etapa 3: Personalizar o bloco de expansão
A versão gratuita oferece personalização limitada, incluindo configurações de rolagem, controle responsivo e ajustes de dimensão na guia Styles (Estilos). Mas, se você fizer upgrade para a versão profissional, poderá escolher um efeito de esmaecimento para o conteúdo minimizado (disponível em General Settings). Você também pode personalizar o estilo, a cor de fundo, a borda e o raio do botão para obter uma aparência mais refinada.
Quando estiver satisfeito com o resultado, clique em "Publish" (Publicar) ou "Update" (Atualizar) para salvar e exibir as alterações em seu site.
Conclusão
O objetivo deste artigo é orientá-lo na criação de conteúdo dobrável e expansível no WordPress, mantendo um layout limpo e fácil de navegar. Os Ultimate Blocks permitem que você faça isso sem a necessidade de codificação e com simplicidade, tanto em termos de usabilidade quanto de design. Compreender as necessidades do seu público é fundamental, pois ajuda a implementar o conteúdo recolhível onde ele oferece mais valor e garante que tudo funcione sem problemas para uma experiência de navegação ideal. Lembre-se de que pequenas mudanças como essas podem transformar a maneira como os visitantes interagem com seu site.
