UNIVERSIDADE FEDERAL DE JUIZ DE FORA UFJF

Secretaria de Sistemas de Informao SSI

Centro de Gesto do Conhecimento Organizacional CGCO
Equipe de Desenvolvimento de Sites

Manual do Usurio Layout Novo

CMS WordPress
Verso atual: 3.5.1

1- Introduo
O Centro de Gesto do Conhecimento Organizacional, CGCO, criou, em maro de 2008,
uma equipe para atender demanda de criao de novos sites para a Universidade Federal de
Juiz de Fora, UFJF, oferecendo um servio em que o usurio tenha autonomia para administrar
todo contedo do site, de maneira simples e fcil. Esse servio facilita a padronizao, o
controle e a manuteno dos sites hospedados na UFJF, acabando com a dependncia de
empresas externas, o que implica tambm em economia para a Universidade. Outro fator a
destacar a melhoria da segurana em termos de hospedagem de sites, com equipamentos
mais modernos, backups automatizados e constante acompanhamento das novas verses dos
programas, com o objetivo de beneficiar essa melhoria. A Equipe de Desenvolvimento de Sites
realizou um estudo sobre as ferramentas de gerenciamento de contedo existentes, em software
livre, e que pudessem atender a todas as especificaes levantadas pela equipe. A ferramenta
escolhida foi WordPress, a qual apresentada abaixo.
2 - Tela de Entrada
Para acessar o painel administrativo do site, deve-se digitar no browser (navegador) o seguinte
endereo:

http://www.ufjf.br/seusite/wp-admin/

Onde seusite o nome escolhido no ato de sua requisio.

Em seguida, aparecer a tela de login para acesso ao contedo do site, onde deve ser inserido o
Nome de usurio e a Senha.

Julho/2014 Pgina 1

No topo dessa primeira tela, h uma barra de acesso rpido s funcionalidades do sistema, bem
como o nome do site que est sendo administrado e a opo de perfil de usurio (identificada no
exemplo por Ol, cgco).

Julho/2014 Pgina 2

Ao trmino das edies do site, importante sair do sistema. Para isso, clique na opo de perfil
do usurio e depois em Sair, conforme a figura acima.
Do lado esquerdo, h um menu de acesso a todas funcionalidades, e que possui um sistema
diferenciado para visualizao dos itens.

Conforme mostrado no exemplo acima, ao passar o mouse no item Posts do menu principal,
exibido um outro menu do lado direito, que, ao ser clicado, expande-se para baixo.
No fim do menu principal, existe o boto Recolher Menu. Ele reduz todos os itens a cones.
No canto superior direito, aparecem as Opes de Tela. Ao serem desmarcadas, permite que
os itens correspondentes no apaream nas telas do gerenciador.

Julho/2014 Pgina 3

3 - Mudana de Senha
Para alterao de senha, basta ir na barra superior e clicar em Ol, nome do usurio e, em
seguida, Editar Meu Perfil. Uma outra opo acessar Usurios no menu esquerda e, em
seguida, Seu perfil.

Ao final da tela de configuraes do perfil, preencher duas vezes o campo Nova senha. Em
seguida, clicar no boto Atualizar perfil.

Julho/2014 Pgina 4

4 - Imagem principal (logo)

Pode ser modificada atravs do menu Ferramentas -> Imagem principal (NOVO), com uma
imagem em formato .jpg, dimenses de 1024 x 100 pixels e, no mximo, 1 Mb de tamanho.

Julho/2014 Pgina 5

5 - Pginas
5.1 - Criar nova pgina
Para criar uma nova pgina, clicar no menu esquerda em Pginas e no submenu Adicionar
nova.

Inserir ttulo e contedo, atravs do editor, conforme figura acima. Para somente salvar, clicar
em Salvar como rascunho. Para verificar como a pgina ser apresentada, clicar em
Visualizar. Para disponibilizar a pgina, clicar no boto Publicar.
Para mais opes do editor de textos, clicar no cone denominado Mostrar/Esconder Extras (Alt
+ Shift + Z), conforme destacado em vermelho na figura acima.

Julho/2014 Pgina 6

5.2 - Editar pgina

Clicar no menu Pginas e no submenu Todas as Pginas. Com isso, aparecer uma lista e,
ao clicar no ttulo da pgina ou ao passar o mouse sobre o nome dela e clicar em Editar, o
modo de edio acionado.

Aps as alteraes, clicar no boto Atualizar para salv-las.

