REITORA Ulrika Arns. VICE-REITOR Almir Barros da Silva Santos Neto. DIRETOR DO NTIC Leonardo Bidese de Pinho

Transcrição

1 REITORA Ulrika Arns VICE-REITOR Almir Barros da Silva Santos Neto DIRETOR DO NTIC Leonardo Bidese de Pinho COORDENAÇÃO DE APOIO AO USUÁRIO Sandro da Silva Camargo

2 UNIVERSIDADE FEDERAL DO PAMPA NTIC - NÚCLEO DE TECNOLOGIA DA INFORMAÇÃO E COMUNICAÇÃO MANUAL SITES UNIPAMPA WORDPRESS e Setembro/2014 Concepção e Desenvolvimento Allan Sampaio Pires Analista de TI Jean Samarone Almeida Ferreira Analista de TI

3 Login no painel de controle Para login no painel de controle do Wordpress o usuário deverá acrescentar /wp-admin no final do endereço do site (exemplo: Os usuários cadastrados deverão utilizar usuário e senha institucional para acesso. Conteúdo Posts: são o conteúdo volátil do site. Cada postagem aparece na página inicial do site em ordem cronológica (a mais recente no topo do site) e possui dados próprios como título, data, hora, tags e categorias. Os posts devem ser agrupadas dentro de Categorias para organizar os assuntos do seu site. Para escrever uma postagem, vá em Painel > Posts > Adicionar Novo. Páginas: são o conteúdo estático do seu site e podem ser mostradas na barra lateral de seu site, por exemplo. Ao contrário de postagens, as páginas não podem ser agrupadas em categorias. Elas devem conter informações fixas, por exemplo, uma página Sobre com informações do site, Portifólio sobre trabalhos realizados etc. Para criar uma página, vá em Painel > Páginas > Adicionar Novo. Mídia: são arquivos de imagem, vídeo etc que podem ser enviados para o site e posteriormente utilizados em postagens ou páginas. Para enviar arquivos de mídia, vá em Painel > Mídia > Adicionar Novo. Links: é possível criar categorias de links e adicionar informações extras para cada um, como descrição, imagem etc. Para adicionar links, vá em Painel > Links > Adicionar Novo. Comentários: criam um intercâmbio dinâmico entre o administrador e o espectador. Os comentários devem ser moderados para evitar Spam, para isso basta ir ao painel Comentários para ver comentários feitos no site. Para auxílio a criação do site, o WordPress possui itens de informação para organização de conteúdo que são descritas a seguir. Categorias As postagens devem ficar em Categorias e cada categoria pode ter subcategorias. Veja um exemplo: Campus Alegrete: Graduação - Pós-graduação - Extensão

4 Campus Bagé: Graduação - Pós-graduação - Extensão Campus Caçapava do Sul: Graduação - Pós-graduação - Extensão Observe que a subcategorias aparecem nas diferentes categorias, mas não há problema porque a categoria-mãe é diferente. Então o caminho para uma postagem será: Campus Alegrete/Graduação/Engenharia Civil Campus Bagé/Graduação/Música Tags As tags (do inglês etiquetas), servem para classificar uma postagem através de palavras-chaves. Os visitante podem clicar sobre as palavras-chave para ver postagens relacionadas. Por exemplo: Campus Alegrete/Graduação/Engenharia Civil A postagem Engenharia Civil contém as matérias e informações sobre o curso além de dicas e comentários dos visitantes. Palavras-chave sobre essa postagem: calculo, geometria, algebra Então, se algum visitante quiser cursos com estas matérias, ele pode clicar no link (que os temas devem mostrar) e assim ver uma lista de postagens com esta etiqueta. Não há limite de tags que podem ser criados e usados em postagens. Enquanto se escreve postagens é possível criar tags e também através de Posts >Tags da Postagem, onde podem ser adicionados uma descrição sobre a tag. Editor de Texto Título da Publicação Opções Avançadas: Habilita segunda barra de ferramentas Ferramentas já conhecidas de outros editores: Botões de negrito, itálico e riscado. Marcadores de listas e opções de alinhamento. Opções de tamanho de fonte, sublinhado, cor da fonte. Copiar/Colar. Inserir a tag Mais (para notícias): Esta opção permite que você divida o texto entre o que vai aparecer na página inicial do site e o que somente irá aparecer quando o visitante clicar na notícia. Inserir um link: Após selecionar a palavra que quer gerar um link, clique nesta opção e insira o endereço do site ou arquivo.

5 Upload/Inserir Clique no ícone Upload/Inserir logo acima da barra de ferramentas (figura abaixo) para inserir mídia ou até mesmo criar uma galeria de imagens, para isto deve-se escolher uma das opções. Na janela que abrirá poderão ser escolhidas as abas: Fazer upload dos arquivos: enviar uma imagem que está no seu computador; Biblioteca de mídia: usar uma imagem que já foi enviada para o site. No caso de escolher Fazer upload dos arquivos, clique em Selecionar para localizar o arquivo de imagem que está no seu computador. Certifique-se que a imagem está em JPG, PNG ou GIF. Clique em abrir para enviar o arquivo. Após o envio, você pode definir algumas características da imagem, como o título, legenda, descrição, alinhamento e o tamanho da imagem na publicação. Para isto deve-se clicar em cima da imagem e clicar no ícone Editar Imagem.

6 Mais informações no link: %C3%A1ginas

7 Widgets Widgets são ferramentas que o tema nos oferece para adicionarmos conteúdos nos espaços laterais do site. Para adicionarmos widgets devemos ir em Aparência > Widgets e arrastarmos as opções desejadas do meio para o espaço da esquerda. Para adicionarmos, por exemplo, um banner na coluna direita do site devemos arrastarmos Texto para Right Sidebar onde devemos acrescentar o código HTML necessário e clicar no botão Salvar.

8 Opções de Tela A aba Opções de Tela aparece na parte superior do editor de texto ao inserir um novo post ou página. Esta aba permite selecionar algumas opções: Categorias; Tags; Imagem destacada; Resumo: permite o autor escrever um resumo sobre a página ou post; Enviar Trackbacks: forma de notificar sistemas de blog obsoletos que você criou um link para eles. Se você criar links para outros sites WordPress eles serão notificados automaticamente usando Pingbacks, nenhuma outra ação é necessária; Campos Personalizados: podem ser usados para adicionar metadados adicionais a um post;

9 Discussão: permite comentários; Slug: opção de um caminho mais amigável para posts e páginas; Autor: mostra o autor do post ou página ; Metadata: tags que podem ser colocados no cabeçalho HTML do site, e podem ser interpretados por outros sistemas. Nas opções de tela também é possível alterar o layout do conteúdo para uma ou duas colunas. Shortcodes Um shortcode é um mecanismo que permitem a inserção de objetos de forma simples e eficiente, sem a necessidade de utilização de códigos complexos. Podem ser inseridos vídeos, áudio, imagens, formulários, documentos e outros objetos. Para colocar, por exemplo, um vídeo do youtube de forma bastante simples, basta mudar o editor de texto do modo visual para o modo HTML e inserir o seguinte código com o link desejado: [youtube= ] A lista dos shortcodes e instruções de uso podem ser encontrados no link abaixo: Menus A versão atual do Wordpress permite maior liberdade ao usuário possibilitando a construção e personalização de seus menus. Para isso o usuário deve ir em Aparência > Menus, escolher um nome para o novo menu e clicar no botão Criar Menu. Após esta etapa será possível criar itens, como links e páginas ou adicionar páginas e categorias existentes. Primeiramente deve ser criado o menu que será utilizado, nomeando o novo menu e logo após clicando no botão Criar menu, como pode ser observado na figura abaixo.

10 Após esta etapa é possível criar e organizar os itens do menu. Aqui é possível escolher o menu que deseja-se utilizar no site. Adiciona links externos ao menu. Adiciona páginas existentes no site ao menu. Adiciona categorias existentes nos site ao menu. No link abaixo é possível encontrar um tutorial em vídeo que mostra a utilização de menus: Instalação da agenda Google Instruções para disponibilização de agenda do gmail nos sites das pró-reitorias No site da pró-reitoria (wordpress), criar uma nova página com o nome de agenda. Publicar e manter a página aberta para edição no modo HTML.

11 Nome da página Endereço Modo HTML Acessar no gmail as configurações da agenda que você quer disponibilizar no site. Configurações Em Compartilhar esta agenda, alterar a forma de compartilhamento para pública.

12 Compartilhar esta agenda Agenda pública Em Detalhes da agenda, copiar o código conforme a figura abaixo. Detalhes da agenda Copiar o código

13 Voltando ao site da pró-reitoria (wordpress), colar o código na página agenda, no modo HTML do editor e alterar o parâmetro de largura (width= 550 ). Editor no modo HTML Código copiado do gmail 6- Acessar o site para visualizar o resultado

14 Referências Site Wordpress.org, consultado em maio de 2013: Site Hostnet, consultado em maio de 2013: