Tuesday, January 6, 2015

Lesson 5: The includes wordpress

Snippets of code included in the templates to optimize maintenance.



For now, we have seen that templates are complete pages. A header, a ticket list, a footer.
But some parts of the code are generally the same across files, it is best to group these parts into separate files that we will include the full pages.

The includes mainly used are:

.header.php: the beginning of the code, with the doctype, the <head>, the start of the <body>
.footer.php: the end of the code, with the footer and the closing tag </ body> </ html>
.sidebar.php: a column that often contains the search form, an RSS button, the list of categories, a tag cloud ...
.searchform.php: search form, alone
.comments.php: the comment module, present in single.php
.loop.php: the loop used to display Posts


header.php: where it all begins
Header.php file is the one with footer.php, that is placed in all templates. One opens the HTML code, the other farm. Between the two is the template that handles.

We will create this file step by step because it will keep it until the end.
It will be the first of a set of files that constitute a complete theme that will create at as of this tutorial.

Let us start from one end of HTML5:


<!DOCTYPE html>
 <html>   
<head>     
<meta charset="utf-8">     
<title>Net-Explain blog</title>     
<link rel="stylesheet" href="style.css" type="text/css">   
</head>  
 <body>     <div class="wrap">       
<header>         
<h1><a>bbxpress</a>
</h1>         <h2>Net-Explain</h2>      
 </header>

The code has voluntarily reduced to its bare minimum. We will establish simple and then build a solid foundation for a richer site.

First thing to note: I open the div "wrap" but do not close. Indeed, it will close later in footer.php for the whole site to be included in that div.

Second thing to note: there is no PHP code in this ... for now. Let's go step by step. I put only HTML nevertheless taking care to place static content (title, description).
We could leave the code as well, it will not be a problem ... but it would be impractical to change. It would directly open the file for editing PHP online or upload via FTP.

So we will replace this static content from dynamic content:

<!DOCTYPE html> 
<html>   
<head <?php language_attributes(); ?>>     
<meta charset="<?php bloginfo('charset'); ?>">     
<title><?php the_title(); ?></title>     
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css">     <?php wp_head(); ?>   
</head>   
<body>     
<div class="wrap">       
<header>         
<h1><a><?php bloginfo('name'); ?></a></h1>         
<h2><?php bloginfo('description'); ?></h2>       
</header>

Once again and bloginfo () function that we had already seen.
I also added the_title (), a handy feature of WordPress. According to the page where you are, it will generate an appropriate title.
The wp_head () function is almost essential. In fact, it allows plugins to insert code in the <head>. You can do without, but I do not recommend it.

We save this dynamic header and let's move on.

footer.php: where it all ends
Any open tag should be closed at one time or another ...
<footer>         
<?php bloginfo('name'); ?> est propulsé par <a href="http://wordpress.org">WordPress</a>.       </footer>     
</div>     <?php wp_footer(); ?>  
 </body> 
</html>

A simple footer who gets the name of the blog and did a little advertising for WordPress.

Here the wp_footer () function plays the same role as wp_head (), namely to define a place where a plugin can insert code including JavaScript calls for the footer.

sidebar.php: a handy column
We will define a sidebar that can be called in all templates. It will have the general content, not specific to a particular page.

The sidebar has a special role in WordPress: it allows to insert widgets.
These small modules (a block of text, a list of categories, search form, a calendar) that can be inserted, order and administer in the backend of WordPress.
Their advantage: they are very simple to use. A novice can handle it.
Their disadvantage: they are not really customizables.
For us, theme designers can do without because we know put code directly in the sidebar.php file.
But if your theme is intended for novices, it must make your theme "widget-ready", that is to say make it capable of accepting Widgets.
We'll see in a later lesson.

Keep it simple for this sidebar:

<div class="side">   
<!-- Bouton RSS -->  
 <a href="<?php bloginfo('rss2_url'); ?>">S'abonner au flux RSS</a>   
<!-- Formulaire de recherche -->  
 <?php get_search_form(); ?>  
 <!-- Archives -->   
<ul class="list">     <?php wp_get_archives('type=monthly'); ?>   
</ul> 
</div>

A link to the RSS, search form (which is itself an include) and a simple list of archives by month.

searchform.php: a form with rules
The search form is sometimes used in several places in a page. This is why the default WordPress site in a separate file: searchform.php. It is not obligatory and I must not do it systematically.

For cons, the form code, it must meet the following rules:

.The <form> tag should have as parameters action = "/" (or the root of the site) and method = "GET"
.The search text input parameter must have id = "s"
Here is a simplified search form but works.

<form method="get" id="form" action="<?php bloginfo('url'); ?>/">   
<input type="text" value="<?php the_search_query(); ?>" name="s" id="s">   
<input type="submit" id="submit"> 
</form>

By validating the form, the page displayed is the blog.Net-Explain/?s=requete type and template used will search.php.

comments.php: the gasworks comments

The file comments.php may be included only in single.php, specifically in the single.php loop (loop that we will see in the next lesson).

It has two roles:

Show Comments with each author, avatar, date and content. Comments may be nested, that is to say have several levels of response.
View new comment form with name, email and message.
You should know that since WordPress 3 comments.php file is no longer required. Indeed, just call the comments_template () function in the single.php file to view it takes (the comments and the form) because it is a built-in WordPress.

But he may want to change the code comments, and in this case, create a comments.php file and edit. This file is the hardest to change into a WordPress theme. Therefore, if I have to change it, I go always file in the default theme (Twenty Ten for example), the rejoinder, and modifies it from there. It's the only one I apply this process.

The first difficulty lies in the possibilities for posting comments:

If the Post is protected by password, it does not display comments or form.
If it is not protected, it looks if comments are allowed.
If so, it checks if there are comments to display.
If their number exceeds the number / allowed page, it displays the pagination.
Finally, it shows the new comment form if the comments are open.
With all these conditions, it is easy to get lost in the maze of comments.php ...

A second challenge is customization code. Since WordPress 3 posting comments is done by calling only the wp_list_comments () function. So, the generated HTML is not editable ... well, not easily. I have already done, and I do not advise it. Same with the new comment form, which reduces to the comment_form () function.

After traveling all these includes let's tackle the most important of them: loop.php.

Share this post
  • Share to Facebook
  • Share to Twitter
  • Share to Google+
  • Share to Stumble Upon
  • Share to Evernote
  • Share to Blogger
  • Share to Email
  • Share to Yahoo Messenger
  • More...

0 comments

:) :-) :)) =)) :( :-( :(( :d :-d @-) :p :o :>) (o) [-( :-? (p) :-s (m) 8-) :-t :-b b-( :-# =p~ :-$ (b) (f) x-) (k) (h) (c) cheer

 
Posts RSSComments RSSBack to top
© 2015 Net Explain ∙ Designed by BlogThietKe
Released under Creative Commons 3.0 CC BY-NC 3.0