Vivo Construtor de Site - brasilcomvivo.com.brbrasilcomvivo.com.br/ManualVivoConstrutordeSite.pdf · Vivo Construtor de Site Conteúdo 1.Introdução 2 2. Visão geral do aplicativo

Vivo Construtor de Site


Conteúdo

1. Introdução 2

2. Visão geral do aplicativo on-line Vivo Construtor de Site 3

3. Site 5

Adicionar uma nova página ou pasta 5

Editar páginas 5

4. Imagens 6

5. Tema 8

Modelos 8

Cores 8

Fundo 8

Fontes 8

6. Adicionar Conteúdo 9

7. Gerenciar 10

Status do site 10

Perfil 10

Mapeamento de domínio 10

Favicon 10

Analytics 10

SEO 10

Redirecionamentos 10

Restaurar 11

Álbuns de imagens 11


1. Introdução

Vivo Construtor de Site permite criar e editar páginas web de forma simples mediante um aplicativo online.

O produto inclui tudo o que você precisa para contar com uma presença completa na Internet:

- domínio de internet próprio (a escolher entre: .com.br, .com, .net, .org,),

- plataforma online para criação e edição do site,

- hospedagem (hosting) da página web,

- econtasdee-mailprofissional.

A plataforma online é intuitiva e fácil de usar: você não precisa ter nenhum conhecimento de programação, nem noções de design, nem fazer upload de conteúdo via FTP, etc. Basta escolher uma página de design, preenchê-la com os conteúdos que você deseja mostrar e publicá-la.

As páginas criadas com o Vivo Construtor de Site adaptam-se a qualquer dispositivo (PC, Tablets e Smartphones) sem necessidade de nenhum passo extra.


2. Visão geral do aplicativo online Vivo Construtor de Site

A plataforma online do Vivo Construtor de Site dividi-se em quatro áreas:

1. Barra lateral de funcionalidades principais: Permitem o acesso às diferentes funções do aplicativo. Cada uma destas são explicadas em detalhes nas seções 3, 4, 5 e 7 deste documento.

2. Barra lateral contextual: Mostra informação sobre a funcionalidade ou o conteúdo que selecionamos.

3. Área central: Mostra o conteúdo da página web. Dependendo da funcionalidade selecionada, pode mostrar os designs de página disponíveis, a interface de criação depáginaseasopçõesdeconfiguração.

1 2

3

4


4. Barra superior

a. Adicionar conteúdo: Exibe uma janela com os diferentes tipos de conteúdo que podemos adicionar à nossa página web. Para adicionar conteúdo, basta clicar com o mouse sobre o tipo de conteúdo (widget) que você deseja adicionar, e arrastá-lo até a posição desejada. A linha azul indica onde se situará e quanto espaço o conteúdo ocupará.

b. Editar/Visualizar: Ao mudar o modo “Editar” para o modo “Visualizar”, a barra lateral é ocultada e a página web é mostrada tal como seria visualizada online.

c. Visualização em dispositivos: Permite ver a página web com o aspecto que terá ao ser acessada de um computador, um Tablet ou Smartphone. Na visualização Smartphone e Tablet, você pode mudar a orientação do dispositivo clicando de novo sobre o ícone do

Smartphone ou Tablet. Também permite editar o conteúdo de qualquer das visualizações.

d. Publicar: Publica a página web no domínio associado.

e. Colar conteúdo: Este ícone azul só aparecerá quando clicarmos em copiar um conteúdo (ícone no canto superior esquerdo dos conteúdos adicionados à web). Para colá-lo, bastar arrastar o ícone azul à web como qualquer outro conteúdo.

f. Mostrar: Os conteúdos do cabeçalho e pé de página podem ser ocultados selecionando “Ocultar widget de repetição” no menu contextual lateral. Quando houver conteúdos ocultos,

aparecerá este botão azul que permite pré-visualizar esses conteúdos ocultos.

g. Desfazer / Refazer: Permite desfazer a última ação ou refazê-la

2. Visão geral do aplicativo online Vivo Construtor de Site


3. Site

