SlideShare ist ein Scribd-Unternehmen logo
1 von 67
Downloaden Sie, um offline zu lesen
TUTORIAL
Como fazer sites utilizando o Webnode
PARTE 1
Cadastrar dados;
Confirmar dados;
Criar esboço do site.
Na página inicial do Webnode(http://www.webnode.com.br/) crie o nome da sua
página,insira o seu email e crie uma senha:
O Webnode te enviará um email confirmando a criação do site e os dados
fornecidos no cadastro: email e senha.Além disso,é necessário que você
clique no link indicado para confirmar seu email. Guarde essas informações.
ATENÇÃO: Este email poderá cair na lixeira ou na caixa de Spam.Caso isso
ocorra,recupere para a caixa de entrada.Cuidado para não deletar!
Escolha o tipo do site:
Selecione o modelo do seu site e em seguida clique em continuar:
Escolha as páginas que você deseja inserir no seu site.Ou então se
preferir,faça-o mais tarde e clique em concluir
PARTE 2
Editar :
-Modelos;
-Imagens;
-Cabeçalho;
Após isso,o seu site será gerado e irá aparecer uma tela de login.Utilize
o email e a senha que você cadastrou no passo 1. Em seguida irá
aparecer a tela de edição do seu site:
Na tela de edição do site,você encontra as seguintes opções:
Novo,Ir para a página,Publicar,Pré-visualizar,Layout da
página,Excluir,Propriedades,Segurança,Texto e
Imagens,Enquete,Galeria de
fotos,Formulário,Artigos,Catálogos,Mais,Arquivos,
Imagens,Modelos de site e Idioma.
Na página de edição podemos alterar o conteúdo de diversos itens como por
exemplo Alterar a imagem do cabeçalho. Clique em Editar Imagem:
Selecione a imagem e aperte a tecla DEL para removê-la.Clique em
Adicionar Imagem para importar uma imagem salva no seu computador
ou escolher diretamente da galeria do Webnode.E após isso,se preferir,edite
a nova imagem com as opções do editor:
DICA: Crie um logotipo personalizado para inserir em seu site
Aqui,você poderá escolher imagens da galeria do Webnode. Para escolher
imagens do seu computador clique em Enviar uma Imagem:
Clique na imagem para ajustar o tamanho e a posição usando os pontos
indicados. Use o botão Enviar para trás,para que seja possível inserir/editar
o título do slogan.
Após a edição concluída,clique em Salvar e fechar
DICA: Ao clicar na área de fundo da imagem do cabeçalho,o botão Cor de
fundo ficará disponível para edição.
Para alterar o modelo do site,clique em Modelos de site e escolha o seu
modelo.Você também pode navegar pelas opções categorias de negócios e
escolher aquela que você preferir.
Após escolher o seu tema,verifique se está da maneira que você gostaria.
Clique em Usar este modelo. Conforme imagem abaixo:
Dê duplo clique no cabeçalho para alterar texto e imagem.Aqui você pode
colocar a foto e a frase do seu slogan.
Quando estiver pronto,clique em Publicar. Abrirá uma janela informando
que a página foi publicada.Feche-a clicando no X:
Como efetuar Logout do site?
Clique em Fechar e depois em Sair:
Como retomar a edição do site?
Acesse o webnode e clique em Entrar.
Insira o e-mail e a senha de acesso e clique em Entrar.
Abrirá a tela com os sites que você criou. É possível ter vários sites.Eles são
chamados de projetos. No projeto que você deseja alterar,clique em
Administrar site:
Para começar a editar o seu site clique em Comece a editar.
ATENÇÃO: A opção Adquira seu próprio domínio é uma função
paga.Explore esses recursos mais tarde,se preferir.
PARTE 3
Adicionar/Excluir páginas;
Editar conteúdo das páginas;
Acrescentar ou excluir as páginas do Menu.Você pode alterar a
ordem,excluí-las ou acrescentar novas páginas:
Clique em Editar Menu;
Clique em Nova Página:
Após todas as edições feitas,clique em Salvar
Observe que a página criada ainda não foi publicada.
Como publicá-la?
Clique na seta ao lado do nome da página que você acabou de criar:
Um pequeno Menu irá abrir.Clique na opção Publicar:
Ou então,Clique na caixa ao lado do nome do site para selecioná-la e depois
clique em Publicar:
Editar conteúdo das páginas:
Selecione a página que você quer editar e clique em Editar
(conteúdo,galeria ou adicionar artigo). Neste exemplo,estaremos editando a
página inicial:
Na página de edição, há algumas ferramentas de formatação de texto,por
exemplo.
Após as edições concluídas,clique em Salvar:
Você pode acrescentar um conteúdo a uma página criada,ou seja Texto e
Imagem,Enquete,Galeria de Fotos,Formulários,Catálogos,Artigos e
Wiggets.
Basta selecionar o conteúdo,arrastar e soltar no local desejado.Este local é
indicado pela faixa laranja que aparecerá ao se aproximar o conteúdo a ser
inserido:
Agora,basta editar o conteúdo da página.
Ao terminar a edição,clique em Publicar:
DICA: Visualize seu site para verificar se ele está da forma que você
deseja.Clique em Pré-visualizar
CANAL DE DICAS WEBNODE
NO YOUTUBE:
http://www.youtube.com/user/58709131
TUDO PARA WEBNODE
NO YOUTUBE:
http://www.youtube.com/playlist?list=PLBA
8296E4FE32CC19
TUTORIAL
Utilizando recursos especiais do Webnode
PARTE 1
 Identificando os recursos
 Como inseri-los
Na tela de edição do site podemos identificar algumas ferramentas adicionais que
podemos inserir em nosso site. Sendo elas: Enquete, Galeria de Fotos,
Formulário, Artigos, Catálogos e Mais
Para fazer a inserção da ferramenta selecionada, existem duas opções:
arrastá-la até a área desejada, ou então você pode simplesmente clicar e
aguardar até que ela seja posicionada automaticamente na página. Note a
barra laranja, citada no tutorial anterior.
PARTE 2
 Explorando e editando as informações das
seguintes ferramentas:
- Enquetes;
- Galeria de fotos;
- Formulário (Contate-nos);
- Artigo;
- Mais (Código Embutido).
Neste caso, iremos realizar a criação de uma enquete. Enquetes são úteis
para saber a opinião dos alunos e interessados em algum tema, para
colher dados, identificar preferências, entre outras finalidades. Após
inseri-la, a seguinte tela será aberta em seu navegador:
Nesta tela, devemos escolher a pergunta e suas respectivas alternativas. Para fins de
exemplo, utilizemos a seguinte:
Você também pode inserir novas alternativas, clicando no link “Adicionar uma
alternativa”.
Feitas as alterações, basta clicar em “OK” para que as alterações sejam realizadas
e sua enquete seja criada.
Abaixo você pode conferir como a nossa enquete de exemplo ficou, após
termos clicado em “OK”:
Você ainda pode clicar em “Editar enquete” e, dessa forma, adicionar ou
remover perguntas à enquete em questão:
Agora iremos realizar a criação de uma Galeria de Fotos. As galerias são
úteis para que você possa disponibilizar fotos de algum evento na escola, de
obras e outros materiais que possam interessar à comunidade escolar. Para
isso, basta clicar em Galeria de Fotos para abrir uma janela como esta:
Na janela que se abriu, você só precisará escolher um nome para a galeria
e clicar em “OK”. Como exemplo, utilizaremos o seguinte tema:
Após escolhido o nome, uma nova janela será aberta. Nela, você deve
indicar quais fotos você deseja inserir na galeria. Para isto, basta clicar em:
“Fazer upload de imagens”, como mostra a imagem abaixo. DICA: Você
pode selecionar mais de uma foto para enviar, segurando a tecla CTRL do
teclado.
Exemplo de tela de envio de imagens:
Após carregadas para o Webnode, as imagens estarão dispostas como
mostra a figura abaixo. Você poderá excluir uma ou mais fotos
selecionando-a(as) e clicando em “Excluir”, bem como poderá acessar esta
mesma tela, posteriormente, clicando em “Editar galeria”. Após as
alterações, basta clicar em “Fechar”.
Exemplo de galeria criada:
Neste passo criaremos um formulário para contato. Formulários são úteis
para que os alunos e/ou pessoas interessadas possam entrar em contato
com a escola ou responsáveis pelo site, por exemplo. Veja a função de
formulário abaixo:
Você pode selecionar um formulário “Contate-nos” padrão, como abaixo:
Um espaço como este será apresentado:
Abaixo você pode verificar um formulário para contato padrão.
Ou então, personalizar o seu. Conforme exemplo abaixo:
Para tal, basta selecionar o campo desejado e alterar as informações que
serão exibidas para os usuários. Veja um exemplo de aplicação e atente-se
aos números e seu campo correspondente.
Veja a página pronta para a publicação após as alterações:
Aprenderemos agora a criar uma página de artigo. Estas páginas são úteis
para se publicar algum comunicado para os visitantes do site. Por exemplo,
um informe da direção ou do grêmio. Para tal, basta selecionar a opção
“Artigo”:
Dê um nome à sua seção de artigos:
Clique em “Adicionar artigo”.
Dê um título ao seu artigo, escreva-o e, caso deseje, edite-o conforme suas
necessidades. Por fim, basta clicar em “Publicar”.
Por fim, aprenderemos a inserir um código embutido em uma página.
Códigos embutidos são úteis para que possamos colocar algum conteúdo
multimídia, como por exemplo, jogos didáticos em flash, apresentações de
slides, streaming de vídeos, entre outros.
Visualize abaixo um exemplo de inserção de código embed de um vídeo do
Youtube.
Após a inserção, o conteúdo será interpretado e exibido desta forma:
FIM
 Obrigado por ter acompanhado o tutorial

Weitere ähnliche Inhalte

Was ist angesagt? (20)

Eadblo Gcorreto
Eadblo GcorretoEadblo Gcorreto
Eadblo Gcorreto
 
Como criar um blog
Como criar um blogComo criar um blog
Como criar um blog
 
InformáTica Blog 2
InformáTica   Blog 2InformáTica   Blog 2
InformáTica Blog 2
 
Como criar um Blog
Como criar um BlogComo criar um Blog
Como criar um Blog
 
Criando Blog Ste
Criando Blog SteCriando Blog Ste
Criando Blog Ste
 
Criar um blog
Criar um blog Criar um blog
Criar um blog
 
Guia básico wix
Guia básico wixGuia básico wix
Guia básico wix
 
Criacao de blogs
Criacao de blogsCriacao de blogs
Criacao de blogs
 
Tutorial blogger elyene_fabricia
Tutorial blogger elyene_fabriciaTutorial blogger elyene_fabricia
Tutorial blogger elyene_fabricia
 
Blog: Criação e Configuração
Blog: Criação e ConfiguraçãoBlog: Criação e Configuração
Blog: Criação e Configuração
 
aula 03 - WordPress
aula 03 - WordPressaula 03 - WordPress
aula 03 - WordPress
 
Blogger
BloggerBlogger
Blogger
 
Oficina Criando Um Blog
Oficina Criando Um BlogOficina Criando Um Blog
Oficina Criando Um Blog
 
Passo a passo
Passo a passoPasso a passo
Passo a passo
 
Criar um blog
Criar um blogCriar um blog
Criar um blog
 
Apostila como criar um blog
Apostila como criar um blogApostila como criar um blog
Apostila como criar um blog
 
Unidade III - Curso Introdução à Educação Digital
Unidade III - Curso Introdução à Educação DigitalUnidade III - Curso Introdução à Educação Digital
Unidade III - Curso Introdução à Educação Digital
 
Apostila como criar um blog
Apostila como criar um blogApostila como criar um blog
Apostila como criar um blog
 
Passo a passo redes sociais
Passo a passo redes sociaisPasso a passo redes sociais
Passo a passo redes sociais
 
Google sites-pdf
Google sites-pdfGoogle sites-pdf
Google sites-pdf
 

Andere mochten auch

О концепции открытой науки
О концепции открытой наукиО концепции открытой науки
О концепции открытой наукиArtem Pripadchev
 
Fluxus, Arte digital e Arte Eletrónica
Fluxus, Arte digital e Arte EletrónicaFluxus, Arte digital e Arte Eletrónica
Fluxus, Arte digital e Arte EletrónicaRaquel Almeida
 
Arte e tecnologia: possibilidades de criação na era digital (relato de expe...
Arte e tecnologia: possibilidades de criação na era digital (relato de expe...Arte e tecnologia: possibilidades de criação na era digital (relato de expe...
Arte e tecnologia: possibilidades de criação na era digital (relato de expe...Aline Corso
 
Orientações curriculares i
Orientações curriculares iOrientações curriculares i
Orientações curriculares itecampinasoeste
 
Arte Digital
Arte DigitalArte Digital
Arte Digitalppgmkt
 
Arte Digital
Arte DigitalArte Digital
Arte DigitalNaryta
 
Arte ensino médio slide 1
Arte ensino médio  slide 1Arte ensino médio  slide 1
Arte ensino médio slide 1Eponina Alencar
 

Andere mochten auch (10)

Arte digital pp
Arte digital ppArte digital pp
Arte digital pp
 
О концепции открытой науки
О концепции открытой наукиО концепции открытой науки
О концепции открытой науки
 
Fluxus, Arte digital e Arte Eletrónica
Fluxus, Arte digital e Arte EletrónicaFluxus, Arte digital e Arte Eletrónica
Fluxus, Arte digital e Arte Eletrónica
 
Arte e tecnologia: possibilidades de criação na era digital (relato de expe...
Arte e tecnologia: possibilidades de criação na era digital (relato de expe...Arte e tecnologia: possibilidades de criação na era digital (relato de expe...
Arte e tecnologia: possibilidades de criação na era digital (relato de expe...
 
Orientações curriculares i
Orientações curriculares iOrientações curriculares i
Orientações curriculares i
 
Arte Digital
Arte DigitalArte Digital
Arte Digital
 
Arte Digital
Arte DigitalArte Digital
Arte Digital
 
Arte Digital
Arte DigitalArte Digital
Arte Digital
 
Arte ensino médio slide 1
Arte ensino médio  slide 1Arte ensino médio  slide 1
Arte ensino médio slide 1
 
Aula de artes para o ensino médio
Aula de artes para o ensino médioAula de artes para o ensino médio
Aula de artes para o ensino médio
 

Ähnlich wie OT Arte 3ª série Ensino Médio - Tutoriais 1 e 2 (20)

Tutorial webnode
Tutorial webnodeTutorial webnode
Tutorial webnode
 
Tutorial do blog do PIBID UNEAL Geografia Campus I
Tutorial do blog do PIBID UNEAL Geografia Campus ITutorial do blog do PIBID UNEAL Geografia Campus I
Tutorial do blog do PIBID UNEAL Geografia Campus I
 
Blog educacional
Blog educacionalBlog educacional
Blog educacional
 
Passo a passo_blog educacional
Passo a passo_blog educacionalPasso a passo_blog educacional
Passo a passo_blog educacional
 
Como Criar Um Blog
Como Criar Um BlogComo Criar Um Blog
Como Criar Um Blog
 
Tutorial webnod setembro 2013
Tutorial webnod setembro 2013Tutorial webnod setembro 2013
Tutorial webnod setembro 2013
 
aula 02 - WordPress
aula 02 - WordPressaula 02 - WordPress
aula 02 - WordPress
 
Word press
Word press Word press
Word press
 
Webnode
WebnodeWebnode
Webnode
 
Blog
BlogBlog
Blog
 
aula 01 - WordPress
aula 01 - WordPressaula 01 - WordPress
aula 01 - WordPress
 
555
555555
555
 
AIAI
AIAIAIAI
AIAI
 
Google docs - Editor de Formulários
Google docs  - Editor de FormuláriosGoogle docs  - Editor de Formulários
Google docs - Editor de Formulários
 
Guia Blog Layout Parte2
Guia Blog Layout Parte2Guia Blog Layout Parte2
Guia Blog Layout Parte2
 
Criar um blog
Criar um blogCriar um blog
Criar um blog
 
Guia Layout
Guia LayoutGuia Layout
Guia Layout
 
Oficina de Blog
Oficina de BlogOficina de Blog
Oficina de Blog
 
Tutorial google sites mobile templates
Tutorial google sites mobile templatesTutorial google sites mobile templates
Tutorial google sites mobile templates
 
Eadblog 1218719297205154-9
Eadblog 1218719297205154-9Eadblog 1218719297205154-9
Eadblog 1218719297205154-9
 

Mehr von Claudia Elisabete Silva

DE Leste 4 - Cultura é Currículo - Maio 2014
DE Leste 4 - Cultura é Currículo - Maio 2014DE Leste 4 - Cultura é Currículo - Maio 2014
DE Leste 4 - Cultura é Currículo - Maio 2014Claudia Elisabete Silva
 
ATPC Como Espaço de Formação - Gestão da Sala de Aula
ATPC Como Espaço de Formação - Gestão da Sala de AulaATPC Como Espaço de Formação - Gestão da Sala de Aula
ATPC Como Espaço de Formação - Gestão da Sala de AulaClaudia Elisabete Silva
 
OT Mediação e Linguagem - II Encontro 13mar
OT Mediação e Linguagem - II Encontro 13marOT Mediação e Linguagem - II Encontro 13mar
OT Mediação e Linguagem - II Encontro 13marClaudia Elisabete Silva
 
ATPC Como Espaço de Formação - Avaliação
ATPC Como Espaço de Formação - AvaliaçãoATPC Como Espaço de Formação - Avaliação
ATPC Como Espaço de Formação - AvaliaçãoClaudia Elisabete Silva
 
Informe Técnico - Campanha de Vacinação HPV_Autorização
Informe Técnico - Campanha de Vacinação HPV_AutorizaçãoInforme Técnico - Campanha de Vacinação HPV_Autorização
Informe Técnico - Campanha de Vacinação HPV_AutorizaçãoClaudia Elisabete Silva
 
Guia Prático HPV - perguntas e respostas
Guia Prático HPV - perguntas e respostasGuia Prático HPV - perguntas e respostas
Guia Prático HPV - perguntas e respostasClaudia Elisabete Silva
 
Educação Especial: OT Planejamento 2014 EF-Anos Finais e Ensino Médio
Educação Especial: OT Planejamento 2014 EF-Anos Finais e Ensino MédioEducação Especial: OT Planejamento 2014 EF-Anos Finais e Ensino Médio
Educação Especial: OT Planejamento 2014 EF-Anos Finais e Ensino MédioClaudia Elisabete Silva
 
OT Currículo e histórias indígena, africana e afro-brasileira
OT Currículo e histórias indígena, africana e afro-brasileiraOT Currículo e histórias indígena, africana e afro-brasileira
OT Currículo e histórias indígena, africana e afro-brasileiraClaudia Elisabete Silva
 
OT Múltiplas histórias na sala de aula: história africana, afro-brasileira e ...
OT Múltiplas histórias na sala de aula: história africana, afro-brasileira e ...OT Múltiplas histórias na sala de aula: história africana, afro-brasileira e ...
OT Múltiplas histórias na sala de aula: história africana, afro-brasileira e ...Claudia Elisabete Silva
 
1a Exposição de Boas Práticas da Diretoria de Ensino Leste 4
1a Exposição de Boas Práticas da Diretoria de Ensino Leste 41a Exposição de Boas Práticas da Diretoria de Ensino Leste 4
1a Exposição de Boas Práticas da Diretoria de Ensino Leste 4Claudia Elisabete Silva
 
Cronograma Cultura é Currículo - Outubro de 2013
Cronograma Cultura é Currículo - Outubro de 2013Cronograma Cultura é Currículo - Outubro de 2013
Cronograma Cultura é Currículo - Outubro de 2013Claudia Elisabete Silva
 

Mehr von Claudia Elisabete Silva (20)

DE Leste 4 - Cultura é Currículo - Maio 2014
DE Leste 4 - Cultura é Currículo - Maio 2014DE Leste 4 - Cultura é Currículo - Maio 2014
DE Leste 4 - Cultura é Currículo - Maio 2014
 
ATPC Como Espaço de Formação - Gestão da Sala de Aula
ATPC Como Espaço de Formação - Gestão da Sala de AulaATPC Como Espaço de Formação - Gestão da Sala de Aula
ATPC Como Espaço de Formação - Gestão da Sala de Aula
 
Cultura é Currículo - abril 2014
Cultura é Currículo - abril 2014Cultura é Currículo - abril 2014
Cultura é Currículo - abril 2014
 
OT Sala de Leitura 15abril
OT Sala de Leitura 15abrilOT Sala de Leitura 15abril
OT Sala de Leitura 15abril
 
OT Mediação e Linguagem - II Encontro 13mar
OT Mediação e Linguagem - II Encontro 13marOT Mediação e Linguagem - II Encontro 13mar
OT Mediação e Linguagem - II Encontro 13mar
 
OT Mediação e Linguagem 11fev
OT Mediação e Linguagem 11fevOT Mediação e Linguagem 11fev
OT Mediação e Linguagem 11fev
 
OT Sabores da Leitura 25fev
OT Sabores da Leitura 25fevOT Sabores da Leitura 25fev
OT Sabores da Leitura 25fev
 
Reset Tablet (DE Leste 4)
Reset Tablet (DE Leste 4)Reset Tablet (DE Leste 4)
Reset Tablet (DE Leste 4)
 
Tablet Educacional
Tablet EducacionalTablet Educacional
Tablet Educacional
 
ATPC Como Espaço de Formação - Avaliação
ATPC Como Espaço de Formação - AvaliaçãoATPC Como Espaço de Formação - Avaliação
ATPC Como Espaço de Formação - Avaliação
 
Porque vacinar contra o HPV
Porque vacinar contra o HPVPorque vacinar contra o HPV
Porque vacinar contra o HPV
 
Informe Técnico - Campanha de Vacinação HPV_Autorização
Informe Técnico - Campanha de Vacinação HPV_AutorizaçãoInforme Técnico - Campanha de Vacinação HPV_Autorização
Informe Técnico - Campanha de Vacinação HPV_Autorização
 
Guia Prático HPV - perguntas e respostas
Guia Prático HPV - perguntas e respostasGuia Prático HPV - perguntas e respostas
Guia Prático HPV - perguntas e respostas
 
Educação Especial: OT Planejamento 2014 EF-Anos Finais e Ensino Médio
Educação Especial: OT Planejamento 2014 EF-Anos Finais e Ensino MédioEducação Especial: OT Planejamento 2014 EF-Anos Finais e Ensino Médio
Educação Especial: OT Planejamento 2014 EF-Anos Finais e Ensino Médio
 
Planejamento Escolar 2014
Planejamento Escolar 2014Planejamento Escolar 2014
Planejamento Escolar 2014
 
Ciencias da Natureza 2014
Ciencias da Natureza 2014Ciencias da Natureza 2014
Ciencias da Natureza 2014
 
OT Currículo e histórias indígena, africana e afro-brasileira
OT Currículo e histórias indígena, africana e afro-brasileiraOT Currículo e histórias indígena, africana e afro-brasileira
OT Currículo e histórias indígena, africana e afro-brasileira
 
OT Múltiplas histórias na sala de aula: história africana, afro-brasileira e ...
OT Múltiplas histórias na sala de aula: história africana, afro-brasileira e ...OT Múltiplas histórias na sala de aula: história africana, afro-brasileira e ...
OT Múltiplas histórias na sala de aula: história africana, afro-brasileira e ...
 
1a Exposição de Boas Práticas da Diretoria de Ensino Leste 4
1a Exposição de Boas Práticas da Diretoria de Ensino Leste 41a Exposição de Boas Práticas da Diretoria de Ensino Leste 4
1a Exposição de Boas Práticas da Diretoria de Ensino Leste 4
 
Cronograma Cultura é Currículo - Outubro de 2013
Cronograma Cultura é Currículo - Outubro de 2013Cronograma Cultura é Currículo - Outubro de 2013
Cronograma Cultura é Currículo - Outubro de 2013
 

OT Arte 3ª série Ensino Médio - Tutoriais 1 e 2

  • 1. TUTORIAL Como fazer sites utilizando o Webnode
  • 2. PARTE 1 Cadastrar dados; Confirmar dados; Criar esboço do site.
  • 3. Na página inicial do Webnode(http://www.webnode.com.br/) crie o nome da sua página,insira o seu email e crie uma senha:
  • 4. O Webnode te enviará um email confirmando a criação do site e os dados fornecidos no cadastro: email e senha.Além disso,é necessário que você clique no link indicado para confirmar seu email. Guarde essas informações. ATENÇÃO: Este email poderá cair na lixeira ou na caixa de Spam.Caso isso ocorra,recupere para a caixa de entrada.Cuidado para não deletar!
  • 5. Escolha o tipo do site:
  • 6. Selecione o modelo do seu site e em seguida clique em continuar:
  • 7. Escolha as páginas que você deseja inserir no seu site.Ou então se preferir,faça-o mais tarde e clique em concluir
  • 9. Após isso,o seu site será gerado e irá aparecer uma tela de login.Utilize o email e a senha que você cadastrou no passo 1. Em seguida irá aparecer a tela de edição do seu site:
  • 10. Na tela de edição do site,você encontra as seguintes opções: Novo,Ir para a página,Publicar,Pré-visualizar,Layout da página,Excluir,Propriedades,Segurança,Texto e Imagens,Enquete,Galeria de fotos,Formulário,Artigos,Catálogos,Mais,Arquivos, Imagens,Modelos de site e Idioma.
  • 11. Na página de edição podemos alterar o conteúdo de diversos itens como por exemplo Alterar a imagem do cabeçalho. Clique em Editar Imagem:
  • 12. Selecione a imagem e aperte a tecla DEL para removê-la.Clique em Adicionar Imagem para importar uma imagem salva no seu computador ou escolher diretamente da galeria do Webnode.E após isso,se preferir,edite a nova imagem com as opções do editor: DICA: Crie um logotipo personalizado para inserir em seu site
  • 13. Aqui,você poderá escolher imagens da galeria do Webnode. Para escolher imagens do seu computador clique em Enviar uma Imagem:
  • 14. Clique na imagem para ajustar o tamanho e a posição usando os pontos indicados. Use o botão Enviar para trás,para que seja possível inserir/editar o título do slogan. Após a edição concluída,clique em Salvar e fechar DICA: Ao clicar na área de fundo da imagem do cabeçalho,o botão Cor de fundo ficará disponível para edição.
  • 15. Para alterar o modelo do site,clique em Modelos de site e escolha o seu modelo.Você também pode navegar pelas opções categorias de negócios e escolher aquela que você preferir.
  • 16. Após escolher o seu tema,verifique se está da maneira que você gostaria. Clique em Usar este modelo. Conforme imagem abaixo:
  • 17. Dê duplo clique no cabeçalho para alterar texto e imagem.Aqui você pode colocar a foto e a frase do seu slogan.
  • 18. Quando estiver pronto,clique em Publicar. Abrirá uma janela informando que a página foi publicada.Feche-a clicando no X:
  • 19. Como efetuar Logout do site? Clique em Fechar e depois em Sair:
  • 20. Como retomar a edição do site? Acesse o webnode e clique em Entrar. Insira o e-mail e a senha de acesso e clique em Entrar.
  • 21. Abrirá a tela com os sites que você criou. É possível ter vários sites.Eles são chamados de projetos. No projeto que você deseja alterar,clique em Administrar site:
  • 22. Para começar a editar o seu site clique em Comece a editar. ATENÇÃO: A opção Adquira seu próprio domínio é uma função paga.Explore esses recursos mais tarde,se preferir.
  • 24. Acrescentar ou excluir as páginas do Menu.Você pode alterar a ordem,excluí-las ou acrescentar novas páginas: Clique em Editar Menu; Clique em Nova Página:
  • 25. Após todas as edições feitas,clique em Salvar
  • 26. Observe que a página criada ainda não foi publicada. Como publicá-la?
  • 27. Clique na seta ao lado do nome da página que você acabou de criar: Um pequeno Menu irá abrir.Clique na opção Publicar:
  • 28. Ou então,Clique na caixa ao lado do nome do site para selecioná-la e depois clique em Publicar:
  • 29. Editar conteúdo das páginas: Selecione a página que você quer editar e clique em Editar (conteúdo,galeria ou adicionar artigo). Neste exemplo,estaremos editando a página inicial:
  • 30. Na página de edição, há algumas ferramentas de formatação de texto,por exemplo. Após as edições concluídas,clique em Salvar:
  • 31. Você pode acrescentar um conteúdo a uma página criada,ou seja Texto e Imagem,Enquete,Galeria de Fotos,Formulários,Catálogos,Artigos e Wiggets. Basta selecionar o conteúdo,arrastar e soltar no local desejado.Este local é indicado pela faixa laranja que aparecerá ao se aproximar o conteúdo a ser inserido:
  • 32. Agora,basta editar o conteúdo da página. Ao terminar a edição,clique em Publicar:
  • 33. DICA: Visualize seu site para verificar se ele está da forma que você deseja.Clique em Pré-visualizar
  • 34. CANAL DE DICAS WEBNODE NO YOUTUBE: http://www.youtube.com/user/58709131
  • 35. TUDO PARA WEBNODE NO YOUTUBE: http://www.youtube.com/playlist?list=PLBA 8296E4FE32CC19
  • 37. PARTE 1  Identificando os recursos  Como inseri-los
  • 38. Na tela de edição do site podemos identificar algumas ferramentas adicionais que podemos inserir em nosso site. Sendo elas: Enquete, Galeria de Fotos, Formulário, Artigos, Catálogos e Mais
  • 39. Para fazer a inserção da ferramenta selecionada, existem duas opções: arrastá-la até a área desejada, ou então você pode simplesmente clicar e aguardar até que ela seja posicionada automaticamente na página. Note a barra laranja, citada no tutorial anterior.
  • 40. PARTE 2  Explorando e editando as informações das seguintes ferramentas: - Enquetes; - Galeria de fotos; - Formulário (Contate-nos); - Artigo; - Mais (Código Embutido).
  • 41. Neste caso, iremos realizar a criação de uma enquete. Enquetes são úteis para saber a opinião dos alunos e interessados em algum tema, para colher dados, identificar preferências, entre outras finalidades. Após inseri-la, a seguinte tela será aberta em seu navegador:
  • 42. Nesta tela, devemos escolher a pergunta e suas respectivas alternativas. Para fins de exemplo, utilizemos a seguinte:
  • 43. Você também pode inserir novas alternativas, clicando no link “Adicionar uma alternativa”.
  • 44. Feitas as alterações, basta clicar em “OK” para que as alterações sejam realizadas e sua enquete seja criada.
  • 45. Abaixo você pode conferir como a nossa enquete de exemplo ficou, após termos clicado em “OK”:
  • 46. Você ainda pode clicar em “Editar enquete” e, dessa forma, adicionar ou remover perguntas à enquete em questão:
  • 47. Agora iremos realizar a criação de uma Galeria de Fotos. As galerias são úteis para que você possa disponibilizar fotos de algum evento na escola, de obras e outros materiais que possam interessar à comunidade escolar. Para isso, basta clicar em Galeria de Fotos para abrir uma janela como esta:
  • 48. Na janela que se abriu, você só precisará escolher um nome para a galeria e clicar em “OK”. Como exemplo, utilizaremos o seguinte tema:
  • 49. Após escolhido o nome, uma nova janela será aberta. Nela, você deve indicar quais fotos você deseja inserir na galeria. Para isto, basta clicar em: “Fazer upload de imagens”, como mostra a imagem abaixo. DICA: Você pode selecionar mais de uma foto para enviar, segurando a tecla CTRL do teclado.
  • 50. Exemplo de tela de envio de imagens:
  • 51. Após carregadas para o Webnode, as imagens estarão dispostas como mostra a figura abaixo. Você poderá excluir uma ou mais fotos selecionando-a(as) e clicando em “Excluir”, bem como poderá acessar esta mesma tela, posteriormente, clicando em “Editar galeria”. Após as alterações, basta clicar em “Fechar”.
  • 53. Neste passo criaremos um formulário para contato. Formulários são úteis para que os alunos e/ou pessoas interessadas possam entrar em contato com a escola ou responsáveis pelo site, por exemplo. Veja a função de formulário abaixo:
  • 54. Você pode selecionar um formulário “Contate-nos” padrão, como abaixo:
  • 55. Um espaço como este será apresentado:
  • 56. Abaixo você pode verificar um formulário para contato padrão.
  • 57. Ou então, personalizar o seu. Conforme exemplo abaixo:
  • 58. Para tal, basta selecionar o campo desejado e alterar as informações que serão exibidas para os usuários. Veja um exemplo de aplicação e atente-se aos números e seu campo correspondente.
  • 59. Veja a página pronta para a publicação após as alterações:
  • 60. Aprenderemos agora a criar uma página de artigo. Estas páginas são úteis para se publicar algum comunicado para os visitantes do site. Por exemplo, um informe da direção ou do grêmio. Para tal, basta selecionar a opção “Artigo”:
  • 61. Dê um nome à sua seção de artigos:
  • 63. Dê um título ao seu artigo, escreva-o e, caso deseje, edite-o conforme suas necessidades. Por fim, basta clicar em “Publicar”.
  • 64. Por fim, aprenderemos a inserir um código embutido em uma página. Códigos embutidos são úteis para que possamos colocar algum conteúdo multimídia, como por exemplo, jogos didáticos em flash, apresentações de slides, streaming de vídeos, entre outros.
  • 65. Visualize abaixo um exemplo de inserção de código embed de um vídeo do Youtube.
  • 66. Após a inserção, o conteúdo será interpretado e exibido desta forma:
  • 67. FIM  Obrigado por ter acompanhado o tutorial