Este documento fornece orientações sobre planejamento e desenvolvimento de sites e sistemas com WordPress. Aborda tópicos como criação de um kickstarter padrão, utilização de plugins como ACF e Yoast SEO, definição de CPTs e taxonomias, desenvolvimento de sistemas, uso de loops múltiplos e shortcodes.
1. Construindo sites e sistemas
com WordPress
Tema, plugins e como tudo se encaixa.
2. <?php the_title( ‘h1’, ‘h1’ ); ?>
Leo Baiano
#WebDev para pagar as contas
Músico quando estou bêbado
Poeta por vocação
Romântico de nascença
FAZEDOR DE SLIDES nas horas vagas
https://profiles.wordpress.org/leobaiano/
https://www.facebook.com/leo.baiano1
E-mail: ljunior2005@gmail.com
3. Planejamento do projeto
Se eu tiver 5 dias para cortar uma árvore, passarei 3 deles afiando o machado
- Quais plugins vou precisar?
- O que é CPT, o que é página, quais taxonomys…
- Quais sistemas terei que desenvolver?
Construindo sites e sistemas com WordPress
4. Planejamento do projeto
Os plugins
- ACF (https://wordpress.org/plugins/advanced-custom-fields/)
- ACF Repeater (http://www.advancedcustomfields.com/resources/repeater/)
- Yoast SEO (https://wordpress.org/plugins/wordpress-seo/)
- Plugins de segurança (https://rafaelfunchal.github.io/wordpress-security-
checklist/br/items/)
Construindo sites e sistemas com WordPress
5. Planejamento do projeto
O que é CPT, o que é Página, quais taxonomys…
- CPT para áreas que precisam de vários itens (como um blog ou lista de músicas)
- Se os itens dessas áreas precisam ser categorizados você cria uma taxonomy
- Páginas para areas com conteúdo institucional/ fixo (contato, quem somos…)
Construindo sites e sistemas com WordPress
6. Planejamento do projeto
Quais sistemas eu terei?
Vou desenvolver? Como? Existem plugins para isso?
- O site vai precisar de uma área restrita onde os usuários fazem upload de arquivos.
- Os usuários podem se adicionar e enviar mensagens um para o outro.
- Vai ter enquete.
Construindo sites e sistemas com WordPress
7. Eu sou #dev po***, cansei de
planejar… Quando vou ver
código? Quando vou meter a mão
na massa?
Construindo sites e sistemas com WordPress
8. A etapa de planejamento
e analise do sistema faz parte do
trabalho do #dev
Construindo sites e sistemas com WordPress
9. Criando um kick starter
Kick starter é uma configuração inicial que você utiliza em todos os projetos.
Como é o meu kick starter WordPress?
- Todos os arquivos do WordPress;
- O DUMP de uma base de dados;
- Deve ser configurado para trabalhar com multiplos ambientes;
- Precisa trazer os plugins essenciais e utilizados em todos os projetos;
- Precisa ter a base de um tema WordPress;
Construindo sites e sistemas com WordPress
10. Criando um Kick Starter
Construindo sites e sistemas com WordPress
11. Criando um kick starter
Construindo sites e sistemas com WordPress
12. Criando um kick starter
Construindo sites e sistemas com WordPress
13. Criando um kick starter
O que são multiplos ambientes e como configurar?
Ambientes são os locais onde você vai precisar ter o projeto rodando.
- Ambiente de desenvolvimento (development)
- Ambiente de homologação (staging)
- Ambiente de produção (production)
Construindo sites e sistemas com WordPress
14. Criando um kick starter
Preparando o projeto para trabalhar com multiplos ambientes
Base do meu kick starter: https://github.com/studio24/wordpress-multi-env-config
- Cria um diretório env na raiz do WordPress
- Coloca os arquivos do repositório no diretório env, exceto o wp-config.php
- Substitui o seu wp-config.php pelo wp-config.php do repositório
- Incluir os dados de acesso ao banco nos arquivos de cada ambiente
Construindo sites e sistemas com WordPress
15. Como criar um kick starter
Preparando o projeto para trabalhar com multiplos ambientes
Definindo o WP_SITEURL e WP_HOME
No arquivo de cada ambiente
$url_admin .= '/STARTER_WP/gerenciador';
$url_site .= '/STARTER_WP';
No wp-config.php
define('WP_SITEURL', $protocol . rtrim( $hostname . $url_admin ) );
define('WP_HOME', $protocol . rtrim( $hostname . $url_site ) );
Construindo sites e sistemas com WordPress
16. Criando um kick starter
Meu tema padrão
ASSETS
- CSS e JS do bootstrape
FUNCTIONS.PHP
- Adiciona os suportes do tema
- Carrega os arquivos CSS e JS
Construindo sites e sistemas com WordPress
17. Criando um kick starter
Suportes do tema
if ( ! function_exists( 'tema_un_setup_features' ) ) {
/**
* Setup theme features.
*
* @return void
*/
function tema_un_setup_features() {
// suportes
}
}
Construindo sites e sistemas com WordPress
18. Criando um kick starter
Suportes do tema
Definindo a localização dos arquivos de tradução do site: load_theme_textdomain();
Registro o menu: register_nav_menus();
Adiciono suporte a thumbnails: add_theme_support( ‘post-thumbnails’ );
Adiciono suporte a title tag: add_theme_support( ‘title-tag’ );
……….
Construindo sites e sistemas com WordPress
20. Criando um kick starter
Trabalhando com ajax
No arquivo main.js nós recuperamos a ajax_url que foi passada no functions.php e
podemos trabalhar com requisições ajax.
var ajax_url = ajax_object.ajax_url;
Construindo sites e sistemas com WordPress
21. Criando os CPT’s definidos na etapa de planejamento
Meus CPT’s são plugins, porque:
- O CPT é ligado ao conteúdo e não ao visual do site;
- Se eu mudo de tema não preciso me preocupar em copiar os códigos que criam o
CPT do functions.php do tema antigo;
- Eu posso reaproveitar os plugins em outros projetos;
- E se eu for um bom menino ainda posso colocar no diretório oficial para que
outras pessoas possam se beneficiar.
Construindo sites e sistemas com WordPress
22. Criando CPT’s definidos na etapa de planejamento
Se você tem medo de plugin leia: http://migre.me/sf3G7
Não precisa ter medo de criar plugin, é quase a mesma coisa que inserir o código no
functions.php!
Construindo sites e sistemas com WordPress
23. Criando CPT’s definidos na estapa de planejamento
Quando eu era um mau menino…
Criando CPT: register_post_type();
Construindo sites e sistemas com WordPress
24. Quais sistemas terei que desenvolver
Antes de desenvolver um sistema verifique se existe algum plugin que você possa
utilizar. Se encontrar tal plugin verifique se atende a todas as necessidades do projeto e
caso não atenda veja se é muito complexo adapta-lo a sua realidade.
Se não houver nada pronto, manda e-mail pro Claudio “Woo” Sanches #brinks
Construindo sites e sistemas com WordPress
25. Exemplos de casos
Multiplos loops na página inicial!
Todo mundo sabe que é só usar
query_posts(); Correto?
Construindo sites e sistemas com WordPress
27. Exemplos de caso
Multiplos loops
Para lidar com multiplos loops na mesma página vamos usar WP_Query();
$args = array (
‘post_type’ => ‘musica’,
‘ posts_per_page’ => 5
);
$musicas = new WP_Query( $args );
Não esquecer de informar o
objeto na hora de criar o loop,
assim $musica->have_posts; e
$musica->the_post();
Não esquecer de resetar no final
do loop, assim:
wp_reset_postdata();
Construindo sites e sistemas com WordPress
28. Exemplos de casos
Modificando o loop padrão, Preguetinho nele!
function posts_musica( $query ) {
if ( is_post_type_archive( ‘musica’ ) ) {
$query->set( ‘posts_per_page’ => 5 );
}
}
add_action( ‘pre_get_posts’, posts_musica );
Construindo sites e sistemas com WordPress
30. Exemplos de caso
Criando um saiba mais no meio do conteúdo
function saiba_mais( $atts ) {
$atts = shortcode_atts(
array( ‘tipo’ => ‘categoria’ ),
$atts,
‘saiba-mais’
);
return $atts[‘tipo’];
}
add_shortcode( ‘saiba-mais’, ‘saiba_mais’ );
Construindo sites e sistemas com WordPress