Criar Sites com Wix

Ação de Formação: RED na dinamização da Sala de aula.
Formador: José Couto e Artur André
Duração: 25 horas
Local: Escola Básica dos 2º e 3º Ciclos do Estreito de Câmara de Lobos
Página 1 de 32
Como Criar um Site Passo a Passo
Para si que caiu de paraquedas e está perdido sem saber por onde começar a
criar o seu site no construtor Wix, seguem abaixo artigos com todo o passo-a-
passo para começar a criar o seu site facilmente.
O que é o Wix?
O Wix é uma ferramenta online de criação gratuita de sites em Flash e também
em HTML5 (nova versão da linguagem de programação que atualmente é a
tendência da web). Com o Wix é possível criar sites incríveis com aparência
bonita, sofisticação e elegância. Em pouco tempo cria um website profissional
para sua empresa, para divulgar seu negócio ou para interagir com os seus
alunos. O Wix é amigável junto aos motores de buscas.
Como criar um site Grátis Passo a Passo?
Além de contar com toda a facilidade de poder arrastar e soltar elementos,
adicionar animações, imagens, galeria de imagens, textos, menus animados,
criar novas páginas, entre outras coisas… conta com o “auxílio” de um painel de
controlo em português e bastante intuitivo.
Esqueça a programação por códigos!
Com o Wix dá pra fazer tudo o que sua criatividade quiser!
Solte a sua imaginação, mostre aos seus alunos formas dinâmicas de interação,
crie uma apresentação, dinamize as suas aulas!
Por onde eu começo?
Siga este Passo a Passo, através dos links e crie rapidamente seu website!
(Obs: O primeiro link de cada passo (com letra maior) é o mais importante, os
links subsequentes são uma continuidade do assunto abordado).
Atenção: os passos descritos abaixo são para o desenvolvimento de website no
formato HTML5 (recomendado).

Duração: 25 horas
Página 2 de 32
Vamos ao passo a passo:
O Wix permite que crie a sua conta em questão de segundos e comece a
trabalhar no seu site imediatamente. Tudo isso sem pagar nada!
1º PASSO:
Primeiro:
Para criar sua conta, aceda ao site do Wix e clique em “Comece Agora”.
Segundo:
Insira um email e uma senha e clique em “OK”. Também pode entrar
rapidamente com suas informações das redes sociais.

Duração: 25 horas
Página 3 de 32
Terceiro:
Na próxima página, escolha uma categoria/tipo de site que deseja criar,
selecione também uma subcategoria para seu projeto.
Depois clique em “VÁ”.
Quarto:
Na próxima janela, serão apresentados vários templates conforme a
categoria/tipo de site que selecionou. Na opção “Ver”, é possível visualizar o
funcionamento do template.

Duração: 25 horas
Página 4 de 32
Escolha o tema que mais lhe agradar e clique em “Editar” para começar a
trabalhar o seu projeto através do Painel de Controlo.
Pronto! Acabou de criar sua conta no Wix.
2º PASSO:
Agora que já criou uma conta no Wix, selecionou o tipo de site e escolheu o seu
template, vamos trabalhar a configuração da aparência do seu tema.
A edição da aparência no Wix resume-se ao Background (imagem de fundo),
Cores e Fontes. Para aceder a esta ferramenta, dentro do Painel de Controlo,
clique num ícone identificado por um pincel no canto superior esquerdo.
Background:
Esta ferramenta permite escolher uma imagem de fundo para o seu site, o que
pode ser interessante dependendo do tipo de site que está a criar.

Duração: 25 horas
Página 5 de 32
Para mudar o plano de fundo, basta clicar sobre a imagem que deseja mudar e
automaticamente o fundo irá ser atualizado com a imagem escolhida. Quando
encontrar a imagem que mais lhe agrada, não precisa salvar mudanças, basta
fechar a janela. Caso deseje voltar ao plano de fundo anterior, clique em
“Descartar Mudanças”.
Cores:
Permite que altere o esquema de cores de todo o site, a partir da escolha de
cores pré-determinadas na “Paleta de Cores” do seu painel de controlo. São
várias as opções e é possível visualizar a alteração instantaneamente, basta
selecionar e clicar na cor desejada. Caso queira voltar à cor normal, basta clicar
em “Descartar mudanças”.