Para despublicar uma pgina, clicar em Editar no campo Status, conforme a figura abaixo, e
escolher Reviso pendente ou Rascunho. Em seguida, clicar em OK e em Atualizar.
Julho/2014 Pgina 7

O atributo Visibilidade pode ser alterado, de acordo com objetivo. A pgina pode ser pblica,
privada (acessvel somente pelos administradores do site) ou protegida por senha.

A data e a hora de publicao da pgina tambm podem ser alteradas, atravs do atributo
Publicado em:, conforme mostra a figura acima.
Lembrando que, aps todas as alteraes feitas, deve-se clicar nos botes OK e Atualizar.
OBSERVAES IMPORTANTES:
1- essencial que no se remova, no se renomeie e nem se mude o modelo das pginas
Resultado da Busca, Links, Avisos, Contato, Mailer e demais pginas que utilizem a integrao
com o sistema SIGA.
2- A pgina Inicial pode ter Modelo Padro ou modelo Pgina Inicial.

Julho/2014 Pgina 8

5.3 - A pgina Inicial com o modelo Pgina Inicial

O primeiro passo alterar o modelo para Pgina Inicial.

O contedo alimentado de forma diferente do restante das pginas do menu. necessrio que
se crie um post e que este seja categorizado como inicial (categoria j criada).

Esse contedo aparece na parte central da tela principal do site, conforme mostra a figura a
seguir.
Ao se criar um site novo, habilitado tambm um plugin de banners, que aparece do lado direito
do post inicial.

Julho/2014 Pgina 9

As imagens dos banners so inseridas atravs do menu do gerenciador denominado

Ferramentas -> Banners (NOVO). Deve-se utilizar imagens em formato .jpg, com dimenses de
270 x 210 pixels e tamanho mximo de 500 Kb cada.
Ainda nesse modelo de pgina inicial, possvel visualizar 2 avisos (posts) em destaque.

Julho/2014 Pgina 10

Para que eles recebam destaque, necessrio que se categorize o post como avisos
(categoria j criada) e os mesmos aparecero abaixo do post categorizado como inicial, na
pgina Inicial, conforme mostra a figura acima.

Julho/2014 Pgina 11

5.4 - Excluir pgina

Para excluir uma pgina, clicar no menu Todas as Pginas. esquerda do ttulo, marcar quais
deseja excluir, selecionar a ao em massa Mover para a lixeira e clicar em Aplicar.

Julho/2014 Pgina 12

Outra opo passar o mouse sobre a pgina que deseja excluir. Aparecero algumas opes
onde uma delas Lixeira.

Observao: essencial que no se remova, no se renomeie e nem se mude o modelo das

pginas Resultado da Busca, Links, Avisos, Contato, Mailer e demais pginas que utilizem a
integrao com o sistema SIGA.
5.5 - Ordem das pginas:

Esse atributo responsvel por controlar a ordem de aparecimento das pginas no menu e
submenus, de forma crescente.
Julho/2014 Pgina 13

Cada nova pgina criada recebe, por padro, a ordem 0 (zero). Se todas as pginas tiverem o
mesmo nmero, elas sero ordenadas alfabeticamente.
A sugesto dar um salto maior entre as pginas, para o caso de se querer inserir alguma entre
elas. Por exemplo: a Inicial seria ordem 0 (zero). A prxima seria ordem 5, e assim por diante.

5.6 - Submenus:

Conforme mostra a figura acima, a pgina Gerenciador de contedo, que aparece no menu
principal, possui uma subdiviso chamada Manuais. Portanto, o atributo Me da pgina
Manuais deve ser alterado para Gerenciador de contedo.
O modelo de todas elas deve ser Modelo Padro.

Observao: essencial que no se remova, no se renomeie e nem se mude o modelo das

pginas Resultado da Busca, Links, Avisos, Contato, Mailer e demais pginas que utilizem a
integrao com o sistema SIGA.

Julho/2014 Pgina 14

6 - Avisos
6.1 - Criar novo aviso
Para criar um novo aviso, clicar no menu Posts, esquerda do gerenciador. Em seguida, clicar
no submenu Adicionar Novo.

Inserir ttulo e contedo, atravs do editor, conforme figura acima. Para somente salvar, clicar
em Salvar como rascunho. Para verificar como o aviso ser apresentado, clicar em Visualizar.
Para disponibilizar o aviso, clicar no boto Publicar.
Para mais opes do editor de textos, clicar no cone denominado Mostrar/Esconder Extras (Alt
+ Shift + Z), conforme destacado em vermelho na figura acima.

6.2 Editar aviso

Clicar no menu Posts e no submenu Todos os Posts. Com isso, aparecer uma lista e, ao
clicar no ttulo do aviso ou ao passar o mouse sobre o nome dele e clicar em Editar, o modo de
edio acionado.

Julho/2014 Pgina 15

Aps as alteraes, clicar no boto Atualizar para salv-las.

Para despublicar um aviso, clicar em Editar no campo Status, conforme a figura abaixo, e
escolher Reviso pendente ou Rascunho. Em seguida, clicar em OK e em Atualizar.

O atributo Visibilidade pode ser alterado, de acordo com objetivo. O aviso pode ser pblico,
privado (acessvel somente pelos administradores do site) ou protegido por senha.
Julho/2014 Pgina 16

A data e a hora de publicao do aviso tambm podem ser alteradas, atravs do atributo
Publicado em:, conforme mostra a figura abaixo.

6.3 Excluir aviso

Para excluir um aviso, clicar no menu Todos os Posts. esquerda do ttulo, marcar quais
deseja excluir, selecionar a ao em massa Mover para a lixeira e clicar em Aplicar.

Outra opo passar o mouse sobre o aviso que deseja excluir. Aparecero algumas opes
onde uma delas Lixeira.

Julho/2014 Pgina 17

7- Dicas de formatao
7.1 - Mais opes no editor de texto
Clicar no cone Mostrar/Esconder Extras (Alt + Shift + Z).

7.2 - Copiar e colar texto vindo de outros programas

Para se utilizar a formatao padro do WordPress utilizado pela UFJF, deve-se seguir os
passos abaixo para que o texto no fique desconfigurado na visualizao do site.
Aps clicar no cone Mostrar/Esconder Extras (Alt + Shift + Z), aparecer uma segunda linha
de opes. Clicar no cone Colar como texto simples.

Julho/2014 Pgina 18

Uma nova janela ser aberta, onde o texto deve ser colado. Em seguida, clicar no boto
Inserir.

Julho/2014 Pgina 19

7.3 - Criar links no texto

Para criar um link, primeiro deve-se selecionar o texto desejado. Clicar no cone de uma
corrente, denominado Inserir/editar link (Alt + Shift + A).

Aparecer uma outra tela, onde dever ser digitado o endereo (URL) do link, o Ttulo (que a
parte do texto que foi selecionada previamente) e escolher se o link dever Abrir link em uma
nova janela/aba. H tambm a opo de se fazer o link para algo que j existe no prprio site
(pginas, notcias, imagens, etc.). Em seguida, clicar no boto Adicionar link.

Julho/2014 Pgina 20

7.4 - Colocar cor em links

Para se colocar cor em um link, preciso que ele esteja selecionado. Na segunda linha de
opes do editor, clique no cone com a letra A, Selecione cor do texto. Logo aps, escolha a
cor desejada.

7.5 - Inserir mdias

Para inserir uma mdia (imagens ou arquivos) no contedo do texto de um post ou pgina, clique
na opo Adicionar mdia.

Na prxima tela, clicar em Fazer upload dos arquivos e, em seguida, clicar no boto
Selecionar arquivos. Escolher as mdias a serem inseridas no texto.

Julho/2014 Pgina 21

Preencher os campos Ttulo e Legenda. Logo aps, escolher o alinhamento (Nenhum,

Esquerda, Centro ou Direita) e o tamanho. Ao final, clicar no boto Inserir no post ou Inserir na
pgina.

Julho/2014 Pgina 22

Ao clicar numa imagem dentro do contedo do texto, aparecero dois cones, Editar imagem e
Excluir imagem. O cone Editar imagem possui as opes de alterar tamanho, alinhamento,
ttulo e legenda.

Julho/2014 Pgina 23

Aps as modificaes, clicar no boto Atualizar.

Uma dica:
Procurar utilizar a extenso PDF ao disponibilizar os arquivos para download, pois eles no
sero modificados. Usar a extenso DOC s para os casos de download de arquivos que
precisaro ser preenchidos pelos usurios e retornados, como por exemplo, ficha de inscrio
para algum curso ou evento.

Julho/2014 Pgina 24

8 - Links
8.1 - Criar novo link
Para criar um novo link, clicar no menu esquerda em Links e no submenu Adicionar novo.

