things you can learn from 2014 wordpress theme

8
THINGS YOU CAN LEARN FROM 2014 THEME

Upload: fitwp-team

Post on 20-Jun-2015

3.259 views

Category:

Technology


0 download

DESCRIPTION

This slide shows you some things (mostly features and coding highlights) that you can learn from the new WordPress default theme: 2014.

TRANSCRIPT

Page 1: Things you can learn from 2014 WordPress theme

THINGS YOU CAN LEARN FROM 2014 THEME

Page 2: Things you can learn from 2014 WordPress theme

ABOUT ME

• Tran Ngoc Tuan Anh (a.k.a. Rilwis)

• FitWP (From Ideas To WordPress) – http://fitwp.com

• Deluxe Blog Tips – http://deluxeblogtips.com

• Hanoi WordPress Meetup Co-Organizer – http://meetup.com/hanoi-wordpress

rilwis rilwis

Page 3: Things you can learn from 2014 WordPress theme

FEATURED CONTENT

o Using tag: “featured”

o Display types: “grid” or

“slider”

o Customizer

Tag is not a good idea

WHY IT SUCKS?

It’s not new

Using “modified” version of Flexslider

Page 4: Things you can learn from 2014 WordPress theme

FEATURED CONTENT

<?php// Output the featured image.if ( has_post_thumbnail() ) : if ( 'grid' == get_theme_mod( 'featured_content_layout' ) ) { the_post_thumbnail(); } else { the_post_thumbnail( 'twentyfourteen-full-width' ); }endif;?>

Same markup for “grid” and “slider” layout

Using theme mod

Page 5: Things you can learn from 2014 WordPress theme

ENQUEUE SCRIPTS & STYLES

wp_enqueue_style( lato', twentyfourteen_font_url(), array(), null );

// Inside twentyfourteen_font_url()$font_url = add_query_arg( 'family', urlencode( 'Lato:300,400,700,900,300italic,400italic,700italic' ), "//fonts.googleapis.com/css");

Get URL for Google Font

Enqueue styles for IE

wp_enqueue_style( 'ie', get_template_directory_uri() . '/css/ie.css’ );wp_style_add_data( 'twentyfourteen-ie', 'conditional', 'lt IE 9' );

Page 6: Things you can learn from 2014 WordPress theme

HEADER IMAGE

<?php if ( get_header_image() ) : ?> <div id="site-header"> <a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"> <img src="<?php header_image(); ?>" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt=""> </a> </div><?php endif; ?>

Page 7: Things you can learn from 2014 WordPress theme

SMALL THINGS

the_title( '<h1 class="entry-title">', '</h1>' );

add_theme_support( 'html5', array( 'search-form', 'comment-form', 'comment-list',) );

add_theme_support( 'featured-content', array( 'featured_content_filter' => 'twentyfourteen_get_featured_posts', 'max_posts' => 6,) );

Page 8: Things you can learn from 2014 WordPress theme

THANKS