Sistema WSD

WebSite Dinâmico
 Manual do Sistema WSD

Sumário
Introdução................................................................................................................................................................3
Área Administrativa do Sistema WSD....................................................................................................................4
Conteúdo Estático...............................................................................................................................................4
Criar Página....................................................................................................................................................4
Editar Página..................................................................................................................................................5
Excluir Página................................................................................................................................................5
Adicionar Página ao Menu.............................................................................................................................5
Remover Página do Menu..............................................................................................................................7
Editar Menu....................................................................................................................................................7
Criar Caixa Lateral.........................................................................................................................................7
Editar Caixa Lateral.......................................................................................................................................9
Excluir Caixa Lateral.....................................................................................................................................9
Recursos Especiais do Conteúdo Estático.....................................................................................................9
Trabalhando com imagens.........................................................................................................................9
Browse – Navegar pelas imagens do servidor....................................................................................11
Trabalhando com Links...........................................................................................................................13
A aba “Geral”......................................................................................................................................13
Aba “Popup”.......................................................................................................................................14
Usuários do Sistema.........................................................................................................................................15
Listar Usuários............................................................................................................................................15
Ajuda e Suporte.....................................................................................................................................................17

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 2
Fone: (64) 8401-6785
 Manual do Sistema WSD

Introdução

O Sistema WSD é um sistema voltado para usuários que queiram administrar o conteúdo de seu
website sem que seja necessária a contratação de um programador para essa tarefa.
Através do Sistema WSD você poderá criar páginas estáticas, adicionar páginas ao menu de
navegação, enviar arquivos de imagem para o servidor e propiciar ao seu usuário um ambiente
completamente organizado e de fácil navegação.

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 3
Fone: (64) 8401-6785
 Manual do Sistema WSD

Área Administrativa do Sistema WSD

Através da área administrativa você poderá gerenciar todo o conteúdo de sua página através de
uma interface limpa e de fácil aprendizado.

Conteúdo Estático
Através do menu Conteúdo Estático você irá gerenciar as páginas estáticas do seu sistema. Páginas
estáticas são páginas que você insere informações diretamente no corpo da página. Um exemplo de
página estática é a página “Quem Somos”, onde você poderá inserir informações sobre a sua
empresa.

Criar Página

Clicando em “Criar Página” você poderá criar novas páginas no seu sistema. A interface de criação
de páginas é bastante robusta, propiciando assim um ambiente completamente funcional para que
você tenha todos os recursos sempre à mão.

Nessa área nós temos as seguintes opções: Nome, Título e Conteúdo.

O campo “Nome” deverá ser preenchido com um nome para a página. Esse nome é como o nome
de um arquivo em seu computador mas diferente do sistema de arquivos do computador, em

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 4
Fone: (64) 8401-6785
 Manual do Sistema WSD

arquivos para a web não devemos escolher nomes com acentuação, caracteres especiais ou
espaçamento. Uma boa dica é dar um nome curto e significante para a página. Lembre-se também
de sempre utilizar o nome das páginas em letras minúsculas, assim você evitará se confundir no
gerenciamento de páginas.
O campo “Título” deverá ser preenchido com o título da página. Esse título ficará visível na barra
de títulos do navegador quando um usuário acessar o seu site.
No campo “Conteúdo” é feita toda a edição do conteúdo da sua página estática. Aqui serão
inseridas textos, imagens, tabelas, links e toda o conteúdo e formatação necessários. Esse campo
tem o funcionamento idêntico ao dos editores de texto que você já conhece (MS Word, BROffice,
OpenOffice e outros) tornando a sua utilização bastante familiar. Ao terminar a edição do conteúdo
de sua página estática, clique no botão “Salvar” para que a página seja salva.
Você deverá criar uma página inicial para o seu website com o nome “index”. Caso essa página já
exista, basta que você edite essa página para personalizar seu conteúdo.
Importante: Sempre tenha uma página “index” no seu website, caso contrário, ao abrir o seu site,
o visitante verá uma mensagem de página não encontrada.