Esta funcionalidade permite adicionar e editar o conteúdo de sua página web. Ao clicar em Site, na barra lateral contextual aparecerão as páginas ou seleções criadas na página web (ex. Início, Contato, Serviços, etc.). Estas seções podem ser agrupadas em pastas, que são mostradas como abas desdobráveis no menu de navegação da página web.

Adicionar uma nova página ou pasta

Para adicionar uma página ou uma pasta, é necessário clicar em “Adicionar página / pasta”, escolher se é uma página ou uma pasta, introduzir o título e escolher uma estruturapredefinidadependendodotipode página que se queira criar (é totalmente editável posteriormente). Selecionando o Tipo de página “Duplicar”, você cria uma página nova idêntica à que estava selecionada.


Editar páginas

Para editar as característica gerais de uma página, é necessário clicar na roda dentada à direita do título da página na barra lateral contextual do Site. Serão exibidas uma série de campos e opções relativas à página para editar:

- Título da página

- URL da página

- Título do SEO

- Palavras-chave

- Descrição (informação visível para buscadores)

- Opção Escondido da navegação (não exibir a página no menu de navegação)

- Opção Usar como página principal

- Incluí-la em outra pasta

- Marcá-la como ativa ou nativa (pública ou não)

- Incluir Scripts na página

-Excluirdefinitivamenteapágina


4. Imagens

Ao acessar a funcionalidade de “Imagens”, exibe-se o botão de Adicionar imagens e, se houver, as imagens que foram subidas no aplicativo.

Aqui podem-se adicionar novas imagens, editá-las e incluí-las na página web arrastando-as à localização desejada.

Para carregar novas imagens, é preciso clicar no botão que se encontra na parte superior da barra lateral da seção Imagens. Uma nova janela será aberta para importar as imagens do computador do usuário, ou da base de dados de imagens de Vivo Construtor de Site.


Para usar o editor on-line de imagens, basta clicar no ícone que aparece na parte superior da imagem ao selecioná-la, tanto na barra lateral como na área central do conteúdo.

As imagens editadas são guardadas como uma imagem nova, de forma que a imagem original se mantém.

Para incluir imagem na página, basta arrastá-la da barra lateral até a localização desejada.

4. Imagens


5. Tema

Modelos

Clicando em “Ver os modelos”, todos os modelos disponíveis são exibidos. Para pré-visualizar o conteúdo da web com um modelo determinado, basta clicar nele. Você pode selecionar visualização em PC, Tablet e Smartphone. Se você deseja experimentar outro modelo, basta clicar em “Todos os modelos”, em cima e à esquerda. Clicando em “Usar o modelo”, o modelo da web é alterado para o modelo selecionado, mantendo o conteúdo gerado até o momento.

Cores

Nesta seção é possível trocar entre as diferentes paletas decorespredefinidasparaaweb.Umavezselecionadauma paleta de cores, pode-se mudar uma cor em concreto clicando na roda à direita de “Alterar amostra”. Cada uma das sete cores da paleta corresponde a um elemento da web. Esta correspondência depende do modelo escolhido.

Fundo

Nesta seção é possível mudar a cor do fundo da página.

Fontes

Nestaseçãoépossívelmudaratipografiadecadaumdostipos de texto: parágrafo, títulos, navegação, botões.

Na funcionalidade Tema,podem-semudarosDesignsdepágina(modelos),ascores,ofundoeasfontes(tipografia)dapáginaweb.


Imagem: Insere um quadro de imagem que pode ser preenchido com uma imagem subida. P Normal: Insere um quadro de texto que pode ser editado com o conteúdo desejado. Cabeçalho 1: Insere um quadro de texto com estilo de cabeçalho (um Título).

Mapa: Insere um mapa de Google Maps, centrado em um CEP ou emumendereçodefinido.Formulário: Insere um formulário de contato, que envia um e-mail ao endereço quevocêdefiniremGerenciar->Perfil,comos dados facilitados pelo visitante da web. Botão me ligue: Insere um botão especial para que da versão móvel se possa telefonar automaticamente ao número facilitado clicando neste botão.Pessoal: Insere um cartão de LinkedIn pessoal (requer conta no LinkedIn).Negócios: Insere um cartão de LinkedIn da empresa (requer conta no LinkedIn)

