Criando Seu Website do Zero Usando Wix: Um Guia Passo a Passo
Se você está planejando construir um novo website do zero, este artigo detalha o processo utilizando a plataforma Wix.
Primeiros Passos: Criação da Conta e Configuração Inicial
Para começar, acesse o site oficial da Wix. Se você já possui uma conta, pode fazer login; caso contrário, clique em “Get started” (Começar) para criar uma nova conta e iniciar o processo.
Ao se cadastrar, a plataforma fará algumas perguntas iniciais. É importante responder a essas questões com base nas suas necessidades, pois elas ajudarão a moldar a interface inicial que você verá. Uma das funcionalidades notáveis é a utilização de Inteligência Artificial (IA) para auxiliar na criação do seu website.
Para este exemplo prático, usaremos a criação de um site para um clube do livro.
1. **Defina o Propósito:** Insira a descrição do que o site se propõe a fazer. No nosso caso: “Conectar com a comunidade de amantes de livros para participar do nosso clube semanal, compartilhar ideias e pontos de discussão, além de oferecer resenhas e insights sobre livros.”
2. **Nomeie a Comunidade:** A plataforma pedirá o nome do seu clube ou comunidade. Definimos como “Book Buddies” (Amigos do Livro).
3. **Criação do Perfil:** Com base nas respostas, um perfil inicial começa a ser gerado. O texto de descrição pode ser ajustado conforme necessário, mas é fundamental adaptá-lo ao seu projeto específico.
Após responder às perguntas, você estará pronto para acessar o painel de controle (dashboard).
Sobre as Versões do Wix
A versão gratuita da Wix permite que você crie e publique seu website. No entanto, ele terá anúncios da Wix incorporados. Ao fazer um upgrade para os planos de negócios, você ganha a capacidade de aceitar pagamentos e reservas, além de obter um domínio personalizado (exemplo: `seunome.com`).
Para o propósito de construção e aprendizado, manteremos a versão gratuita por enquanto.
Design do Site: Escolhendo e Editando
O próximo passo é projetar o layout do site, acessando a opção “Design the site” (Desenhar o site). Você terá algumas opções:
* **Gerar com IA:** Criar um design personalizado em segundos usando inteligência artificial.
* **Personalizar um Template:** Escolher um dos templates pré-existentes para modificação.
Neste artigo, optaremos por **personalizar um template**. A Wix oferece uma biblioteca de templates bastante diversificada, o que é um excelente ponto de partida, especialmente para quem nunca projetou um site antes. A plataforma categoriza templates por temas como negócios, finanças, saúde, moda, criativos, portfólios, e comunidades, entre outros.
Utilizando a busca, pesquisamos por “book club” e selecionamos um template com aparência de blog de livros. Ao passar o mouse sobre ele, você pode visualizá-lo (“View”) para ver como ele se parece, tanto em uma visualização de desktop quanto em uma vista móvel. É crucial verificar ambos os formatos, pois a maioria dos acessos hoje ocorre via dispositivos móveis. Todos os templates são adaptáveis, reformulando-se para o dispositivo que o visitante estiver usando.
Após escolher o template, clique em “Edit this site” (Editar este site). Isso carregará o editor do Wix, onde você fará todas as modificações.
Navegando no Editor
O editor possui um painel lateral esquerdo com as principais ferramentas de edição:
* **Add Elements (Adicionar Elementos):** Aqui você encontra todos os componentes que pode adicionar ao seu site: textos, imagens, botões, faixas (strips), links, vídeos, formulários de contato, etc.
* **Add Sections (Adicionar Seções):** O website é estruturado em seções (como uma página de boas-vindas, sobre a equipe, etc.). O Wix oferece layouts pré-construídos para essas seções, que podem ser adicionados, excluídos e movidos livremente.
* **Pages (Páginas):** Gerencia as diferentes telas do seu website (Homepage, Review, About, Contact, etc.). As páginas já existentes no template podem ser removidas ou mantidas. As subpáginas, como as listadas sob a Homepage, são seções navegáveis dentro da página inicial, não layouts separados.
* **Site Design (Design do Site):** Permite alterar o tema geral do site.
* **Wix App Market (Mercado de Aplicativos Wix):** Onde você pode adicionar funcionalidades extras, como lojas, calendários ou feeds de mídia social. Algumas são gratuitas, outras pagas, e muitas se integram com outros aplicativos.
* **My Business (Meu Negócio):** Contém elementos úteis para sites voltados a negócios, como gerenciamento de eventos e áreas de membros.
* **Media (Mídia):** Gerencia todas as mídias do site, incluindo arquivos enviados, imagens da biblioteca Wix e arquivos do site.
* **CMS (Customer Management System):** O sistema de gerenciamento de clientes integrado que permite rastrear o tráfego do site.
A edição se concentra principalmente nos **Elementos**, **Seções** e **Páginas**.
Edições de Páginas e Seções
Podemos começar ajustando as páginas:
1. **Removendo Páginas:** Se não quisermos a página de “Events” (Eventos), podemos escondê-la do menu (“Hide from menu”). A página ainda existirá no editor, caso seja útil no futuro, mas não será visível ao público. A página “File Share” (Compartilhamento de Arquivo) foi totalmente excluída, pois não era necessária para o clube do livro.
2. **Reordenando Subpáginas:** As subpáginas (como About e Review) podem ter sua ordem alterada dentro da navegação da Homepage.
Em seguida, ajustamos as **Seções**:
1. **Movimentação de Seções:** Ao passar o mouse sobre uma seção (como um formulário de doação), você pode usar as setas para movê-la para cima ou para baixo na estrutura da página.
2. **Adicionando Seções:** Uma seção de “Welcome” (Boas-Vindas) foi adicionada ao topo da página.
Com a estrutura ajustada, partimos para a personalização do conteúdo:
* **Alterando Texto:** Dê um duplo clique em um texto para editar. Mudamos o título principal para algo mais informal, como “Hello book lovers”.
* **Alterando o Fundo da Seção:** Para a seção “Welcome”, clicamos no fundo e escolhemos “Change Background”. Você pode optar por cores sólidas, gradientes ou usar imagens. Buscamos por “books” na biblioteca de imagens do Wix e selecionamos uma imagem de biblioteca para servir como fundo.
Para editar imagens:
1. Selecione a imagem e clique em “Edit Photo” (Editar Foto), onde você pode cortar (“Crop”) ou ajustar.
2. Para usar uma imagem própria, vá em “Upload Media” (Enviar Mídia) de seu computador. As imagens enviadas ficam armazenadas em “Site Files”, onde podem ser organizadas em subpastas.
3. Após selecionar a imagem editada, clique em “Choose Image” (Escolher Imagem) para aplicá-la.
4. Substituímos também o texto de exemplo da seção “Team” pelo nome desejado.
Você deve percorrer todas as seções, personalizando textos e imagens conforme a sua necessidade. Na página de “Contact” (Contato), é onde se insere o endereço e informações de contato.
Ajustes de Tema e Visualização
Depois de popular o conteúdo, o foco muda para o tema geral do site, acessado em “Site Design”.
Ajustes Globais de Tema
Ao usar “Change Theme” (Mudar Tema), a Wix aplica as novas fontes, esquemas de cores e estilos em todos os elementos do site. Você pode navegar pelos temas pré-definidos (“Warm”, “Fashionable”, “Creamy”, etc.) e aplicar o que melhor se adequa à sua marca. Essas mudanças afetam tanto a versão desktop quanto a mobile.
Para ajustes ainda mais detalhados, você pode ir em:
* **Color Theme (Tema de Cor):** Para escolher cores personalizadas.
* **Text Theme (Tema de Texto):** Para definir fontes específicas para títulos e parágrafos.
A recomendação é aproveitar os temas pré-construídos, pois eles já seguem princípios de design.
Revisão Desktop vs. Mobile
No canto superior, você pode alternar entre o editor Desktop e o Mobile. É essencial conferir ambos os layouts. Embora as alterações no desktop geralmente se reflitam no mobile, a formatação muda devido ao tamanho da tela.
Ao visualizar a versão mobile, você encontrará ferramentas específicas (como o ícone de chave inglesa) e elementos como o “Quick action button” (Botão de Ação Rápida), que pode ser configurado para ligar ou enviar e-mail diretamente do celular, e o botão “Back to top” (Voltar ao Topo).
Publicação do Website
No canto superior direito do editor, você encontra três botões cruciais: **Save** (Salvar), **Preview** (Pré-visualizar) e **Publish** (Publicar).
* **Preview (Pré-visualizar):** Mostra exatamente como o site ficará online, removendo as linhas guias do editor. O modo de pré-visualização é apenas para sua revisão; o público não verá o que você está vendo até publicar.
* **Save (Salvar):** Salva todas as alterações feitas, mas elas não se tornam públicas. Você pode salvar rascunhos e retornar depois. O autosave também funciona, mas salvar manualmente garante que você não perca alterações importantes.
* **Publish (Publicar):** Torna o site ativo e acessível publicamente através do endereço fornecido (o domínio temporário da Wix, no caso da versão gratuita).
Se publicar por engano, é possível reverter para um rascunho anterior antes da publicação.
Ao clicar em “Publish”, uma confirmação aparecerá dizendo que o site está no ar. Clique em “Done” (Concluído). Com isso, você terá seu primeiro website criado e publicado através do Wix.
Perguntas Frequentes
- O que acontece se eu publicar um site sem um domínio personalizado?
O site será publicado usando um subdomínio da Wix (exemplo: `nome.wixsite.com/site`). Para usar seu próprio domínio, é necessário fazer um upgrade para um plano pago. - Como faço para mudar a aparência de todas as páginas de uma vez?
Utilize a opção “Site Design” e aplique um novo “Theme” (Tema). Isso ajustará cores, fontes e estilos em todo o website instantaneamente. - É possível criar um layout diferente para a versão mobile?
Sim. Embora as edições principais sejam unificadas, o editor mobile possui ferramentas específicas, como a possibilidade de definir uma imagem de fundo diferente apenas para dispositivos móveis. - Qual a melhor forma de organizar os arquivos de mídia no editor?
Na seção “Media”, você pode criar subpastas (como “My Photos”) dentro dos “Site Files” para manter suas imagens, vídeos e outros arquivos organizados. - O que devo fazer antes de publicar meu site pela primeira vez?
Sempre salve seu trabalho e utilize a função “Preview” (Pré-visualizar) para verificar a aparência e funcionalidade em desktop e mobile antes de clicar em “Publish”.
