{"id":1657,"date":"2026-05-08T19:36:22","date_gmt":"2026-05-08T19:36:22","guid":{"rendered":"https:\/\/uhost.com.br\/temav6\/?p=1657"},"modified":"2026-05-08T19:36:22","modified_gmt":"2026-05-08T19:36:22","slug":"paginas-criar-e-gerenciar-paginas-com-blocos-de-conteudo","status":"publish","type":"post","link":"https:\/\/uhost.com.br\/temav6\/paginas-criar-e-gerenciar-paginas-com-blocos-de-conteudo\/","title":{"rendered":"P\u00e1ginas \u2013 Criar e Gerenciar P\u00e1ginas com Blocos de Conte\u00fado"},"content":{"rendered":"<h2>O que \u00e9 a se\u00e7\u00e3o P\u00e1ginas?<\/h2>\n<p>A se\u00e7\u00e3o <strong>P\u00e1ginas<\/strong> (<code>?page=pages<\/code>) permite criar e gerenciar p\u00e1ginas est\u00e1ticas do site, como &#8220;Sobre n\u00f3s&#8221;, &#8220;Contato&#8221;, &#8220;Quem somos&#8221; e qualquer outra p\u00e1gina personalizada. Cada p\u00e1gina \u00e9 constru\u00edda com um editor de blocos visual, sem necessidade de conhecimento t\u00e9cnico.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/uhost.com.br\/temav6\/wp-content\/uploads\/2026\/05\/paginas-lista-paginas.jpg\" alt=\"Lista de P\u00e1ginas\" style=\"max-width:100%;border:1px solid #ddd;border-radius:8px;margin:16px 0;\" \/><\/p>\n<h2>Lista de P\u00e1ginas<\/h2>\n<p>A tela principal exibe todas as p\u00e1ginas cadastradas com as seguintes informa\u00e7\u00f5es:<\/p>\n<ul>\n<li><strong>T\u00edtulo<\/strong>: Nome da p\u00e1gina, acompanhado de uma miniatura da imagem de capa.<\/li>\n<li><strong>Slug (URL)<\/strong>: Endere\u00e7o amig\u00e1vel da p\u00e1gina (ex.: <code>\/sobre-nos<\/code>), com bot\u00e3o para abrir a p\u00e1gina no site.<\/li>\n<li><strong>Status<\/strong>: Indica se a p\u00e1gina est\u00e1 <em>Publicada<\/em> ou salva como <em>Rascunho<\/em>.<\/li>\n<li><strong>Data<\/strong>: Data de cria\u00e7\u00e3o da p\u00e1gina.<\/li>\n<li><strong>A\u00e7\u00f5es<\/strong>: Bot\u00f5es de editar (l\u00e1pis) e excluir (lixeira).<\/li>\n<\/ul>\n<p>Filtros dispon\u00edveis na parte superior: <strong>Todas<\/strong>, <strong>Publicadas<\/strong> e <strong>Rascunhos<\/strong>, al\u00e9m de um campo de busca por t\u00edtulo.<\/p>\n<h2>Criar uma Nova P\u00e1gina<\/h2>\n<p>Clique no bot\u00e3o <strong>+ Adicionar Nova<\/strong> para abrir o editor de p\u00e1gina. O editor \u00e9 dividido em duas \u00e1reas principais: o painel de <strong>Blocos da P\u00e1gina<\/strong> (esquerda) e o painel de <strong>Configura\u00e7\u00f5es da P\u00e1gina<\/strong> (direita).<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/uhost.com.br\/temav6\/wp-content\/uploads\/2026\/05\/paginas-nova-pagina-editor.jpg\" alt=\"Editor de Nova P\u00e1gina\" style=\"max-width:100%;border:1px solid #ddd;border-radius:8px;margin:16px 0;\" \/><\/p>\n<h2>Configura\u00e7\u00f5es da P\u00e1gina (painel direito)<\/h2>\n<p>No painel lateral direito, preencha as informa\u00e7\u00f5es gerais da p\u00e1gina:<\/p>\n<ul>\n<li><strong>T\u00edtulo<\/strong>: Nome principal da p\u00e1gina (obrigat\u00f3rio).<\/li>\n<li><strong>URL (autom\u00e1tica)<\/strong>: O slug da p\u00e1gina \u00e9 gerado automaticamente a partir do t\u00edtulo, mas pode ser editado manualmente.<\/li>\n<li><strong>Status<\/strong>: Escolha entre <em>Publicada<\/em> (vis\u00edvel no site) ou <em>Rascunho<\/em> (salvo sem publicar).<\/li>\n<li><strong>Imagem de Capa<\/strong>: Fa\u00e7a upload de uma imagem de destaque para a p\u00e1gina. Tamanho recomendado: <strong>1920x600px<\/strong>.<\/li>\n<\/ul>\n<p><img decoding=\"async\" src=\"https:\/\/uhost.com.br\/temav6\/wp-content\/uploads\/2026\/05\/paginas-configuracoes-seo.jpg\" alt=\"Configura\u00e7\u00f5es e SEO da P\u00e1gina\" style=\"max-width:100%;border:1px solid #ddd;border-radius:8px;margin:16px 0;\" \/><\/p>\n<h2>Se\u00e7\u00e3o SEO<\/h2>\n<p>Abaixo da imagem de capa, ha\u00e1 uma se\u00e7\u00e3o <strong>SEO<\/strong> que pode ser expandida clicando sobre ela. Nela voc\u00ea preenche:<\/p>\n<ul>\n<li><strong>T\u00edtulo SEO<\/strong>: T\u00edtulo que aparecer\u00e1 nos resultados de busca do Google.<\/li>\n<li><strong>Descri\u00e7\u00e3o SEO<\/strong>: Resumo da p\u00e1gina exibido abaixo do t\u00edtulo nos buscadores.<\/li>\n<\/ul>\n<h2>Editor de Blocos<\/h2>\n<p>O conte\u00fado da p\u00e1gina \u00e9 montado atrav\u00e9s de <strong>blocos<\/strong>. Clique no bot\u00e3o <strong>+ Adicionar Bloco<\/strong> para abrir o seletor e escolher o tipo de bloco desejado.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/uhost.com.br\/temav6\/wp-content\/uploads\/2026\/05\/paginas-tipos-blocos.jpg\" alt=\"Tipos de Blocos Dispon\u00edveis\" style=\"max-width:100%;border:1px solid #ddd;border-radius:8px;margin:16px 0;\" \/><\/p>\n<p>Os 7 tipos de blocos dispon\u00edveis s\u00e3o:<\/p>\n<ul>\n<li><strong>Texto Rico<\/strong>: Editor de texto com formata\u00e7\u00e3o completa (negrito, it\u00e1lico, sublinhado, listas, links, alinhamento e estilos de par\u00e1grafo).<\/li>\n<li><strong>Imagem<\/strong>: Insere uma imagem com upload direto.<\/li>\n<li><strong>V\u00eddeo<\/strong>: Incorpora um v\u00eddeo do YouTube ou Vimeo pela URL.<\/li>\n<li><strong>Call to Action<\/strong>: Bloco de destaque com t\u00edtulo, texto de apoio e bot\u00e3o de a\u00e7\u00e3o.<\/li>\n<li><strong>Divisor<\/strong>: Linha horizontal para separar se\u00e7\u00f5es do conte\u00fado.<\/li>\n<li><strong>Formul\u00e1rio<\/strong>: Incorpora um formul\u00e1rio de contato na p\u00e1gina.<\/li>\n<li><strong>Bot\u00e3o<\/strong>: Adiciona um bot\u00e3o com texto, link, abertura (mesma aba ou nova aba) e alinhamento configur\u00e1veis.<\/li>\n<\/ul>\n<h2>Bloco Texto Rico<\/h2>\n<p>O bloco <strong>Texto Rico<\/strong> oferece uma barra de formata\u00e7\u00e3o completa na parte superior, com op\u00e7\u00f5es de <strong>negrito<\/strong>, <em>it\u00e1lico<\/em>, sublinhado, estilo de par\u00e1grafo (Normal, T\u00edtulo H1\u2013H4), listas numeradas, listas com marcadores, inser\u00e7\u00e3o de links, alinhamento do texto e limpeza de formata\u00e7\u00e3o.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/uhost.com.br\/temav6\/wp-content\/uploads\/2026\/05\/paginas-bloco-texto-rico.jpg\" alt=\"Bloco Texto Rico com Barra de Formata\u00e7\u00e3o\" style=\"max-width:100%;border:1px solid #ddd;border-radius:8px;margin:16px 0;\" \/><\/p>\n<h2>Bloco Call to Action<\/h2>\n<p>O bloco <strong>Call to Action<\/strong> cria uma se\u00e7\u00e3o de destaque com fundo colorido contendo: <strong>T\u00edtulo do CTA<\/strong>, <strong>Texto de apoio<\/strong>, <strong>Texto do bot\u00e3o<\/strong>, <strong>URL do bot\u00e3o<\/strong> e op\u00e7\u00e3o de abrir em mesma aba ou nova aba. \u00c9 ideal para chamadas de a\u00e7\u00e3o como &#8220;Fale conosco&#8221; ou &#8220;Saiba mais&#8221;.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/uhost.com.br\/temav6\/wp-content\/uploads\/2026\/05\/paginas-bloco-cta.jpg\" alt=\"Bloco Call to Action em modo preview\" style=\"max-width:100%;border:1px solid #ddd;border-radius:8px;margin:16px 0;\" \/><\/p>\n<h2>Bloco Bot\u00e3o<\/h2>\n<p>O bloco <strong>Bot\u00e3o<\/strong> adiciona um bot\u00e3o simples \u00e0 p\u00e1gina. Os campos configur\u00e1veis s\u00e3o: <strong>Texto<\/strong> (r\u00f3tulo exibido), <strong>URL<\/strong> (link de destino), <strong>Abrir<\/strong> (mesma aba ou nova aba) e <strong>Alinhar<\/strong> (esquerda, centro ou direita). O sistema exibe um preview visual em tempo real do bot\u00e3o com as cores do tema.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/uhost.com.br\/temav6\/wp-content\/uploads\/2026\/05\/paginas-bloco-botao.jpg\" alt=\"Bloco Bot\u00e3o com campos e preview\" style=\"max-width:100%;border:1px solid #ddd;border-radius:8px;margin:16px 0;\" \/><\/p>\n<h2>Exemplo de P\u00e1gina Completa<\/h2>\n<p>Abaixo vemos um exemplo de p\u00e1gina j\u00e1 constru\u00edda (&#8220;Sobre n\u00f3s&#8221;) com m\u00faltiplos blocos combinados: Texto Rico com conte\u00fado, Imagem, Bot\u00e3o (&#8220;Entre em contato&#8221;) e um V\u00eddeo do YouTube incorporado. O painel direito mostra a imagem de capa j\u00e1 carregada e o slug definido como <code>\/sobre-nos<\/code>.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/uhost.com.br\/temav6\/wp-content\/uploads\/2026\/05\/paginas-editar-pagina-exemplo.jpg\" alt=\"Exemplo de p\u00e1gina completa Sobre N\u00f3s\" style=\"max-width:100%;border:1px solid #ddd;border-radius:8px;margin:16px 0;\" \/><\/p>\n<h2>Gerenciamento dos Blocos<\/h2>\n<p>Cada bloco adicionado possui tr\u00eas bot\u00f5es de controle no canto superior direito do bloco:<\/p>\n<ul>\n<li><strong>Olho (Ocultar\/Exibir)<\/strong>: Alterna entre a visualiza\u00e7\u00e3o do bloco em modo preview ou modo de edi\u00e7\u00e3o.<\/li>\n<li><strong>C\u00f3pia (Duplicar)<\/strong>: Cria uma c\u00f3pia exata do bloco abaixo do original.<\/li>\n<li><strong>Lixeira (Excluir)<\/strong>: Remove permanentemente o bloco da p\u00e1gina.<\/li>\n<\/ul>\n<p>A ordem dos blocos pode ser alterada arrastando o \u00edcone de grade (<strong>\u22ee\u22ee<\/strong>) no canto esquerdo de cada bloco.<\/p>\n<h2>Publicar ou Salvar como Rascunho<\/h2>\n<p>Ap\u00f3s montar o conte\u00fado da p\u00e1gina, clique em <strong>Publicar<\/strong> (bot\u00e3o laranja no topo) para tornar a p\u00e1gina vis\u00edvel no site. Se quiser salvar sem publicar, altere o campo <strong>Status<\/strong> para <em>Rascunho<\/em> antes de salvar. Ao editar uma p\u00e1gina existente, o bot\u00e3o se chama <strong>Atualizar<\/strong>, e h\u00e1 tamb\u00e9m um bot\u00e3o de <strong>Preview<\/strong> para visualizar a p\u00e1gina antes de publicar.<\/p>\n<h2>Dicas importantes<\/h2>\n<ul>\n<li>A URL da p\u00e1gina \u00e9 gerada automaticamente com base no t\u00edtulo, mas pode ser editada manualmente no campo URL do painel direito.<\/li>\n<li>A imagem de capa recomendada tem dimens\u00f5es de <strong>1920x600px<\/strong> para melhor apresenta\u00e7\u00e3o no site.<\/li>\n<li>Use o campo <strong>T\u00edtulo SEO<\/strong> e <strong>Descri\u00e7\u00e3o SEO<\/strong> para otimizar a p\u00e1gina para mecanismos de busca.<\/li>\n<li>Combine diferentes tipos de blocos para criar p\u00e1ginas ricas: texto + imagem + v\u00eddeo + bot\u00f5es.<\/li>\n<li>Blocos podem ser reordenados arrastando pelo \u00edcone de grade na lateral esquerda de cada bloco.<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>O que \u00e9 a se\u00e7\u00e3o P\u00e1ginas? A se\u00e7\u00e3o P\u00e1ginas (?page=pages) permite criar e gerenciar p\u00e1ginas est\u00e1ticas do site, como &#8220;Sobre n\u00f3s&#8221;, &#8220;Contato&#8221;, &#8220;Quem somos&#8221; e qualquer outra p\u00e1gina personalizada. Cada p\u00e1gina \u00e9 constru\u00edda com um editor de blocos visual, sem necessidade de conhecimento t\u00e9cnico. Lista de P\u00e1ginas A tela principal exibe todas as p\u00e1ginas cadastradas com as seguintes informa\u00e7\u00f5es: T\u00edtulo: Nome da p\u00e1gina, acompanhado de uma miniatura da imagem de capa. Slug (URL): Endere\u00e7o amig\u00e1vel da p\u00e1gina (ex.: \/sobre-nos), com bot\u00e3o para abrir a p\u00e1gina no site. Status: Indica se a p\u00e1gina est\u00e1 Publicada ou salva como Rascunho. Data: Data de cria\u00e7\u00e3o da p\u00e1gina. A\u00e7\u00f5es: Bot\u00f5es de editar (l\u00e1pis) e excluir (lixeira). Filtros dispon\u00edveis na parte superior: Todas, Publicadas e Rascunhos, al\u00e9m de um campo de busca por t\u00edtulo. Criar uma Nova P\u00e1gina Clique no bot\u00e3o + Adicionar Nova para abrir o editor de p\u00e1gina. O editor \u00e9 dividido em duas \u00e1reas principais: o painel de Blocos da P\u00e1gina (esquerda) e o painel de Configura\u00e7\u00f5es da P\u00e1gina (direita). Configura\u00e7\u00f5es da P\u00e1gina (painel direito) No painel lateral direito, preencha as informa\u00e7\u00f5es gerais da p\u00e1gina: T\u00edtulo: Nome principal da p\u00e1gina (obrigat\u00f3rio). URL (autom\u00e1tica): O slug da p\u00e1gina \u00e9 gerado automaticamente a partir do t\u00edtulo, mas pode ser editado manualmente. Status: Escolha entre Publicada (vis\u00edvel no site) ou Rascunho (salvo sem publicar). Imagem de Capa: Fa\u00e7a upload de uma imagem de destaque para a p\u00e1gina. Tamanho recomendado: 1920x600px. Se\u00e7\u00e3o SEO Abaixo da imagem de capa, ha\u00e1 uma se\u00e7\u00e3o SEO que pode ser expandida clicando sobre ela. Nela voc\u00ea preenche: T\u00edtulo SEO: T\u00edtulo que aparecer\u00e1 nos resultados de busca do Google. Descri\u00e7\u00e3o SEO: Resumo da p\u00e1gina exibido abaixo do t\u00edtulo nos buscadores. Editor de Blocos O conte\u00fado da p\u00e1gina \u00e9 montado atrav\u00e9s de blocos. Clique no bot\u00e3o + Adicionar Bloco para abrir o seletor e escolher o tipo de bloco desejado. Os 7 tipos de blocos dispon\u00edveis s\u00e3o: Texto Rico: Editor de texto com formata\u00e7\u00e3o completa (negrito, it\u00e1lico, sublinhado, listas, links, alinhamento e estilos de par\u00e1grafo). Imagem: Insere uma imagem com upload direto. V\u00eddeo: Incorpora um v\u00eddeo do YouTube ou Vimeo pela URL. Call to Action: Bloco de destaque com t\u00edtulo, texto de apoio e bot\u00e3o de a\u00e7\u00e3o. Divisor: Linha horizontal para separar se\u00e7\u00f5es do conte\u00fado. Formul\u00e1rio: Incorpora um formul\u00e1rio de contato na p\u00e1gina. Bot\u00e3o: Adiciona um bot\u00e3o com texto, link, abertura (mesma aba ou nova aba) e alinhamento configur\u00e1veis. Bloco Texto Rico O bloco Texto Rico oferece uma barra de formata\u00e7\u00e3o completa na parte superior, com op\u00e7\u00f5es de negrito, it\u00e1lico, sublinhado, estilo de par\u00e1grafo (Normal, T\u00edtulo H1\u2013H4), listas numeradas, listas com marcadores, inser\u00e7\u00e3o de links, alinhamento do texto e limpeza de formata\u00e7\u00e3o. Bloco Call to Action O bloco Call to Action cria uma se\u00e7\u00e3o de destaque com fundo colorido contendo: T\u00edtulo do CTA, Texto de apoio, Texto do bot\u00e3o, URL do bot\u00e3o e op\u00e7\u00e3o de abrir em mesma aba ou nova aba. \u00c9 ideal para chamadas de a\u00e7\u00e3o como &#8220;Fale conosco&#8221; ou &#8220;Saiba mais&#8221;. Bloco Bot\u00e3o O bloco Bot\u00e3o adiciona um bot\u00e3o simples \u00e0 p\u00e1gina. Os campos configur\u00e1veis s\u00e3o: Texto (r\u00f3tulo exibido), URL (link de destino), Abrir (mesma aba ou nova aba) e Alinhar (esquerda, centro ou direita). O sistema exibe um preview visual em tempo real do bot\u00e3o com as cores do tema. Exemplo de P\u00e1gina Completa Abaixo vemos um exemplo de p\u00e1gina j\u00e1 constru\u00edda (&#8220;Sobre n\u00f3s&#8221;) com m\u00faltiplos blocos combinados: Texto Rico com conte\u00fado, Imagem, Bot\u00e3o (&#8220;Entre em contato&#8221;) e um V\u00eddeo do YouTube incorporado. O painel direito mostra a imagem de capa j\u00e1 carregada e o slug definido como \/sobre-nos. Gerenciamento dos Blocos Cada bloco adicionado possui tr\u00eas bot\u00f5es de controle no canto superior direito do bloco: Olho (Ocultar\/Exibir): Alterna entre a visualiza\u00e7\u00e3o do bloco em modo preview ou modo de edi\u00e7\u00e3o. C\u00f3pia (Duplicar): Cria uma c\u00f3pia exata do bloco abaixo do original. Lixeira (Excluir): Remove permanentemente o bloco da p\u00e1gina. A ordem dos blocos pode ser alterada arrastando o \u00edcone de grade (\u22ee\u22ee) no canto esquerdo de cada bloco. Publicar ou Salvar como Rascunho Ap\u00f3s montar o conte\u00fado da p\u00e1gina, clique em Publicar (bot\u00e3o laranja no topo) para tornar a p\u00e1gina vis\u00edvel no site. Se quiser salvar sem publicar, altere o campo Status para Rascunho antes de salvar. Ao editar uma p\u00e1gina existente, o bot\u00e3o se chama Atualizar, e h\u00e1 tamb\u00e9m um bot\u00e3o de Preview para visualizar a p\u00e1gina antes de publicar. Dicas importantes A URL da p\u00e1gina \u00e9 gerada automaticamente com base no t\u00edtulo, mas pode ser editada manualmente no campo URL do painel direito. A imagem de capa recomendada tem dimens\u00f5es de 1920x600px para melhor apresenta\u00e7\u00e3o no site. Use o campo T\u00edtulo SEO e Descri\u00e7\u00e3o SEO para otimizar a p\u00e1gina para mecanismos de busca. Combine diferentes tipos de blocos para criar p\u00e1ginas ricas: texto + imagem + v\u00eddeo + bot\u00f5es. Blocos podem ser reordenados arrastando pelo \u00edcone de grade na lateral esquerda de cada bloco.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-1657","post","type-post","status-publish","format-standard","hentry","category-v6"],"_links":{"self":[{"href":"https:\/\/uhost.com.br\/temav6\/wp-json\/wp\/v2\/posts\/1657","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/uhost.com.br\/temav6\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/uhost.com.br\/temav6\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/uhost.com.br\/temav6\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/uhost.com.br\/temav6\/wp-json\/wp\/v2\/comments?post=1657"}],"version-history":[{"count":1,"href":"https:\/\/uhost.com.br\/temav6\/wp-json\/wp\/v2\/posts\/1657\/revisions"}],"predecessor-version":[{"id":1658,"href":"https:\/\/uhost.com.br\/temav6\/wp-json\/wp\/v2\/posts\/1657\/revisions\/1658"}],"wp:attachment":[{"href":"https:\/\/uhost.com.br\/temav6\/wp-json\/wp\/v2\/media?parent=1657"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/uhost.com.br\/temav6\/wp-json\/wp\/v2\/categories?post=1657"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/uhost.com.br\/temav6\/wp-json\/wp\/v2\/tags?post=1657"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}