od zera do motywów kodera
TRANSCRIPT
Od zera do motywów kodera
1
Dawid Szwed
@szweddawid
2
Podstawowe pliki
wp-content/themes/wordup-silesiastyle.css
index.php
3
Podstawowe pliki - style.css
/*
Theme Name: WordUp SilesiaTheme URI: http://wp360.pro/themes/wordup-silesiaAuthor: Dawid SzwedAuthor URI: http://wp360.pro/Description: Theme descriptionText Domain: wp360
*/
4
Podstawowe pliki - index.php
<html><head>
<?php wp_head(); ?></head>
<body <?php body_class();?>><h1>WordUp Silesia Theme</h1><?php wp_footer(); ?>
</body></html>
5
wp_head()wp_footer()body_class()
Pętla
… <body <?php body_class(); ?>>
<?php if( have_posts() ): ?><?php while(have_posts()): the_post(); ?>
<h2><?php the_title(); ?></h2><?php the_excerpt(); ?><a href=”<?php the_permalink(); ?>”>Read more</a>
<?php endwhile; ?><?php else: ?>
No posts<?php endif; ?><?php wp_footer(); ?>
</body>… 6
global $wp_queryhave_posts()
the_post()the_title()
Pojedynczy wpis
single.phpwłasny typ wpisu (CPT)
7
Pojedynczy wpis - kod… <body <?php body_class(); ?>>
<?php if( have_posts() ): ?><?php while(have_posts()): the_post(); ?>
<article <?php post_class();?>><h1><?php the_title(); ?></h1><?php the_content(); ?>
</article><?php endwhile; ?>
<?php else: ?>No content
<?php endif; ?><?php wp_footer(); ?>
</body>… 8
Powtarzalne elementy
get_template_part()
get_template_part(‘loop’) => loop.php
get_template_part(‘loop’, ‘single’) => loop-single.php
get_template_part(‘templates/loop’, ‘single’) => templates/loop-single.php
9
Powtarzalne elementy
get_header(), get_footer(), get_sidebar()get_header() => get_template_part(‘header’) =>
header.phpget_header(‘blog’) => header-blog.php
10
Pojedyncza strona - page.php… <body <?php body_class(); ?>>
<?php if( have_posts() ): ?><?php while(have_posts()): the_post(); ?>
<article <?php post_class();?>><h1><?php the_title(); ?></h1><?php the_content(); ?>
</article><?php endwhile; ?>
<?php else: ?>No content
<?php endif; ?><?php wp_footer(); ?>
</body>… 11
Pojedynczy wpis i strona
/* single.php */<?php get_header(); get_template_part(‘loop’, ‘single’);get_footer();?>
12
/* page.php */<?phpget_header(); get_template_part(‘loop’, ‘single’);get_footer();?>
Pojedynczy wpis i strona
/* loop-single.php */<?php if( have_posts() ): ?>
<?php while(have_posts()): the_post(); ?><article <?php post_class();?>>
<h1><?php the_title(); ?></h1><?php the_content(); ?>
</article><?php endwhile; ?>
<?php else: ?>No content
<?php endif; ?> 13
Pojedynczy wpis i strona
/* header.php */<html>
<head><?php
wp_head(); ?></head>
<body <?php body_class();?>>
14
/* footer.php */<?php wp_footer(); ?></body></html>
Inne szablony
singular.php (WP 4.3)
search.php
404.php
taxonomy.php
single-{cpt-slug}.php
archive-{cpt-slug}.php
15
Inne szablony
front-page.phphome.php
16
Szablony stron
my-page.phptemplates/my-page.php
/* Template Name: My Page */
17
Hierarchia szablonów
18
19https://developer.wordpress.org/files/2014/10/template-hierarchy.png
Menu, sidebar, style, JS…
functions.php
20
Dołączanie stylów
function wordup_enqueue_style() {wp_enqueue_style( 'core', 'style.css', false );
}
function wordup_enqueue_script() {wp_enqueue_script( 'my-js', 'main.js', false );
}
add_action( 'wp_enqueue_scripts', 'wordup_enqueue_style' );add_action( 'wp_enqueue_scripts', 'wordup_enqueue_script' );
21
Rejestracja menu
add_action( 'after_setup_theme', 'wordup_menu' );function wordup_menu() {
register_nav_menu( 'primary', __('Primary Menu', ‘wordup’) );}
22
Wyświetlanie menu - header.php
<html><head>
<?php wp_head(); ?></head>
<body <?php body_class();?>><?php wp_nav_menu( array(
'theme_location' => 'primary') ); ?> 23
Rejestracja sidebarów
add_action( 'widgets_init', 'wordup_widgets_init' );function wordup_widgets_init() { register_sidebar( array(
'name' => ‘Main sidebar’,'id' => 'main-sidebar','description' => ‘Main sidebar displayed
on every page') );
}24
Wyświetlanie sidebarów
<ul id="sidebar"><?php dynamic_sidebar( 'main-
sidebar' ); ?></ul>
25
Motyw potomny (Child theme)
wordup-silesia-childstyle.css
functions.phpnadpisywanie plików
26
Motyw potomny (Child theme)
/*Theme Name: WordUp Silesia ChildTheme URI: http://wp360.pro/themes/wordup-silesiaAuthor: wp360Author URI: http://wp360.pro/Description: Theme descriptionTemplate: wordup-silesia
*/27
Motyw potomny (Child theme)
if(!function_exists(‘wordup_my_function’)){
function wordup_my_function() {}
}28
Czego w motywie nie umieszczać?
rejestracji typów wpisów (CPT)
rejestracji taksonomii
logiki biznesowej
29
Przydatne wtyczki
Reveal Templatehttps://pl.wordpress.org/plugins/reveal-template/
Theme Checkhttps://pl.wordpress.org/plugins/theme-check/
30
Źródła
http://codex.wordpress.org/Theme_Development#Anatomy_of_a_Theme
https://codex.wordpress.org/Template_Tagshttps://codex.wordpress.org/Class_Reference/WP_Queryhttps://developer.wordpress.org/themes/basics/template-hierarchy/https://codex.wordpress.org/Child_Themeshttps://codex.wordpress.org/Function_Reference/
31
Dziękuję
32