Duração: 25 horas
Página 6 de 32
Vale ressaltar que a mudança ocorre uniformemente, ou seja, esta opção altera
todas as cores do site de uma só vez, não sendo possível mudar uma parte
específica do site por vez. Em vista disso, deve escolher qual é a combinação
de cores que melhor se encaixe no seu projeto ou definir uma cor personalizada,
utilizando a opção “Personalizar Paleta”.
Fontes:
Esta opção, como todos já sabem, serve para alterar o tipo de fonte do site. Pode
escolher as fontes pré-determinadas que aparecem na guia, porém, assim como
as cores, a mudança vale para todo o site, como títulos, subtítulos e o conteúdo.
Caso não queira mudar de fonte, clique no botão “Descartar Mudanças”.

Duração: 25 horas
Página 7 de 32
Como alterar o tipo de fonte no Wix
Caso não tenha gostado das fontes pré-determinadas oferecidas na guia fontes,
o Wix disponibiliza a personalização das mesmas.
Para isso, clique na opção “Personalizar Fontes”, será exibido os estilos de
fontes que compõem o seu site.

Duração: 25 horas
Página 8 de 32
Nesta parte é mostrado a cor e o tamanho de cada estilo, listei alguns só para
ilustrar
Título – fonte do cabeçalho da página;
Título S – fonte do subtítulo da página;
Menu – fonte do menu;
Corpo M, S – fonte do corpo de texto.
Para alterar o estilo da fonte, clique sobre o item que deseja modificar, escolha
a fonte ( Recomenda-se o uso de fontes tradicionais como Arial, Tahoma,
Verdana, Times New Roman, para sites mais sérios, pois transmite maior
profissionalismo. Caso seu site seja mais descontraído, escolha a fonte que mais
lhe agradar), escolha uma variação (negrito, itálico) e a cor da fonte, depois
clique em “OK”.

Duração: 25 horas
Página 9 de 32
Prontinho! Agora já sabe como modificar a aparência do seu site!
3º PASSO:
Como criar páginas no wix
Agora que já tem uma noção básica sobre Como alterar a aparência do Wix, está
na hora de aprender a criar páginas e editar o conteúdo do seu website.
Como editar uma página
Para começar a editar uma página, precisa selecioná-la, para isso clique na
página que deseja editar, no link “Página”, que fica no cabeçalho da página e
selecione uma página para editar.

Duração: 25 horas
Página 10 de 32
Como criar páginas no wix
Para aceder a esta guia “Páginas”, dentro do Painel de Controlo, clique no
primeiro botão (uma folha com a ponta dobrada). O menu de edição de páginas
mostrará todas as suas páginas e as opções de configuração.

Duração: 25 horas
Página 11 de 32
Vamos começar a trabalhar cada um destes recursos.
Como criar uma nova página no Wix
Para adicionar novas páginas ao seu site, clique sobre o link
“Adicionar Página”.
Na janela popup que abrir, serão apresentados layouts prontos, pré-
configurados, para facilitar a criação da nova página. Também pode criar uma
página a partir do zero.
Escolha um tipo de página, dê um nome a ela e clique em “Ok”.
Abaixo foi criado uma página do tipo “SERVIÇOS 1″, com o nome de
“PORTFÓLIO”:

Duração: 25 horas
Página 12 de 32
Como criar subpáginas no wix
Para criar um subpágina, basta passar o rato nos quadradinhos que aparecem
ao lado do nome da página, até o cursor ficar com várias direções, clique e
mantenha pressionado, arrastando até à página que deseja deixar como
subpágina.
Como configurar uma página
Selecione a página que deseja nomear e clique no ícone “Configurações da
Página”, irá surgir uma nova aba com as opções de:

Duração: 25 horas
Página 13 de 32
Nome da Página – O nome da sua página, este também será o nome que
aparecerá no menu.
Endereço da Página – Nome que aparecerá na URL da página.
Ex. www.seusite.com.br/endereco-da-minha-pagina (não são aceitos acentos
e caracteres especiais).
Ocultar do Menu – Irá esconder a página do menu de navegação mas não será
excluída.
Definir como página inicial – Irá definir a página como página inicial do seu
site, a página que será aberta quando seu site for acedido.
Proteger Página – Protege a página com uma senha ou exige que o visitante
se cadastre no site para poder aceder a página.
Aplicando o efeito de transição nas páginas
Efeito de transição das páginas é o efeito que será apresentado nas páginas
quando o visitante mudar de uma página para outra. Estes efeitos são uma mais-
valia e assemelham-se ao efeito de transição de slides do PowerPoint, porém
com menos opções. No construtor de sites Wix as opções são as seguintes:

