SANGKRIT

How to Create Or Edit An ‘header.php’ File

The most important pat of theme is header.  We edit it but mostly after editing the header the blog get slow and it shows some error.

So here we will know how to create a good header file for wordpress theme and after knowing how to create a header file you will better understand how to edit it without affecting the blog with errors or slow loading.

Header.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>

<head profile="http://gmpg.org/xfn/11">

<title><?php

if ( is_single() ) { single_post_title(); }

elseif ( is_home() || is_front_page() ) { bloginfo('name'); print ' | '; bloginfo('description'); get_page_number(); }

elseif ( is_page() ) { single_post_title(''); }

elseif ( is_search() ) { bloginfo('name'); print ' | Search results for ' . wp_specialchars($s); get_page_number(); }

elseif ( is_404() ) { bloginfo('name'); print ' | Not Found'; }

else { bloginfo('name'); wp_title('|'); get_page_number(); }

?></title>

<meta http-equiv="content-type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />

<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" />

<?php if ( is_singular() ) wp_enqueue_script( 'comment-reply' ); ?>

<?php wp_head(); ?>

<link rel="alternate" type="application/rss+xml" href="<?php bloginfo('rss2_url'); ?>"title="<?php printf( __( '%s latest posts', 'your-theme' ), wp_specialchars( get_bloginfo('name'), 1 ) ); ?>" />

<link rel="alternate" type="application/rss+xml" href="<?php bloginfo('comments_rss2_url') ?>"title="<?php printf( __( '%s latest comments', 'your-theme' ), wp_specialchars( get_bloginfo('name'), 1 ) ); ?>" />

<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />

</head>

<body>

<div id=”wrapper”>

<div id=”header”>

<div id=”masthead”>

<div id=”branding”>

<div id=”blog-title”><span><a href=”<?php bloginfo( ‘url’ ) ?>/” title=”<?php bloginfo( ‘name’ ) ?>” rel=”home”><?php bloginfo( ‘name’ ) ?></a></span></div>

<?php if ( is_home() || is_front_page() ) { ?>

<h1 id=”blog-description”><?php bloginfo( ‘description’ ) ?></h1>

<?php } else { ?>

<div id=”blog-description”><?php bloginfo( ‘description’ ) ?></div>

<?php } ?>

</div><!– #branding –>

 

<div id=”access”>

<div><a href=”#content” title=”<?php _e( ‘Skip to content’, ‘your-theme’ ) ?>”><?php _e( ‘Skip to content’, ‘your-theme’ ) ?></a></div>

<?php wp_page_menu( ‘sort_column=menu_order’ ); ?>

</div> <!– #access –>

 

</div><!– #masthead –>

</div><!– #header –>

 

<div id=”main”>

 

Description:

Code block in red and orange color at the top of header.php tells the document type which helps the browser to interpret the HTML seeing. While the orange lines of code add few attributes that makes the page apparent to the web browser.

Code block in green color, you must be remembering simple <head></head> HTML tags. This is a quite similar but here it is looks like a complex block of code because the code in between <title> and </title> is basically for the search engine result.

The code line starting from <meta http gives concise information about your website and the code line starting from<link rel “stylesheet” is used for linking the stylesheet. Other <link rel code lines specify the feeds basically RSS and other pingbacks  <?php wp_head(); ?> is a catch for the plugins etc. Other code includes thread for the comments etc which you may easily understand by reading the code carefully and if you face any problem then send me an e-mail.

The code in purple color, is a code block of conditional wordpress tags for coding title and blog description, this will be helpful for the branding of your site as it will send your blog title in search engines.

Code block in light green color, here we have added a skip link so as to make a screen reader can easily get specific content, helpful for the persons using a screen reader. Other than this we have added our page menu. Just read the code carefully and you will understand everything.

Note: This is the basic coder for ‘header.php’ file which is written by me, to get best results always keep this code in mind and then edit header without disturbing the basic code.

 

One thought on “How to Create Or Edit An ‘header.php’ File”

Leave a Reply