Preencher os campos Nome, Endereo (URL). No campo Destino, marcar a opo _blank.
Essa opo proporciona a navegao do link em nova janela ou aba.
Para finalizar, clicar no boto Adicionar link.
8.2 - Criar categoria de link
Dentro da visualizao da pgina, os links podem ser organizados por categorias, o que significa
reuni-los em um mesmo assunto. Por exemplo, categoria chamada Cursos de graduao.
Abaixo dela, viro os links para as pginas dos cursos, como Engenharia Eltrica, Cincias
Biolgicas, Medicina, e assim por diante.
Primeira Opo: Ao adicionar um link, antes de clicar no boto Adicionar link, conforme
mostrado no item 8.1, no campo Categorias, clique na opo + Adicionar nova categoria. Em
seguida, digite o nome da categoria a ser inserida e clique no boto Adicionar.

Julho/2014 Pgina 25

Para finalizar, clique no boto Adicionar link, conforme descrito no item 8.1.
Segunda Opo: Clique no menu esquerda no gerenciador, chamado Links, e no submenu
Categorias de Links.
Em seguida, digite o nome da categoria e clique no boto Adicionar nova categoria de links. O
campo Descrio opcional.

Julho/2014 Pgina 26

8.3 - Editar link

Clicar no menu esquerda no gerenciador, chamado Links, e no submenu Todos os Links.
Clicar no nome do link a ser alterado.

Aps fazer as modificaes, clicar no boto Atualizar link.

8.4 - Excluir links
Clicar no menu esquerda no gerenciador, chamado Links, e no submenu Todos os links.
Marcar na lista aqueles que desejar excluir. Em seguida, selecionar a ao Excluir, na caixa
Aes em massa, acima ou abaixo da lista. Logo aps, clicar no boto Aplicar.

Julho/2014 Pgina 27

Outra opo: na lista de links, passar o mouse sobre aquele que desejar excluir e escolher a
opo Excluir.

Observao: cuidado ao marcar a opo Nome, localizada acima ou abaixo da lista de links, e
clicar em Aplicar, pois seleciona todos os links ao mesmo tempo, correndo-se o risco de
apag-los.
9 - Plugins
Os sites possuem recursos ativados, chamados plugins, como por exemplo, a imagem na pgina
principal, banners, etc. Alguns esto localizados no menu esquerda no gerenciador, chamado
Ferramentas.

Para gerenci-los, basta localiz-los abaixo do menu Ferramentas e clicar sobre o nome. O
exemplo mostrado na tela acima do plugin da Imagem Principal (NOVO). Observe sempre as
especificaes pedidas para a sua correta utilizao.
No site da Equipe de Desenvolvimento de Sites do CGCO/UFJF, h uma lista dos recursos
disponveis para ativao. Acesse o endereo: http://www.ufjf.br/sites/gerenciador-de-conteudo

Julho/2014 Pgina 28

10 - Rodap
composto por um mapa com todas as pginas e o nome do site. Alm disso, pode possuir
informaes de contato ou localizao, de acordo com o interesse.

Essas informaes do rodap podem ser adicionadas atravs da criao de um post

categorizado como "rodape" (categoria j criada). Elas aparecero tambm na pgina Contato.

Julho/2014 Pgina 29

11 - Concluso
O presente manual apresentou as funcionalidades bsicas para gerenciamento dos sites. A
Equipe de Desenvolvimento de Sites trabalha sob demanda, tentando sempre atender da melhor
maneira possvel os pedidos dos usurios. Em caso de dvidas, deve-se entrar em contato com
a Central de Atendimento do CGCO, que funciona de 8 s 12h e de 13 s 17h, nos telefones
2102-3374 e 2102-3377. Pode-se tambm enviar um e-mail para web.cgco@ufjf.edu.br. A
equipe oferece o atendimento personalizado a cada site, nas dependncias do CGCO. Visando
a qualidade desse atendimento, a equipe solicita o favor de agend-lo com antecedncia,
atravs dos contatos acima. Todas as informaes necessrias esto disponveis no endereo
http://www.ufjf.br/sites. Atravs dele, possvel acompanhar as novidades, os novos sites
disponibilizados, datas de treinamentos, downloads (manuais, tutoriais, etc.), etapas para a
criao de sites, entre outras informaes.
A equipe agradece a compreenso e a participao no processo de
desenvolvimento de sites institucionais da UFJF.

Julho/2014 Pgina 30