Pro Yearly is on sale from $80 to $50! »

WPstress.com: WordPress inicial (3/3)

WPstress.com: WordPress inicial (3/3)

Formação inicial para novos utilizadores WordPress:
– temas e plugins
– plugins essenciais
– notas breves sobre SEO
– otimização
– child-themes

Fa986d6c48555d9dc105e5f77958fab1?s=128

Alvaro Gois dos Santos

November 13, 2014
Tweet

Transcript

  1. 
 Nas partes anteriores vimos: ! O que é o

    WordPress (e o Open Source…) A diferença entre wordpress.com e wordpress.org O que podemos fazer com o WordPress: temas e plugins Como é que se instala o WordPress e se aloja um site Algumas regras de segurança na instalação A administração do WordPress O que são páginas, artigos, categorias… Como criar conteúdo e carregar imagens
  2. 
 Nesta parte vamos: ! Conhecer temas e plugins e

    como os escolher Plugins essenciais:  segurança, desempenho, etc. Otimizar Editar temas Criar temas dependentes (child themes)
  3. O local indicado para começar a procurar temas e plugins

    é o repositório do WordPress.org ! TEMAS – http:/ /wordpress.org/extend/themes/ PLUGINS – http:/ /wordpress.org/extend/plugins/
  4. NUNCA NUNCA NUNCA instalar temas ou plugins num site ao

    vivo 
 sem ter uma cópia de segurança da base de dados.
  5. Ao escolher um plugin ou um tema do repositório devemos

    ter em atenção, além das funcionalidades: ! Quando foi a última atualização (data) Quantas vezes foi descarregado Avaliações feitas pelos utilizadores (não apenas as estrelas, ler também os comentários) Últimas entradas de suporte técnico 
 (e frequência de resposta…)
  6. Com tantos plugins disponíveis é fácil instalarmos 
 sem termos

    em conta o número. ! Alguns plugins exigem muitos recursos do servidor 
 e podem tornar o nosso site muito lento.
  7. O ideal é pensar na funcionalidade que se pretende antes

    de começar a procurar. ! E sempre que possível, instalar o mínimo de plugins.
  8. Coleções de plugins que podem ser úteis: ! https:/ /wpcore.com/collections/

    8BiQaK42mVhCFgz0BG2O ! https:/ /wpcore.com/collections/ FvdZwPS1pLPRMThWxCVX ! https:/ /wpcore.com/collections/ wlUtCuOi5tMfL5mqV7f2
  9. Um site com curadoria 
 e avaliação de plugins: !

    http:/ /tidyrepo.com/ ! ! Um bom exercício pode ser criar um site de testes onde podemos brincar com os plugins 
 e as suas diferentes funcionalidades.
  10. Exemplo de plugins para cópias de segurança 
 e para

    migração de site WordPress: ! WP Sync DB – plugin para sincronização das bases 
 de dados de duas instalações, disponível no GitHub ! UpdraftPlus – plugin para backup e migração, disponível no repositório wordpress.org/plugins ! BackupBuddy – solução premium para backup 
 e reposição automática
  11. Como medir  o desempenho do site? ! A experiência

    de utilização e até a classificação  em motores de pesquisa são influenciadas  pelo desempenho do site, sobretudo  a velocidade de carregamento.
  12. http:/ /gtmetrix.com ! É uma ferramenta acessível que carrega o

    site  e faz um relatório das áreas em que podemos melhorar a experiência de utilização.
  13. Otimização de imagens ! Devemos otimizar as imagens antes de

    as carregar, colocando-as num formato adequado, o tamanho máximo necessário no site, e passá-las por uma aplicação de otimização: ! • https:/ /imageoptim.com/pt.html (mac) • http:/ /luci.criosweb.ro/riot/ • http:/ /caesium.sourceforge.net/
  14. Exemplo de plugins para medir o desempenho 
 ou para

    otimização de sites WordPress: ! P3 – plugin para avaliar o desempenho 
 do site e dos plugins ativos ! Autoptimize – plugin para otimização 
 do carregamento dos vários scripts e folhas de estilos ! WP Fast Cache – plugin para implementação simples de cache do site (só no fim do desenvolvimento!)
  15. O WordPress é uma das plataformas mais amigáveis para os

    motores de pesquisa, mesmo sem plugins para SEO. Como é que podemos melhorar? ! Ligações permanentes “amigáveis”, 
 i.e., definidas para “título do artigo” (%postname%) ! Eliminar “stop words” (de, do, a, as…) dos URL ! Palavras-chave nos títulos, URL e texto ! Otimizar imagens: tamanho, nome, descrição e texto alternativo (bónus de pontos pela acessibilidade!)
  16. Ligações permanentes ! Ligações permanentes (permalinks) referem-se ao tipo de

    URL criado pelo WordPress  para cada artigo ou página. ! Pretty permalinks (URL bonitinhos) são úteis para  o utilizador mas também para os motores de pesquisa.
  17. Ligações permanentes ! Os permalinks podem ser alterados em: Opções

    > Ligações permanentes ! A definição mais “amigável” será optar por  nome do artigo
  18. Temas dependentes (child themes) ! Temas dependentes são a forma

    mais segura 
 e aconselhável de editar temas WordPress. ! Os child themes permitem usar as funcionalidades e design do parent theme (tema principal), sobre as quais podemos fazer alterações, sem correr o risco de estragar o trema principal ou perder essas alterações quando há uma actualização do tema.
  19. 1. Criar uma pasta com o nome do child theme,

    na pasta themes 2. Criar um ficheiro em branco style.css 3. Nesse ficheiro inserir o código: ! /* Theme Name: Nome do tema Theme URI: http://example.com/twenty-fourteen-child/ Description: Descrição do tema que é visível na administração do WordPress Author: Nome do Autor Author URI: http://example.com Template: twentyfourteen [refere-se ao nome EXATO da pasta do tema principal] Version: 1.0.0 Tags: light, dark, two-columns, right-sidebar, responsive-layout,
  20. 4. Criar um ficheiro em branco functions.php 
 na pasta

    do child theme 5. Nesse ficheiro inserir o código: ! <?php ! add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style' ); function enqueue_parent_theme_style() { wp_enqueue_style( 'parent-style', get_template_directory_uri().'/ style.css' ); } ! Mais em: http:/ /codex.wordpress.org/Child_Themes
  21. Os estilos que colocamos na folha CSS do child theme

    (style.css) sobrepõem-se aos do tema principal. Dessa forma, usando uma ferramenta para identificar os estilos em utilização, podemos 
 alterá-los e personalizar a apresentação do site. ! Se copiarmos do tema principal um ficheiro PHP que controle a apresentação de conteúdo, podemos editá-lo e adaptá-lo às nossas necessidades. Esse ficheiro também vai sobrepor-se ao do parent theme.
  22. Ferramentas: ! Plugin What Template, para identificarmos que template de

    páginas está a ser usado. ! Extensão Firebug para o browser, para identificarmos partes do código que são necessárias alterar. ! Editor de HTML como o Brackets (open source). ! Em opção, um editor de CSS como o CSS Edit.
  23. 
 Exercícios: ! 1. Procurar e carregar um tema (p.e.,

    que seja responsive) 2. Ativar o novo tema  3. Procurar e carregar o plugin  WordPress SEO do Yoast 4. Adicionar um widget de texto  a uma barra lateral com o texto: Editar conteúdo no WordPress é uma tarefa divertida.