Editar Página

Através da opção “Editar Página” você poderá modificar as páginas que você já criou. Após
escolher a página que deseja editar, você terá acesso à interface de edição de páginas que é a
mesma da opção “Criar Página”, com a diferença que os campos aqui já vêm preenchidos com as
informações já salvas em sua página estática. Lembre-se de, ao terminar a edição de sua página,
clicar no botão “Salvar”.

Excluir Página

Através dessa opção você poderá excluir páginas que você criou no sistema. Para isso, basta
selecionar a página que você deseja excluir e clicar no botão “Excluir Página”. A exclusão de
páginas não faz a exclusão automática das imagens, figuras e itens utilizados na página. Apenas o
conteúdo e a página são excluídos.
Importante: A ação de exclusão de páginas não pode ser desfeita. Tenha isso em mente quando
excluir uma página do sistema. Os dados não poderão ser recuperados.

Adicionar Página ao Menu

Através dessa opção você poderá adicionar ao menu as páginas que você criou através do iten
“Criar Página” ou até mesmo adicionar páginas estáticas ao menu principal do seu website.

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 5
Fone: (64) 8401-6785
 Manual do Sistema WSD

Os campos disponíveis nesse item são os seguintes: Título, Posição, Alvo, Tipo e Link.
O campo “Título” deverá ser preenchido com o título que esse item receberá no menu principal do
seu website, ou seja, será o texto onde o visitante irá clicar para ter acesso ao conteúdo.
O campo “Posição” é um campo numérico onde você definirá numericamente a posição do item no
menu e funciona da seguinte forma. Você poderá utilizar número de 0 à 99 para definir a posição
de um item no menu. Os itens são organizados numericamente em ordem crescente. Ex.: Digamos
que você tenha 3 itens no menu do seu website e que os 3 itens sejam: Página Inicial, Contato e
Página Inicial. Você poderá definir o item “Quem Somos” com o valor 10, o item “Página Inicial”
com valor 99 e o item “Contato” com valor 90. Dessa forma a ordem de apresentação no menu
será: 1 – Quem Somos, 2 – Contato e 3 – Página Inicial. Dessa forma, você ficará com até 10
posições livres para adicionar mais opções antes do item “Quem Somos” e 89 posições até o item
“Contato” e mais 8 posições até o item “Página Inicial”, logo, caso você queira colocar algum item
antes do item “Quem Somos”, basta inserir um número menor que 10 para que ele apareça
primeiro no menu principal do seu website.
Para facilitar o gerenciamento do menu, ao lado do formulário de preenchimento das opções do
menu você tem uma prévia do seu menu atual juntamente com a numeração de cada item. Dessa
forma você poderá se orientar através dessa numeração para posicionar corretamente um item no
menu.
O campo “Alvo” trabalha juntamente com o campo “Tipo”. Caso você marque o campo “Tipo”
como “Dinâmico”, significa que você deseja adicionar uma página que você criou no sistema. Se
você marcar o campo “Tipo” como estático, significa que você deverá digitar uma URL válida no
campo “Link”. Vamos à um exemplo: Digamos que você tenha criado a página “quemsomos”
através da opção “Criar Página” e que você queira adicionar essa página ao menu. Então você
deverá escolher o Alvo “quemsomos” e escolher o Tipo “Dinâmico” e, nesse caso, o campo “Link”
poderá ser deixado em branco. Se você possuir uma página com URL estática para adicionar ao
menu, você poderá fazê-lo selecionando o tipo “Estático” e preenchendo o campo “Link” com a
URL estática para a sua página e, nesse caso, o campo “Alvo” não afetará o apontamento desse
item do menu.

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 6
Fone: (64) 8401-6785
 Manual do Sistema WSD

Remover Página do Menu

Através dessa opção você poderá remover as páginas do menu do seu website. Basta selecionar o
item que você deseja remover e clicar no botão “Excluir” para que o item seja removido do menu
do seu website.
Quando você remove uma página do menu do seu website, você não está excluindo completamente
a página, você estará apenas removendo a entrada dessa página no menu do website, ou seja, a
página e seu conteúdo continua presente no sistema e poderá ser acessada diretamente através de
um link ou re-inserida no menu do website através da opção “Adicionar Página ao Menu”.

Editar Menu

Através dessa opção você poderá editar as entradas de menu do seu website. Para tal, basta
selecionar a entrada de menu que você deseja editar e clicar no botão “Editar”. Esse item
funciona da mesma forma que o item “Adicionar Página ao Menu” já descrito nesse manual.

Criar Caixa Lateral

As caixas laterais são itens dispostos, dependendo do seu layout, nas laterais do seu website.
Geralmente essas caixas são dispostas na parte direita do website e logo abaixo do menu do
website, na parte esquerda da página.

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 7
Fone: (64) 8401-6785
 Manual do Sistema WSD

Nessa opção teremos os seguintes campos à preencher: Lateral, Posição, Título, Inicial, Aleatório e
Conteúdo.
Lateral: Aqui será definida a lateral onde a caixa irá aparecer. Caso o seu website tenha espaços
nas duas laterais para as caixas, basta selecionar uma delas. Caso o seu website só possua uma
lateral para acomodar as caixas laterais, você deverá escolher a lateral correta para que a caixa
apareça corretamente em seu website, caso contrário, a caixa lateral ficará oculda em seu website
por não possuir um local apropriado para ela.
Posição: O funcionamento desse campo é idêntico ao funcionamento do campo “Posição” do item
“Adicionar Página ao Menu”, ou seja, é um campo numérico que ordena a visualização das caixas
em ordem crescente.
Título: Campo de texto onde será inserido o título da caixa. Esse título ficará visível em seu
website, portanto, você poderá utilizar acentuação, caracteres especiais e espaçamento no título
da sua caixa.
Inicial: Essa opção define se a caixa que você está criando aparecerá somente na página inicial do
seu website, ou seja, na página “index”, ou será apresentada por todo o website.
Aleatório: Caso o seu sitema possua a opção de apresentação de caixas aleatórias, você poderá
marcar essa opção para que as caixas que você criar com esse atributo fiquem revezando em seu
website à cada nova página aberta.

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 8
Fone: (64) 8401-6785
 Manual do Sistema WSD

Conteúdo: Aqui você deverá adicionar o conteúdo da sua caixa lateral e terá todos os recursos de
formatação disponíveis para utilização. Lembre-se que caixas laterais devem passar informações
breves à respeito do seu website. Evite preencher esse campo com conteúdos extensos e imagens
que tenham um tamanho inadequado para o posicionamento da página. Caso você não saiba o
tamanho máximo de imagem suportado pelas caixas laterais do seu website, entre em contato com
o suporte técnico para obter essa informação. Lembre-se de clicar no botão “Salvar” para
salvar as opções de sua caixa lateral.
Nota: O conteúdo das caixas laterais não devem conter informações detalhadas sobre qualquer
área do seu website. As caixas laterais foram criadas para conteúdos breves e/ou chamativos para
alguma outra página do seu website.

Editar Caixa Lateral

Através dessa opção você poderá editar as caixas previamente criadas em seu website e seu
funcionamento é idêntico à opção “Criar Caixa Lateral” diferindo-se apenas pelas opções e
conteúdo já preenchidos anteriormente. Lembre-se de, ao terminar a edição de sua caixa lateral,
clicar no botão “Salvar” para salvar as opções modificadas.

Excluir Caixa Lateral

O funcionamento dessa opção é idêntico ao funcionamento da opção “Excluir Página” e você

deverá utiliza-la para excluir uma caixa lateral do seu website. Como na opção “Excluir Página”, a
exclusão de uma caixa lateral não afetará os arquivos anexos à essa página, como imagens e outros
arquivos que você inserir em sua caixa lateral.

Recursos Especiais do Conteúdo Estático

Como você já pode perceber, através das opções do “Conteúdo Estático” você poderá criar páginas
livremente em seu sistema. Agora você aprenderá algumas informações adicionais para a criação
de conteúdo em seu site.

Trabalhando com imagens

O recurso mais fantástico do conteúdo estático é a opção de trabalhar com imagens dentro dos
documentos. Através das opções de imagens você poderá inserir imagens em seu conteúdo, enviar
imagens para o servidor e editar imagens que já estejam no servidor e disponíveis para uso.
O ícone utilizado para inserir imagem no conteúdo do seu website é o “Insert/edit image” e
através dele você poderá inserir e editar imagens no seu conteúdo. Clicando neste item você terá
acesso à seguinte caixa de opções:

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 9
Fone: (64) 8401-6785
 Manual do Sistema WSD

Nessa caixa de opções você tem acesso às abas: Geral, Aparência e Avançado.
Na aba “Geral” você tem as opções: Image URL, Image Description, Titulo e Visualizar.
Image URL: Aqui você deverá inserir a URL da imagem que você quer inserir no seu website. Caso
você já tenha a imagem no servidor e queira utiliza-la, basta clicar no botão “Browse” para ter
acesso às imagens já salvas no servidor ou para enviar novas imagens. Veremos mais sobre essa
opção mais adiante.
Image Description (Descrição da Imagem): Essa opção é voltada para a usabilidade e legibilidade
do website e você deverá preenche-la exatamente com a descrição da imagem que está inserindo.
Essa opção é bastante útil para visitantes com problemas visuais e que utilizam um leitor de tela
para ler o conteúdo de um website. Através da descrição da imagem o visitante poderá ter noção
da mensagem que a imagem quer passar.
Titulo: Essa opção dará um título à imagem em seu conteúdo. Esse título é importante para
pessoas que navegam com a opção de exibir imagens desabilitada em seus navegadores, seja por
comodidade ou por economia de banda. Coloque sempre um título pertinente na sua imagem.
Em “Aparência” você terá as seguintes opções: Alignment, Dimensions, Vertical Space, Horizontal
Space, Border, Class e Estilo.

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 10
Fone: (64) 8401-6785
 Manual do Sistema WSD

Alignment (Alinhamento): Corresponde ao alinhamento da imagem. Você poderá defini-lo de

acordo como seu encaixe no texto. Baseline (Linha de Base), Top (Topo), Middle (Meio), Bottom
(Inferior), Text-top (Topo do Texto), Absolute Middle (Meio Absoluto), Absolute Bottom (Inferior
Absoluto), Left (Esquerda) e Right (Direita).
Dimensions (Dimensões): Aqui aparecerá as dimensões da imagem que você está inserindo. A
menos que você saiba o que está fazendo, não mexa nessa opção para não desfocar a sua imagem.
A caixa “Manter Proporções” serve para manter as proporções da imagem caso você queira alterar
as suas dimensões.
Vertical space (Espaço Vertical): Será o espaçamento vertical da imagem e relação ao texto.
Horizontal space (Espaçamento Horizontal): Será o espaçamento horizontal da imagem em
relação ao texto.
Border (Borda): Você poderá adicionar ou remover a borda da imagem através dessa caixa.
Class (Classe): Caso você tenha feito uma folha de estilos própria, você poderá aplicar uma classe
de estilo à imagem através dessa caixa. Não mecha nessa opção à menos que você saiba o que está
fazendo.
Estilo: Você também poderá criar um estilo próprio para a imagem caso você tenha conhecimentos
em folhas de estilo CSS.
Em “Avançado” você terá as opções avançadas de edição de imagem. Não é recomendado o uso
das opções avançadas caso você não tenha certeza do que está fazendo.

Browse – Navegar pelas imagens do servidor