Duração: 25 horas
Página 14 de 32
Transição Horizontal – as páginas irão aparecer da direita para a esquerda.
Transição Vertical – as páginas irão aparecer de cima para baixo.
Cross Fade - Efeito fade nas páginas, aparecendo gradualmente e lentamente.
Fora-Dentro - Efeito parecido com o Cross Fade, mas as páginas aparecem de
fora para dentro.
DICA: recomendamos que para um melhor entendimento dos tipos de transição,
faça um teste com cada uma delas. Para isso, escolha a transição e clique
em “Pré-visualizar” (canto superior direito do painel de controlo) e teste cada
uma das opções, mudando de uma página para outra.
4º PASSO:
Adicionando texto numa página
Se deseja adicionar um novo texto em qualquer lugar da página, clique primeiro
no botão “Adicionar” (ícone de +), escolha a opção “Texto”.

Duração: 25 horas
Página 15 de 32
Selecione o tipo de texto que deseja adicionar, como Título ou Parágrafo.
Após clicar no tipo de texto escolhido, ele será adicionado à página. Clique sobre
o campo até aparecer uma seleção com pequenas bolinhas e arraste-o até o
local onde deseja deixá-lo.
Pode redimensionar o tamanho do campo clicando e segurando o botão do rato
em cima das pequenas bolinhas em volta do campo. Esta seta branca com fundo
azul na parte superior do campo serve para arrastar verticalmente o objeto.
Veja como ficou o exemplo de ‘adicionar textos’ do Criar Site Wix:

Duração: 25 horas
Página 16 de 32
Excluindo um campo de texto
Para excluir um campo de texto, basta selecionar o campo que deseja excluir e
clicar no ícone da lixeira, que aparece na barra “texto” ou apertar a tecla
“delete” do teclado. Depois confirme a exclusão do objeto.
Duplicando um campo de texto
Uma função interessante é a opção de duplicar um campo já configurado, esta
opção economiza tempo quando queremos inserir um campo já formatado e ao
invés de fazer tudo de novo, basta duplicarmos. Para isso, clique sobre a imagem
até aparecer a barra de configurações, depois clique no botão “Duplicar” (duas
folhas, uma em cima da outra), quando o conteúdo for duplicado, clique sobre
ele e arraste-o para o local desejado.
Prontinho, agora sabe como adicionar texto em suas páginas.

Duração: 25 horas
Página 17 de 32
5º PASSO:
Adicionando e editando imagens no Wix
Continuando o processo de estruturação básica do site, vamos aprender como
adicionar imagens e deixar o seu site mais vivo.
No painel de controlo, clique no botão “Adicionar” e selecione “Imagem”, serão
exibidos 4 opções de imagens para adicionar:
Imagem – adiciona uma imagem simples.
Imagem sem Moldura – também adiciona uma imagem simples.
Imagem com Moldura – adiciona uma imagem com uma borda/moldura
especial editável.
Clip Art - adiciona cliparts exclusivos do próprio construtor.
DICA: escolha sempre a primeira opção (imagem), porque será capaz de
adicionar moldura para configurar o “estilo” da imagem. Esta dica não vale para
o ClipArt, pois não é possível adicionar um clipart através das configurações da
imagem.

Duração: 25 horas
Página 18 de 32
Como editar uma imagem no Wix
Agora que aprendemos como adicionar imagens, vamos explorar um pouco mais
este recurso.
Como trocar uma imagem:
Para alterar uma imagem padrão e inserir uma imagem de sua escolha, clique
sobre ela e selecione “Trocar imagem”.
A Galeria de imagens irá exibir todas as imagens que já tenha
enviado para o seu site, assim como também dá a opção de carregar novas
imagens.

Duração: 25 horas
Página 19 de 32
Para enviar imagens do seu computador, clique no botão “Upload” (marcado na
imagem), na janela que abrir, selecione a pasta e depois a imagem que deseja
enviar, depois clique em “Abrir”, automaticamente a imagem começará a ser
carregada na Galeria.
Quando a imagem terminar de ser carregada e for exibida na galeria, clique
sobre ela até ficar selecionada e depois dê “OK”.
DICA I: Para selecionar várias imagens ao mesmo tempo, segure a tecla “SHIFT”
para imagens em sequência ou a tecla “Ctrl” para selecionar imagens aleatórias.
O mesmo vale para inserir as imagens no site, utilize as teclas para selecionar
várias imagens e depois clique em OK.
DICA II: O Wix também oferece a opção “Imagens Grátis Wix”, que aliás
recomendamos que seja bem explorada pelo desenvolvedor, visto que são
imagens profissionais e inteiramente GRÁTIS, uma excelente ferramenta para
ajudar a tornar seu projeto mais profissional.

