Wordpress - O pulo do gato

Wordpress - O pulo do gato
Palestra ministrada em 01/03/2018 no @PHPub.
Mais informações em https://github.com/webcenter/wordpress

Transcript

4. Requerimentos de um tema •Home e Principal – index.php •Páginas – page.php •Post – single.php •Resultados de busca – search.php •Sidebar – sidebar.php •Stylesheet – style.css
5. •Página de Erro 404 – 404.php •Histórico e Arquivo – archive.php •Página de uma Categoria – category.php •Comentários – comments.php •Rodapé – footer.php •Cabeçalho – header.php •Arquivos de funções – functions.php Requerimentos de um tema
6. Passo 1 • Baixar uma versão atualizada do WordPress. Passo 2 • Escolha um tema em “branco“ (Sandbox) Passo 3 • Crie seu tema diagramando em html, js e css. Passo 4 • Leia a documentação: https://codex.wordpress.org/Main_Page Iniciando um projeto
7. style.css Iniciando um projeto
8. header.php • <?php bloginfo( 'charset' ); ?> • <?php bloginfo( 'name' ); ?><?php wp_title( '|' ); ?> • <?php wp_head(); ?> • <?php echo esc_url( get_template_directory_uri() ); ?> Iniciando um projeto
9. Iniciando um projeto index.php • <?php get_header(); ?> • <?php get_footer(); ?> • Loop *
10. index.php Loop
12. index.php Loop <!-- COMO CHAMAR UMA CATEGORIA --> <?php query_posts('category_name=SLUG_CATEGORY&posts_per_page=2'); ?> <?php if (have_posts()): while (have_posts()) : the_post(); ?> <!-- conteudo true --> <?php endwhile; ?> <?php else: ?> <!-- conteudo false --> <?php endif; ?> ↓ ↓ ↓ ↓
13. index.php Titulo e conteúdo // Título da psotagem <?php wp_title(); ?> // Conteúdo da postagem <?php the_content(); ?>
14. index.php Loop <!-- COMO CHAMAR UMA CATEGORIA --> <?php query_posts('category_name=SLUG_CATEGORY&posts_per_page=2'); ?> <?php if (have_posts()): while (have_posts()) : the_post(); ?> <!-- COMO VERIFICAR SE HÁ IMAGEM EM DESTAQUE --> <?php if (has_post_thumbnail()) { // Check if Thumbnail exists ?> <?php the_post_thumbnail('news', array('class' => 'img-responsive')); ?> <?php } else { ?> <!-- imagem padrao --> <?php } ?> <!-- conteudo true --> <?php endwhile; ?> <?php else: ?> <!-- conteudo false --> <?php endif; ?> ↓ ↓ ↓
15. index.php Thumbnail // PADROES DE TAMANHOS DE IMAGENS if (function_exists('add_theme_support')) { add_image_size('large', 700, '', true); add_image_size('medium', 250, '', true); add_image_size('small', 120, '', true); add_image_size('news', 185, 185, true); add_image_size('post', 616, 160, true); add_image_size('slider', 970, 360, true); add_image_size('fotos', 300, 200, true); }
16. index.php Loop <!-- GET URL THUMBNAIL --> <?php if (has_post_thumbnail()) : ?> <img src="<?php $src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'size', false, ''); echo $src[0]; ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>" class="img-responsive"/> <?php else : ?> <img src="<?php echo esc_url(get_template_directory_uri()); ?>/images/thumb.jpg"> <?php endif; ?>