o tamanho de cada uma das colunas na barra lateral contextual. As colunas serão mostradascomofilasseateladodispositivo(Smartphone)nãoforsuficientementelarga.

Incorporar: Insere código em HTML. Este conteúdo é analisado com um software de segurança, e está compartimentado, por isso não afeta ao resto do conteúdo.

YouTube: Insere um vídeo do YouTube.Carrossel: Mostra as imagens do usuário emumcarrossel.Pode-sedefiniroefeitode transição entre imagens, o tempo de exposição de cada uma, os botões, etc. Galeria de imagens: Mostra as imagens do usuário em uma galeria.Dropbox: Insere uma ligação com Dropbox para poder baixar um arquivo (requer uma conta de Dropbox).

6. Adicionar Conteúdo

Formulário de cadastro: Similar a Formulário, mas não se inclui texto. Permite receber por e-mail os endereços de e-mail fornecidos pelos visitantes que queiram assinar sua newsletter.

Twitter: Insere os últimos comentários da conta de Twitter indicada.Tweet: Insere um botão para adicionar diretamente uma entrada para Twitter.Facebook: Insere um botão de Curtir.

Botão: Insere um botão que pode vincular a uma página, interna ou a um e-mailDivisor: Insere uma linha horizontal na web (para separar seções).Espaço: Insere um espaço em branco na web (para separar seções).

Colunas: Divide uma zona da página web na quantidade de colunas indicadas (2, 3 ou 4). Uma vez escolhido o número de colunas, este não pode ser alterado. Pode-se alterar


Nestaseçãoconfigura-seainformação da página web.

Status do siteVocê pode administrar a visibilidade do site, de forma que não esteja visível na Internet quando desejar.Também pode-se selecionar o domínio principal sobre o que se publica a web. O resto dos domínios vinculados redirecionarão a este.

7. Gerenciar

Perfil

Aqui é possível incluir a informação principal para mostrar na web, como o Logo, o título da Web, descrição da empresa, e outros dados de contato que aparecem na página de contato. Todos esses dados sãomodificáveisdepoiseditandooSite.

Mapeamento de domínioSão exibidos os domínios a partir dos quais se pode acessar ao site criado com Construtor de Site. É possível inserir domínios adicionais que se tenham (e sobre os que se tenha administração da zona DNS) clicando em “Mapear um domínio” e seguindo as instruções. Para eliminar um Mapeamento de domínio, basta clicar em

“Opções” e em “Eliminar mapeamento “.FaviconUm Favicon é uma pequena imagem que aparece junto ao endereço web na barra de endereço de alguns navegadores. Para personalizar esta imagem, basta arrastá-la até o espaço indicado ou clicar em “escolha uma imagem” e selecioná-la. Esta imagem tem que ter formato .ico


AnalyticsSe você tem uma conta de Google Analytics, pode inserir o ID de Rastreamento nesta área.

SEONesta área é possível introduzir informação relevante para os buscadores. Esta informação é a que os buscadores mostrarão quando a web criada aparecer depois de busca.

RedirecionamentosClicando em “Novo”, pode-se criar redirecionamentos internos. Ex., se a web criada for www.meusite.com.br, e foi criada uma seção que é www.meusite.com.br/nos, pode-se criar um redirecionamento de forma que www.meusite.com.br/contato redirecione também a www.meusite.com.br/nos.O tipo de redireção (301 e 302) é a mensagem que o servidor envia ao navegador para redirecionar.

7. Gerenciar

RecomeçarClicando no botão vermelho Recomeçar, todos os conteúdos criados na página web são apagados. Atenção: Esta ação não poderá ser desfeita e você perderá todos seus conteúdos.

Álbuns de imagensAs imagens subidas podem ser agrupadas em álbuns. Aqui você pode administrar as imagens, os álbuns e suas características.

Documents

Vivo Construtor de Site - brasilcomvivo.com.brbrasilcomvivo.com.br/ManualVivoConstrutordeSite.pdf · Vivo Construtor de Site Conteúdo 1.Introdução 2 2. Visão geral do aplicativo