Duração: 25 horas
Página 20 de 32
Muitas empresas na internet cobram pelo uso de imagens profissionais como
estas. Portanto, aproveite!
Finalmente, aprendeu como adicionar e editar profissionalmente uma imagem
no Wix.
6º PASSO:
Veremos agora como criar links em textos e imagens. Estes links servirão
para direcionar o visitante para uma outra página na internet ou dentro do próprio
site, arquivos (pdf, documento etc.), email, vídeos e outras coisas.
Para criar link num texto no Wix, primeiro clique no campo de texto onde deseja
criar o link, escolha a opção “Editar Texto” ou dê um clique duplo no campo de
texto.
Agora selecione com o rato o excerto do texto que deseja que o link esteja
associado. Este deve ficar azul (Veja a imagem abaixo).
Agora clique no botão de hiperlink na barra de formatação (um globo com uma
corrente):

Duração: 25 horas
Página 21 de 32
Então será aberto o Gestor de Links com as seguintes opções de links:
Endereço Web – Esta opção permite apontar um link para qualquer página
existente na internet. Após clicar neste botão, irá abrir-se uma janela, insira o
endereço da página ou site que deseja direcionar o link.
Abrir em uma nova janela – abre uma nova janela no navegador quando o link
for clicado (recomendado).
Abrir na mesma janela – abre o link na janela que o utilizador estiver a visualizar.
Clique em “OK”.

Duração: 25 horas
Página 22 de 32
Página – Esta opção permite criar um link para uma página interna do seu site,
após clicar sobre o botão “Página”, uma nova janela com um menu drop down
surgirá, exibindo todas as páginas já criadas no seu site.
Só precisa selecionar a página desejada e clicar em OK para que o link
seja criado.
Documento – Esta opção permite criar um link para um documento em
formatos como doc, pdf, odt e etc. Para criar o link, clique no botão “Documento”,
uma nova janela se abrirá, agora clique dentro do campo “Adicionar/Mudar
Documento”:
Na nova janela que aparecer, escolha um documento que já tenha carregado ou
então carregue um novo arquivo clicando no botão “Upload”.

Duração: 25 horas
Página 23 de 32
Após o carregamento, clique sobre o documento para selecioná-lo de depois
clique em “OK”.
Lembrando que só é possível carregar arquivos, não sendo possível enviar
vídeos ou músicas. Limite de 10mb para cada arquivo.
Como criar links em Imagens
O processo de criação de links em imagens é o mesmo descrito nos passos de
criação de links em textos.
Para criar um link para uma imagem, clique sobre ela e escolha a opção “Link
para”, abrirá a janela do Gestão de links, a partir daí, basta seguir os mesmo
passos para criação de links em textos.

Duração: 25 horas
Página 24 de 32
7º PASSO:
Como adicionar um formulário de contato
Agora que já sabe como criar uma nova página, chegou a hora de criar uma
página com um formulário de contato que servirá para que os seus
leitores possam comunicar-se consigo através de e-mail de uma forma simples
e rápida.
Para fazer isso, basta iniciar o processo de criação de uma nova página
e escolher a opção “Formulário” e em seguida dar um nome sugestivo a página.
Confira na imagem abaixo:

Duração: 25 horas
Página 25 de 32
Depois que a página for adicionada ao site, ainda tem que configurar
o formulário. Na página que contém o formulário, clique sobre ele e no menu que
aparece clique sobre o a opção “Configurações”.
Na próxima janela que se abre, digite o seu endereço de e-mail e caso queira, um
segundo endereço de e-mail para que as informações do formulário
seja enviadas para ambos os endereços:
Também pode mudar o estilo do seu formulário clicando em “Trocar Estilo”.

Duração: 25 horas
Página 26 de 32
8º PASSO:
Como inserir um botão na página
Vamos aprender a inserir um botão de link em sua página. O botão é muito útil
quando queremos incrementar um link, deixando-o com uma aparência mais
atraente.
Para inserir um botão, clique no botão “Adicionar” e selecione a opção “Botões
e Menu”:
Na janela que abrir, escolha um estilo de botão:

Duração: 25 horas
Página 27 de 32
Relembramos que pode alterar o estilo do botão a qualquer momento através da
opção “Trocar estilo”.
Nas Configurações, é possível alterar o nome do botão e o link para o qual ele
irá direcionar.

