Quer saber como visualizar seu site WordPress antes de colocá-lo no ar?
Depois de atualizar seu website, a última coisa que você quer é clicar em publicar e perceber que algo não está certo. É por isso que é importante visualizar suas alterações antes de entrar no ar.
Neste artigo, mostraremos a você como visualizar seu site WordPress e garantir que tudo funcione corretamente antes de colocá-lo no ar para o público.
Antes de começarmos, vamos ver por que é essencial verificar as alterações do seu site antes de divulgá-las aos visitantes do site.
Por que você deve visualizar seu site antes de publicá-lo
Antes de publicar qualquer alteração no WordPress, é importante verificá-la. Isso permite que você procure por problemas de design, problemas de plug-in e até mesmo erros de ortografia e gramática.
A visualização prévia do seu site WordPress também permite que você veja se ele é exibido corretamente em dispositivos móveis. Se isso não acontecer, você corre o risco de perder tráfego, leads e vendas valiosos.
O mesmo se aplica a desenvolvedores e web designers. Em algum momento, você precisará de uma maneira fácil de fornecer aos clientes uma prévia do site antes de colocá-lo no ar. Dessa forma, eles poderão avaliar seu trabalho, solicitar alterações e, finalmente, aprovar o projeto.
Então, como você visualiza as alterações no WordPress antes de publicá-las? Continue lendo para descobrir.
Como visualizar seu site WordPress antes de colocá-lo no ar
Abaixo, compartilhamos várias maneiras de visualizar um site WordPress antes de colocá-lo no ar. Algumas usam os recursos padrão do WordPress, enquanto outras exigem a ajuda de um plug-in do WordPress e de um provedor de hospedagem do WordPress.
- 1. Visualizar publicações e páginas com o editor do WordPress
- 2. Visualizar um tema do WordPress com o Live Preview
- 3. Visualização de configurações e widgets com o Live Customizer
- 4. Visualizar páginas de destino do WordPress com o SeedProd
- 5. Visualize seu tema do WordPress com o SeedProd
- 6. Visualização do trabalho de desenvolvimento com ambientes de preparação
- 7. Permita que os clientes visualizem o site antes de colocá-lo no ar
Dito isso, começaremos com a solução mais fácil primeiro. Vamos nos aprofundar.
1. Visualizar publicações e páginas com o editor do WordPress
O WordPress tem muitos recursos úteis que são fáceis de não serem percebidos pelo usuário comum, mesmo que estejam bem na sua frente. Um deles é a configuração de visualização do site.
Quando estiver criando ou atualizando um novo post ou página no WordPress, não vá direto para o botão Publicar. Em vez disso, selecione o link Visualizar na parte superior do editor do WordPress.
Ao clicar nesse link, você poderá visualizar o conteúdo do WordPress:
- Desktop
- Tablet
- Celular
Você pode até mesmo visualizar seu site WordPress em uma nova guia do navegador.
Se não estiver satisfeito com as alterações, você pode clicar no botão Desfazer na barra de ferramentas.
Ou você pode clicar na opção Revisões no painel direito para comparar diferentes versões do seu conteúdo.
A partir daí, você pode restaurar uma versão anterior e clicar em publicar.
Essas opções do WordPress são inestimáveis quando você sabe onde elas estão. Mas, como mencionamos anteriormente, elas nem sempre são óbvias de imediato.
2. Visualizar um tema do WordPress com o Live Preview
Às vezes, não é o conteúdo que você deseja alterar no WordPress, mas todo o tema do WordPress. Pode ser que seu tema atual esteja desatualizado ou que você queira um novo visual para seu site.
Seja qual for o motivo, você precisará de uma maneira de visualizar seu novo tema do WordPress antes de ativá-lo em seu site. Caso contrário, será difícil saber se o design tem a aparência e funciona adequadamente com seu conteúdo específico e as configurações do WordPress.
Para visualizar um tema no WordPress, navegue até Appearance " Themes na área de administração do WordPress. Isso mostrará todos os temas que você tem instalados no momento.
Para ver a aparência de um tema diferente, passe o mouse sobre a miniatura do tema e clique no botão Live Preview.
Em seguida, o WordPress abrirá uma visualização do seu site como ele ficaria com o novo tema.
A partir daí, você pode examinar as diferentes configurações do tema (falaremos mais sobre isso posteriormente) e clicar no botão Activate & Publish para ativar o tema em seu site.
Se não gostar da visualização, você sempre poderá clicar no botão Alterar no painel esquerdo.
Isso permite que você escolha um tema diferente para visualizar entre todos os temas instalados em seu site.
Como alternativa, você pode clicar na opção WordPress.org para ver centenas de temas gratuitos do WordPress disponíveis no repositório de temas do WordPress.
Dentro desse painel, você pode instalar qualquer tema e seguir as etapas acima para visualizá-lo em seu site.
3. Visualização de configurações e widgets com o Live Customizer
Digamos que você esteja satisfeito com o tema do WordPress, mas queira alterar algumas coisas para tornar o site mais fácil de usar. Talvez você queira adicionar alguns widgets à barra lateral ou mostrar somente as publicações do blog na página inicial.
Normalmente, você precisaria alterar manualmente essas configurações acessando Configurações " Leitura no painel do WordPress.
Ou Appearance " Widgets para adicionar widgets à sua barra lateral.
Mas há uma maneira mais fácil de alterar essas configurações e ver uma prévia de suas alterações em tempo real. É o chamado WordPress Customizer.
Você pode acessar o Customizer de qualquer lugar do seu site WordPress. Se estiver visualizando a parte frontal do seu site, basta clicar em Personalizar na barra de ferramentas superior.
E se você estiver no back-end do seu site, poderá navegar até Appearance " Customize.
Depois de clicar na opção Personalizar, a versão atual do seu site será aberta em uma nova tela.
No painel esquerdo estão todas as diferentes configurações do site, incluindo:
- Identidade do site
- Aparência
- Cabeçalho
- Menus
- Widgets
- Configurações da página inicial
- CSS adicional
- E mais
E, à direita, há uma visualização ao vivo de seu site. Você pode ver todas as alterações feitas nas configurações do site em sua visualização em tempo real.
Por exemplo, para adicionar um novo widget ao seu site, clique no título Widgets e escolha uma barra lateral à qual adicionar seu widget.
Em seguida, clique no botão Add a Widget para escolher entre os widgets disponíveis em seu site.
Depois de clicar para escolher um widget, ele aparecerá instantaneamente no painel de widgets e na visualização do site.
Todo esse processo permite que você personalize e visualize seu site WordPress antes de publicar as alterações e entrar no ar. Lembre-se apenas de clicar em Publicar quando estiver satisfeito com a aparência de tudo.
4. Visualizar páginas de destino do WordPress com o SeedProd
Muitos proprietários de sites querem aumentar os leads e as vendas de seus negócios. E a melhor maneira de fazer isso é com uma ótima estratégia de marketing digital e páginas de destino de alta conversão.
No entanto, muitos plug-ins de página de destino não oferecem uma maneira fácil de visualizar seus designs antes de colocá-los no ar. Ou, se oferecem, não têm recursos essenciais, como visualizações móveis e edição ao vivo.
Se você quiser criar páginas de destino bem-sucedidas no WordPress e ver facilmente uma demonstração instantânea ao vivo, sugerimos usar o SeedProd.
O SeedProd é o melhor construtor de páginas de destino do WordPress com funcionalidade de criação de temas, em breve e em modo de manutenção. Seu construtor de páginas de arrastar e soltar permite que você crie qualquer página de destino sem contratar um desenvolvedor.
Com vários modelos de página de destino multiuso, você pode começar a trabalhar rapidamente. E você pode personalizar cada elemento da página para obter o máximo de leads para sua empresa.
O SeedProd tem tudo o que você precisa para criar páginas de destino de alto desempenho, incluindo:
- Construtor de arrastar e soltar com visualização ao vivo
- Vários blocos de formulários, como formulários de contato, formulários de opt-in e formulários de login.
- Blocos de prova social, como controles deslizantes de depoimentos, classificações por estrelas e compartilhamento de mídia social
- Temporizadores de contagem regressiva e barras de progresso para criar urgência
- Seções de página inteligentes, como perguntas frequentes, cabeçalhos, CTA, rodapés e áreas de recursos
- Opções fáceis de personalização de cores, fontes e planos de fundo
- Integração com os principais serviços de marketing por e-mail
- Mapeamento de domínio personalizado para qualquer página de destino
- Integração de SEO e Google Analytics
- Visualizações ao vivo para desktop e dispositivos móveis
- E muito mais.
Siga este guia para saber como criar uma página de destino com o SeedProd.
Quando terminar de criar sua página de destino, clique no ícone Mobile Preview (Visualização móvel ) na parte inferior da tela.
Isso abre uma demonstração ao vivo de sua landing page no celular. A partir daí, você pode visualizar a versão móvel da sua landing page e fazer alterações até que ela tenha a aparência desejada.
Para voltar à visualização da área de trabalho, basta clicar no mesmo ícone.
Você também pode visualizar toda a sua landing page em uma nova guia do navegador. Primeiro, clique no botão verde Save (Salvar ) para armazenar suas alterações mais recentes e, em seguida, clique no botão Preview (Visualizar ).
A visualização da sua landing page será aberta em uma nova guia para que você possa ver como ela está.
5. Visualize seu tema do WordPress com o SeedProd
Além de criar páginas de destino, o SeedProd também inclui um poderoso construtor de temas do WordPress. Ele usa a mesma funcionalidade de arrastar e soltar do construtor de páginas, permitindo que você crie temas personalizados do WordPress sem escrever código ou contratar um desenvolvedor.
Isso também significa que você não precisará fazer upload e instalar arquivos de temas do WordPress separados: você pode fazer tudo isso com um plano SeedProd Pro.
Você pode criar todas as partes que compõem o layout de um tema do WordPress com o SeedProd. Basta escolher um modelo de tema predefinido na biblioteca.
Em seguida, você pode editar as condições de exibição e as partes do tema para atender às necessidades do seu site.
A partir daí, você pode personalizar cada seção do seu tema no editor visual, como fez com a sua página de destino.
Quando estiver satisfeito com o design e o layout do seu tema, você poderá visualizar o visual no visualizador de sites para celular e desktop do SeedProd.
Assim como o construtor de páginas, você pode desativar a visibilidade de diferentes elementos para layouts móveis e de desktop.
6. Visualização do trabalho de desenvolvimento com ambientes de preparação
Os métodos acima são uma ótima maneira de visualizar pequenas alterações em seu site WordPress. Mas se estiver planejando algumas atualizações importantes ou trabalhando em um projeto de desenvolvimento para um cliente, precisará de algo um pouco mais avançado.
Nessa situação, sugerimos o uso de um site de teste, também conhecido como site de desenvolvimento.
Um site de teste é um clone do site ativo em que você está trabalhando. Ele permite testar quaisquer novas alterações em um ambiente seguro antes de publicá-las em seu site de produção (site ativo).
Muitos hosts da Web oferecem ambientes de preparação e produção como parte de seus pacotes de hospedagem. A opção mais popular é a Bluehost.
O Bluehost é o melhor provedor de hospedagem gerenciada para WordPress do mercado e é oficialmente recomendado pelo WordPress.org. Ele oferece uma ampla variedade de planos de hospedagem para iniciantes e empresas de médio a grande porte com suporte ao cliente 24 horas por dia, 7 dias por semana.
Todos os planos de hospedagem WordPress gerenciada da Bluehost também oferecem ambientes de teste integrados, para que você possa testar novos recursos antes de colocá-los em seu site ativo. Confira esta análise da Bluehost para saber todos os detalhes sobre por que ela é a melhor opção para sites WordPress em crescimento.
Agora, vamos dar uma olhada em como configurar um ambiente de teste com a Bluehost.
Primeiro, faça login na área de administração do seu site WordPress e navegue até Bluehost " Staging. Isso o levará a uma tela que explica o que é um site de teste e o URL do seu site de produção.
Para criar seu ambiente de teste, clique no botão Create Staging Site (Criar site de teste ).
Em seguida, a Bluehost preparará o ambiente de teste para o seu site. Quando terminar, será exibida uma tela com a opção de visitar o site de preparação ou de produção.
Clique na opção Staging Site (Site de teste) para acessar a área de administração de seu site de teste do WordPress. Você verá um botão vermelho na parte superior da barra de administração para mostrar que está trabalhando em um ambiente de teste.
Agora, você pode continuar trabalhando no seu site sem se preocupar se isso afetará o site ativo.
Quando estiver pronto para publicar suas alterações no site ativo, clique na seta para baixo ao lado do botão Deploy All Changes (Implantar todas as alterações ).
Você verá três opções de implementação:
- Implantar todas as alterações
- Implantar somente arquivos
- Implantar banco de dados
Se não tiver certeza, clique no botão Deploy All Changes (Implantar todas as alterações ) para enviar todas as alterações do ambiente de preparação para o site ativo do WordPress.
7. Permita que os clientes visualizem o site antes de colocá-lo no ar
Ter um ambiente seguro para desenvolver e testar alterações em um site WordPress é uma boa ideia para todos os proprietários de sites WordPress. Mas se você for um web designer ou desenvolvedor de WordPress, é provável que queira permitir que os clientes visualizem o site WordPress deles antes de confirmar as alterações.
Claro, você poderia enviar a eles um link para seu site de teste. Mas se eles usarem um host da Web que não ofereça esse recurso, você não poderá fazê-lo.
É por isso que sugerimos a instalação do plug-in da página de destino SeedProd. Ele inclui controles de acesso avançados que permitem ocultar do público o processo de construção de um site.
Por exemplo, se você estiver criando um novo site para um cliente, poderá ocultá-lo por trás de uma página "Em breve". Em seguida, pode usar os controles de acesso para enviar um link ao cliente da Web para que ele possa visualizar o seu trabalho.
Veja como mostrar aos clientes uma prévia de seu site antes de entrar em operação com o SeedProd.
Primeiro, siga estas instruções para criar uma página de informações em breve no WordPress.
Em seguida, navegue até SeedProd " Pages para ver os diferentes modos de página de destino.
No cabeçalho Coming Soon Mode (Modo em breve ), alterne de inativo para ativo. Isso habilita uma página de "Em breve" para todo o seu site WordPress.
Em seguida, clique no botão Edit Page (Editar página ) para iniciar o construtor de arrastar e soltar do SeedProd e clique na guia Page Settings (Configurações da página ) na parte superior da tela.
Agora, clique no título Controle de acesso para ver todas as diferentes maneiras de permitir que os clientes visualizem o site.
A maneira mais fácil de fazer isso é usar a opção Bypass URL . Você pode digitar uma frase nessa área e fornecer aos seus clientes um URL secreto que ignora sua página de lançamento em breve.
Como resultado, eles podem visualizar o progresso do site antes de revelá-lo ao público.
E aí está!
Esperamos que este artigo tenha ajudado você a aprender como visualizar seu site WordPress antes de colocá-lo no ar. Você também pode gostar deste guia sobre os problemas mais comuns do WordPress e como corrigi-los.
Se você gostou deste artigo, siga-nos no YouTube, Twitter e Facebook para obter mais conteúdo útil para ajudar a expandir seus negócios.