Search This Blog

How To Create Wordpress Theme from Scratch #3

We will learn Wordpress code to generate dynamic data, in this post we focus on header section of our template. There are some critical part of our web page that you must aware, especially in page that generated dynamically by Wordpress, or PHP in general.

Edit header.php to make it look like code below:
<?php
/**
 * The header
 *
 * @package WordPress
 * @subpackage Dummy
 * @since Dummy 0.000001
 */
?><!DOCTYPE html>
<html>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<title><?php
    /*
     * Print the <title> tag dynamically based on what is being viewed.
     */
    global $page, $paged;

    wp_title( '|', true, 'right' );

    // Add the blog name.
    bloginfo( 'name' );

    // Add the blog description for the home/front page.
    $site_description = get_bloginfo( 'description', 'display' );
    if ( $site_description && ( is_home() || is_front_page() ) )
        echo " | $site_description";

    // Add a page number if necessary:
    if ( $paged >= 2 || $page >= 2 )
        echo ' | ' . sprintf( __( 'Page %s', 'dummy' ), max( $paged, $page ) );

    ?></title>
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php
    /* We add some JavaScript to pages with the comment form
     * to support sites with threaded comments (when in use).
     */
    if ( is_singular() && get_option( 'thread_comments' ) )
        wp_enqueue_script( 'comment-reply' );

    /* Always have wp_head() just before the closing </head>
     * tag of your theme, or you will break many plugins, which
     * generally use this hook to add elements to <head> such
     * as styles, scripts, and meta tags.
     */
    wp_head();
?>
</head>
<body>
<div id="page-wrapper">
    <div id="header">
        <h1>I'm header</h1>
    </div><!-- end eader -->
   
    <div id="main">


Important!
- We write the PHP closing tag inline with HTML document type: ?><!DOCTYPE html>, to ensure this document type declaration printed in first line by browser. Our page will be treated by browser according to its document type.
-We write the opening <title> tag inline with PHP <?php, also we write the closing </title> inline with ?> PHP tag. This will ensure dynamic title that generated by PHP will be printed inline by browser.
-The Wordpress tag wp_head() we write just before closing tag </head>. Please do not put any CSS or JavaScript after wp_head()! This code will be use by plugin or theme function itself.

Let's we examine some Wordpress code:
-bloginfo() to print information from our blog, such blog name, description, language etc. Example, to print our blog name: bloginfo('name');.
-get_bloginfo() to get the information of our blog to be used on our PHP code. This function is similar to bloginfo(), except bloginfo() print directly the information.

From now, our page title only contain blog name and description. We also can add title of our post or other customization to make our blog more search engine friendly.

How to create Wordpress theme from scratch part 1
How to create Wordpress theme from scratch part 2
How to create Wordpress theme from scratch part 3
How to create Wordpress theme from scratch part 4 
reference:
http://codex.wordpress.org/Function_Reference/get_bloginfo

share and comment


Related Posts :