Duração: 25 horas
Página 28 de 32
9º PASSO:
Como adicionar códigos HTML e Embed ao
seu site
O Construtor de sites do Wix também permite
adicionar códigos HTML/Embed nas páginas de seu site.
Este recurso é muito importante e útil, já que podemos inserir outros recursos
que não estão no Wix. Como, por exemplo, data e hora, contador de visitas, chat
online etc…
HTML é uma linguagem de programação básica para qualquer site na internet,
existem várias outras linguagem mais modernas e robustas, como é o caso do
próprio HTML5, porém os códigos HTML ainda são fundamentalmente usados
em milhares de websites.
Código EMBED – complementando e ao mesmo tempo exemplificando a
explicação acima, o código embed é uma tag html que permite inserir arquivos
de mídia em uma página.
Vamos à prática:
Para inserir códigos, clique no botão “Adicionar” e em seguida em “Apps”.
Um novo menu se abrirá, clique sobre o botão “HTML”:

Duração: 25 horas
Página 29 de 32
Um novo campo aparecerá na página em que estiver trabalhando. Arraste-o até
o local em que deseja que ele apareça e para configurá-lo clique sobre ele e em
seguida em “Configurações”. Um novo menu surgirá na tela. Altere o campo
“Modo” para “Código HTML” (importante) para que o campo onde o código
HTML será inserido, apareça.
Agora é só colar o código HTML que deseja adicionar à sua página e salvar a
alteração. Abaixo pode conferir o código de data de atualização, que foi
adicionado à página do Criar Site Wix do construtor:
Após inserir o código, clique em Atualizar para ver na página como o código
ficou.
10º PASSO:
Como Pré-visualizar, Salvar e Publicar seu
Site
Finalmente, chegamos ao último passo desta série para iniciantes. Agora que
seu o site já está pronto, chegou a hora de publicá-lo para que todos na Internet
possam ter acesso a ele.

Duração: 25 horas
Página 30 de 32
Estas opções estão disponíveis na parte superior direita do ecrã, onde é possível
Pré-visualizar a página, Salvar, Publicar ou fazer um Upgrade diretamente do
editor de sites.
Pré-Visualizar – Ao clicar neste botão poderá ver como o seu site será visto
pelos visitantes, o que é muito bom porque nem todos os recursos
que adicionamos ao site podem ser visto da maneira correta enquanto estamos
no editor. (como, por exemplo, o efeito que um botão faz ao passar o rato sobre
ele).
Salvar – Assim como o nome diz, este botão permite salvar as alterações no seu
site. Recomendo que salve o seu site para que ele guarde qualquer
alteração que tenha feito nas páginas antes mesmo de publicar o site.
Lembrando que pode repetir este processo a qualquer momento enquanto
estiver a trabalhar no seu site, o que garantirá que não perca nada do seu
trabalho caso tenha algum problema como bloqueio do seu navegador de
Internet, queda de luz ou de conexão.
Se esta for a primeira vez que está a salvar o seu site, o construtor irá solicitar
que especifique um endereço para o qual o seu site poderá ser acedido.
Repare que acima está especificado as palavras “novositewix” e que a URL do
site passou a ser http://criarsite.wix.com/novositewix.

Duração: 25 horas
Página 31 de 32
Relembrando: não poderá mudar este endereço a não ser que adicione um
domínio personalizado como poderá conferir a seguir.
Portanto se não pensa em adquirir um plano premium, escolha o endereço do
seu site com muito cuidado.
Publicar – Este recurso permite que publique o seu site de forma que ele esteja
disponível para as pessoas o acederem. Deve repetir este processo toda a vez
que fizer alguma alteração no seu site, caso contrário elas somente poderão ser
vistas por si.
Para isso, clique no botão “Publicar”, uma pequena janela se abrirá, marque a
opção “Permita que o seu site seja encontrado pelos motores de busca” e
clique em “Ok“
Surgirá uma mensagem em inglês: “Please wait while saving” e novamente
uma janela de publicação bem sucedida será exibida:

Duração: 25 horas
Página 32 de 32
Ao clicar no botão “OK”, outra janela aparecerá com as opções de partilha nas
Redes sociais:
Prontinho! Seu site já está publicado!
Upgrade – Esta opção permite transformar o seu site de grátis para um
site premium, que adiciona muito mais recursos como a possibilidade de
adicionar um domínio personalizado, criar uma loja virtual funcional, remover
anúncios do Wix de seu site, mais espaço para armazenamento de dados, maior
limite para transferência mensal de dados, possibilidade de monitorar o seu
site através do Google Analytics e muito mais.
Fonte: http://www.criarsitewix.com/
This work is licensed under a Creative Commons Attribution 3.0 Portugal License.

Criar Sites com Wix

Recomendados

Recomendados

Mais conteúdo relacionado

Mais procurados

Mais procurados (20)

Destaque

Destaque (6)

Semelhante a Criar Sites com Wix

Semelhante a Criar Sites com Wix (20)

Último

Último (20)

Criar Sites com Wix