Your SlideShare is downloading. ×
0
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
aula 02 - WordPress
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

aula 02 - WordPress

1,954

Published on

aula 02 do mini curso sobre wordpress, primeiro congresso de tecnologias na educação

aula 02 do mini curso sobre wordpress, primeiro congresso de tecnologias na educação

Published in: Education
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,954
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
153
Comments
0
Likes
2
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  1. segundo dia
  2. Ementa <ul><li>Primeiro dia: </li></ul><ul><ul><li>Introdução e visão geral </li></ul></ul><ul><li>Segundo dia: </li></ul><ul><ul><li>Template </li></ul></ul><ul><li>Terceiro dia: </li></ul><ul><ul><li>Blogando </li></ul></ul><ul><li>Quarto dia: </li></ul><ul><ul><li>Criando páginas e Links </li></ul></ul><ul><li>Quinto dia: </li></ul><ul><ul><li>Gerenciando e Comentando </li></ul></ul>
  3. Neste dia <ul><li>Templates </li></ul><ul><li>Conhecer e aplicar os Temas disponíveis </li></ul><ul><li>Aplicar Complementos </li></ul><ul><li>Alterar opções </li></ul>
  4. Acesse sua conta <ul><li>Acesse a sua conta no WordPress: www.wordpress.com . </li></ul>Caso contrário deverá fazer o login com seu nome de usuário e senha, não o nome do blog, o seu nome de usuário e sua senha. Caso você tenha ativado a caixa “Lembrar minha senha” (Remember me) sua entrada será automática.
  5. Acesse sua conta <ul><li>Altere o idioma para “Português do Brasil”. </li></ul>
  6. Acesse a área administrativa do Blog <ul><li>Clique em “Meu painel de controle” para ter acesso às ferramentas de administração do seu blog. </li></ul>
  7. Acesse a área de controle da aparência <ul><li>Clique em “Aparência” para ter acesso às opções que alteram a forma como o seu Blog é exibido. </li></ul>
  8. Conhecendo os temas disponíveis <ul><li>Nesta etapa você irá conhecer os Templates disponíveis, navegará entre as opções prontas, ativará algumas e reconhecerá as diferenças entre elas. </li></ul>Páginas com mais temas disponíveis. Tema atual e suas possibilidades de edição.
  9. Ativando um tema disponível <ul><li>Localize o tema “Benevolence”, na página 1, e dê um clique na imagem para abrir a imagem de ativação. </li></ul>Clique na imagem ou no nome do tema para abrir a ampliação e poder ativar. Descrição do tema. Filtros de pesquisa.
  10. Ativando um tema disponível <ul><li>Observe o botão de fechar o tema sem ativar. </li></ul><ul><li>Dê um clique no link “Ativar “Benevolence””. </li></ul>Botão para fechar o tema sem ativá-lo.
  11. Ativando um tema disponível <ul><li>O tema é selecionado e a página retorna automaticamente para a área administrativa, indicando o sucesso da operação. </li></ul><ul><li>Observe as opções de edição automática que este tema disponibiliza. </li></ul>
  12. Ativando um tema disponível <ul><li>Localize a opção “DePo Masthead”, ative-a e observe que suas opções de edição são diferentes. </li></ul>
  13. Dica: layout e conteúdo <ul><li>Você poderá repetir este procedimento sempre que desejar, sem perder o conteúdo do seu Blog: </li></ul><ul><ul><li>Layout e conteúdo são independentes no WordPress. </li></ul></ul>
  14. Dica: buscar por um layout específico <ul><li>Se desejar buscar algum layout mais específico, clique na seta da caixa “mostrar todos os temas”, observe as opções disponíveis com a barra de rolagem, clique na opção desejada e em seguida, clique no botão “Filter”. </li></ul>
  15. Ativando o tema utilizado no curso <ul><li>Dê um clique na seta da caixa “mostrar todos os temas”. Clique na opção “Blue” e em seguida clique no botão “Filter”. </li></ul><ul><li>Localize a opção “Contempt” e ative-a. </li></ul>
  16. Ativando Complementos <ul><li>Dê um clique na opção “Complementos”. </li></ul><ul><li>Esta seção mostra os assessórios que estão disponíveis e os utilizados em seu layout. </li></ul>Nome do complemento. Link de ativação do complemento. Descrição do complemento.
  17. Ativando Complementos <ul><li>Ative os Complementos indicados acima. </li></ul><ul><li>Localize o nome do Complemento a ser ativado e clique no respectivo link “Adicionar”. </li></ul><ul><li>Ao final, clique no botão “Salvar Mudanças” </li></ul>
  18. Editando um complemento: Text <ul><li>Dê um clique no botão “Edit” do complemento “Text”. </li></ul>
  19. Editando um complemento: Text <ul><li>Digite o texto acima, não é necessário mudar de linha, digite na sequência. Em seguida, clique no botão “Alterar” </li></ul><a href=&quot;http://internetnaeducacao.blogspot.com/&quot; target=&quot;_blank“><img src=&quot;http://photos1.blogger.com/blogger/4323/2700/1600/seloComunidade.jpg&quot; alt=&quot;selo da comunidade Blogs Educativos&quot; width=&quot;180&quot; height=&quot;158&quot; /></a>
  20. Editando um complemento: Text <ul><li>Dê um clique no botão “Salvar alterações” para salvar sua alteração. Em seguida clique em “ver o site”. </li></ul>
  21. Editando um complemento: Text <ul><li>Este é o resultado, a imagem está inserida e, se clicada, levará você ao site da comunidade Blogs Educativos. Não é necessário clicar. Volte à página anterior utilizando a seta do navegador, conforme indicado na imagem acima. </li></ul>ou firefox 3.0 internet explorer 7.0 Resultado da caixa de texto alterada
  22. Dica: edição de complementos <ul><li>Para editar um complemento (widget), basta ativá-lo e clicar no link “editar”. </li></ul><ul><li>Cada controle possui suas próprias opções de edição. </li></ul><ul><li>Para que a mudança tenha efeito, você deve clicar novamente no botão “Salvar mudanças”. </li></ul>
  23. Dica: edição de caixa de texto <ul><li>Código HTML/XHTML pode ser inserido em caixas de texto. </li></ul><ul><li>Códigos mais complexos, como por exemplo <object> de vídeo do Youtube, não deram resultado. </li></ul><ul><li>Na dúvida: faça o teste. Coloque o código que deseja testar, salve, visualize no navegador o resultado. </li></ul><ul><li>Para saber mais sobre HTML/XHTML, visite: http://www.w3schools.com/xhtml/default.asp </li></ul>
  24. Configurando opções Extras <ul><li>Dê um clique na opção “Extras”. </li></ul><ul><li>Deixe as caixas conforme indicado na figura e clique no botão “Atualizar extras”. </li></ul>
  25. Dica: Snap Shot <ul><li>Snap Shots são pequeno quadros que se abrem em todos os seus links, para que o visitante tenha uma pré-visualização do conteúdo do link </li></ul>Resultado obtido nos links do seu Blog com a opção “Snap Shot” ativa.
  26. Dica: Esconder links relacionados <ul><li>Quando ativa, esta opção faz com que seus Posts não possam ser visíveis em outros blogs, impossibilitando que terceiros obtenham tráfego com suas postagens. </li></ul>
  27. Configurando a imagem de cabeçalho <ul><li>Dê um clique na opção “Imagem de Cabeçalho Personalizada”. Nesta seção, você pode trocar a imagem de cabeçalho além de outras edições. </li></ul>Pré-visualização da imagem atual. Opções de edição simples. Opções para o carregamento de uma nova imagem.
  28. Configurando a imagem de cabeçalho <ul><li>Este é o resultado da imagem de cabeçalho com as configurações originais do tema escolhido. </li></ul>
  29. Configurando a imagem de cabeçalho <ul><li>Dê um clique no botão “Selecione uma Cor de Texto”. Clique na cor da janela e observe o resultado (repita o procedimento se desejar outra cor). Em seguida clique novamente no botão “Selecione uma Cor de Texto” para fechar a janela de cores. </li></ul>
  30. Dica: salvando a cor do texto alterada <ul><li>Você pode salvar a mudança clicando no botão “Salvar Mudança”, mesmo que a janela de cores ainda esteja aberta. </li></ul>
  31. Configurando a imagem de cabeçalho <ul><li>Dê um clique no botão “Esconder texto” e observe o resultado. Em seguida clique no botão “Salvar mudanças”. </li></ul>
  32. Dica: para voltar o texto escondido <ul><li>Se quiser que o texto original apareça novamente, dê um clique no botão “Mostrar texto”. </li></ul>
  33. Configurando a imagem de cabeçalho <ul><li>Dê um clique no botão “Escolher arquivo”, escolha o arquivo “imagem_superior_texto_az.jpg”. Em seguida clique no botão “Enviar”. </li></ul>
  34. Configurando a imagem de cabeçalho <ul><li>Aguarde até que a imagem tenha sido enviada. </li></ul><ul><li>Dê um clique com o botão direito do mouse no botão “Visite o Site” para visualizar o Blog em uma nova guia, aba ou página, conforme o seu navegador. </li></ul>Chrome FireFox 3 Internet Explorer 7
  35. Configurando a imagem de cabeçalho <ul><li>Este é o resultado obtido das configurações feitas neste segundo dia. </li></ul>
  36. Dica: observe o tamanho da imagem <ul><li>Cada Tema possui um tamanho diferente de imagem de cabeçalho. </li></ul>
  37. Dica: trabalhar com abas (ou guias) <ul><li>Procure trabalhar com guias (ou abas) do seu navegador. Mantenha uma aba do navegador com a página administrativa do seu Blog e outra aba com o Blog propriamente dito. Faça suas alterações na área administrativa, clique na aba do Blog e pressione a tecla F5 (ou o comando de atualizar janela equivalente). </li></ul><ul><li>Alguns navegadores que possuem navegação por abas: </li></ul><ul><ul><li>Chrome </li></ul></ul><ul><ul><li>FireFox </li></ul></ul><ul><ul><li>Internet Explorer 7 </li></ul></ul><ul><li>Uma alternativa é trabalhar com 2 janelas abertas de navegador, uma com a área administrativa e outra com o blog. Altere na área de administração, clique na janela do Blog e atualize a visualização (F5). </li></ul>
  38. Dica: para promover novas alterações <ul><li>Clique novamente na opção “Imagem de Cabeçalho Personalizada”. Envie uma nova imagem ou clique no botão “Restaurar cabeçalho original” para começar do modelo original do tema. </li></ul>
  39. Lembrete: botão “Salvar mudanças” <ul><li>Lembre-se de clicar no botão “Salvar mudanças” para poder registrar as alterações realizadas. </li></ul>
  40. Dica: programa grátis e online de edição de imagens <ul><li>Um programa free, online e profissional de edição de imagens: https://www.photoshop.com/express </li></ul>
  41. Próximo encontro Dar a sua cara ao blog é extremamente importante. A próxima etapa será inserir o seu conteúdo. Este será o tema do próximo encontro!! até lá!!

×