Essa é com certeza uma das opções mais utilizadas nesse sistema, pois através dela você poderá
enviar imagens para o servidor e fazer algumas edições básicas de imagem. Para isso, clique no

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 11
Fone: (64) 8401-6785
 Manual do Sistema WSD

botão “Browse” da aba “Geral” do comando “Insert/edit image”.

Ao clicar no botão “Browse” você terá acesso à todas as imagens que você enviou para o
servidor e, caso não tenha enviado nenhuma imagem, terá a opção de enviar imagens à partir de
agora.

Nessa tela você terá acesso à escolher uma imagem para adicionar ao seu website, editar uma
imagem previamente enviada para o servidor, criar um novo diretório para armazenagem de
imagens e enviar imagens para o servidor.
Create Directory (Criar Diretório): Através dessa opção você poderá criar um novo diretório
para a armazenagem das imagens no servidor.
Upload new image (Enviar nova imagem): Através dessa opção você poderá enviar uma nova
imagem para o servidor, basta selecionar a imagem que você quer enviar e o sistema
automaticamente já salvará essa imagem dentro do seu diretório atual para que você possa utiliza-
la no conteúdo do seu website.
Refresh (Atualizar): Essa opção recarregará todo o seu quadro de imagens disponível no
servidor, atualizando, dessa forma, as miniaturas das imagens apresentadas na tela.
Preview (Pré-visualizar): Essa opção permite que você visualize a imagem em tamanho real
antes de adiciona-la ao conteúdo do website.

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 12
Fone: (64) 8401-6785
 Manual do Sistema WSD

Informações do Arquivo: Colocando o mouse sobre esse botão você terá acesso à informações
do arquivo de imagem como: Largura, Altura, Tipo, Tamanho e Escala da imagem.
Excluir: Clicando nesse botão você automaticamente removerá a imagem do servidor. Somente
remova uma imagem do servidor depois que você tiver certeza de que essa imagem não está sendo
utilizada em uma página, caso contrário, a página apresentará um link quebrado para a imagem.
Ferramentas: Nas ferramentas de imagem você terá acesso à edição de imagens online. Através
dessas ferramentas você poderá redimensionar e/ou cortar a imagem para a utilização no website.
Para selecionar a imagem a ser utilizada no conteúdo do website, basta clicar em cima da imagem
para que a URL da mesma seja apresentada na caixa “Image URL” da aba “Geral”.

Trabalhando com Links

Links são ligações para páginas externas dentro de um conteúdo. Para adicionar um link basta
selecionar o texto e/ou imagem que você deseja vincular e clicar no botão “Insert/edit link”,
abrirá então uma caixa com as seguintes opções: Link URL, Âncoras, Target, Class.

A aba “Geral”

Link URL: Aqui você deverá colocar a URL (endereço) da página que você deseja vincular com o
seu conteúdo. Para as páginas criadas por você na opção “Criar Página”, o link correto será
“/pagina/nomedapagina”, ou seja, caso você tenha criado a página “quemsomos”, o link para ela
será “/pagina/quemsomos”.
Âncoras: As âncoras são vínculos que não levam à uma página externa, mas sim à uma parta
específica do texto.

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 13
Fone: (64) 8401-6785
 Manual do Sistema WSD

Target: A opção target indicará o comportamento do seu link ao ser clicado e como ele será
aberto.
Title: O título de um link será exibido ao posicionar o mouse em cima do link ou, no caso de um
deficiente visual utilizando um leitor de tela, servirá como uma descrição sobre o link.

Aba “Popup”
Através da aba popup você poderá definir que, ao clica em um link, ao invés do link ser aberto em
uma janela padrão do navegador do usuário, o alvo em questão abra em uma janela personalizada
do navegador do usuário. Não é recomendada a utilização dessa opção ao menos que você saiba
exatamente o que está fazendo.

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 14
Fone: (64) 8401-6785
 Manual do Sistema WSD

Usuários do Sistema
Através do menu usuários do sistema você poderá gerenciar os usuários que terão acesso à área
administrativa do seu website, ou seja, esses usuários terão toda a liberdade de alterar o conteúdo
do seu website à qualquer momento.
Importante: Qualquer alteração feita por um usuário cadastrado no sistema é permanente e não
poderá ser desfeita.

Listar Usuários

Através da listagem de usuários você terá acesso à todos os usuários cadastrados no sistema e
poderá modificar e/ou excluir esses usuários.
Na tela de listagem de usuários você terá acesso à lista de usuários com as seguintes informações:
Nome, Login, Nível de Acesso e Data de Cadastro.
Nome: Exibe o nome cadastrado para o usuário;
Login: Exibe o login de acesso do usuário. É através desse login que o usuário poderá acessar o
sistema.
Nível de Acesso: Esse campo mostrará duas opções, sendo elas: Administrador do Sistema e
Usuário. Atualmente para que o usuário tenha acesso à área administrativa, o mesmo deverá ser
cadastrado como Administrador do Sistema, o nível de acesso “Usuário” é reservado para futuras
atualizações do sistema que poderão incluir outras funcionalidades ao seu website.
Data de Cadastro: Informa a data e a hora em que o usuário foi cadastrado.
Ao lado da listagem de cada usuário, você poderá notar 02 (dois) ícones, sendo eles: Editar
Usuário e Remover Usuário.
Editar Usuário: Tem como objetivo a edição dos dados do usuário e também a sua senha de
acesso. Caso você deseje atualizar somente alguns dados do usuário sem alterar a sua senha de
acesso ao sistema, basta deixar o campo “Senha” e “Confirmar” em branco. Dessa forma o sistema
automaticamente ignorará qualquer alteração na senha do usuário.
Remover Usuário: Clique nesse ícone para remover o usuário do sistema. Essa mudança não
poderá ser desfeita.
Importante: Caso não exista nenhum usuário cadastrado no sistema você não poderá mais fazer
alterações em seu website e, para que sejam cadastrados novos usuários, você terá que entrar em
contato conosco para que possamos corrigir o problema.

Adicionar Usuário

Utilize essa opção para cadastrar um novo usuário que terá acesso à área administrativa do seu
website. Nessa opção você deverá preencher os seguintes campos: Nome, Acesso, Login, Senha e
Confirmar.
Nome: Esse campo deverá ser preenchido com o nome completo do usuário.

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 15
Fone: (64) 8401-6785
 Manual do Sistema WSD

Acesso: Definirá o nível de acesso do usuário. Atualmente para que o usuário tenha acesso à área
administrativa, o mesmo deverá ser cadastrado como Administrador do Sistema, o nível de acesso
“Usuário” é reservado para futuras atualizações do sistema que poderão incluir outras
funcionalidades ao seu website.
Login: Será o nome fornecido pelo usuário para acessar o sistema.
Senha: Senha do usuário para acessar o sistema.
Confirmar: Confirmação da senha do usuário. O cadastro do usuário só poderá ser feito caso você
digite corretamente a senha do usuário nas duas caixas, caso haja qualquer diferença entre as duas
senhas, o sistema emitirá uma mensagem de erro e o cadastro do usuário não será possível.
Após preencher os dados, clique no botão “Enviar” para completar o cadastro do novo usuário.

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 16
Fone: (64) 8401-6785
 Manual do Sistema WSD

Ajuda e Suporte
Caso você necessite de ajuda na utilização do seu Sistema WSD, existem vários canais onde obter
esse ajuda:
Website: Acesse o site http://www.euler.eti.br e entre em contato conosco através do
atendimento online ou do formulário de contato do site;
Email: Envie um e-mail para suporte@euler.eti.br com suas dúvidas e/ou sugestões;
Telefone: Entre em contato também através do telefone (64) 8401-6785, atendemos nesse
número 24h por dia, 7 dias por semana para que a sua solicitação sempre seja atendida.

Euler.eti.br – Soluções em Internet

http://www.euler.eti.br
Pág. 17
Fone: (64) 8401-6785