Have a look….
This template is not ready yet to be converted into a wordpress
theme. Before we start this conversion; we have to know some things about
wordpress.
Note the list of Tags used to describe the theme. These
allow user to find your theme using the tag filter. Here is the full list of
the tags allowed.
What means of these wordpress function:-
language_attributes();
Display the language attributes for the
tag.
Builds up a set of html attributes containing the text direction and
language information for the page.
bloginfo('charset');
bloginfo('name');
bloginfo('description');
bloginfo('stylesheet_url');
bloginfo('template_directory');
Displays information about your site, mostly gathered from the information
you supply in your User Profile and General Settings WordPress Administration
Screens. It can be used anywhere within a template file. This always prints a
result to the browser. If you need the values for use in PHP, use get_bloginfo().
'charset'
- Displays the "Encoding for pages and feeds" set in Settings > Reading.
This data is retrieved from the "blog_charset" record in the wp_options
table. Note: In Version 3.5.0 and later, character encoding is no longer
configurable from the Administration Panel. Therefore, this parameter always
echoes "UTF-8", which is the default encoding of WordPress.
·
'name' - Displays the "Site Title" set in Settings > General.
This data is retrieved from the "blogname" record in the wp_options table.
· 'description'
- Displays the "Tagline" set in Settings
> General. This data is retrieved
from the "blogdescription" record in the wp_options
table.
·
'
stylesheet_url' - Displays the primary CSS (usually
style.css)
file URL of the active theme. Consider echoing get_stylesheet_uri() instead.
·
'
template_url' / '
template_directory' - URL of the active
theme's directory ('template_directory' was a local path before
2.6; see
get_theme_root() and
get_template() for hackish
alternatives.) Within child themes, both get_bloginfo('template_url') and
get_template() will return the
parent theme
directory. Consider echoing
get_template_directory_uri()
instead (for the parent template directory) or
get_stylesheet_directory_uri()
(for the child template directory).
wp_title();
The
wp_title
filter is used to filter the title of the page (called with
wp_title()). This filters the text
appearing in the HTML <title> tag (sometimes called the "title
tag" or "meta title"), not the post, page, or category title.
get_template_directory_uri();
Using get_template_directory_uri() to enqueue a script with
the correct path.
Wp_head()
The
wp_head
action hook is triggered within the
<head></head>
section of
the user's template by the
wp_head()
function. Although this is theme-dependent, it is one of the most essential
theme hooks, so it is widely supported.
Body_class();
The "body_class" filter is used to filter the classes that are assigned to the body HTML element on the current page.
wp_nav_menu
Displays a navigation menu created in the
Appearance → Menus panel.
Given a theme_location parameter, the function displays the menu assigned to that location. If no such location exists or no menu is assigned to it, the parameter fallback_cb will determine what is displayed.
If not given a theme_location parameter, the function displays
•
the menu matching the ID, slug, or name given by the menu parameter, if that menu has at least 1 item;
•
otherwise, the first non-empty menu;
•
otherwise, output of the function given by the fallback_cb parameter (wp_page_menu(), by default);
•
otherwise nothing.
Note: As of 3.5, if there are no menu items, no HTML markup will be output.
<?php wp_nav_menu( array( 'theme_location' => 'header_menu' ) ); ?>
For display menu into your theme firstly register navigation menu in function.php have a look..
// Register Navigation Menus
function custom_navigation_menus() {
$locations = array(
'header_menu' => __( 'Custom Header Menu', 'computer' ),
'footer_menu' => __( 'Custom Footer Menu', 'computer' ),
'mobile_footer' => __( 'Footer Menu on mobile devices', 'computer' ),
);
register_nav_menus( $locations );
}
// Hook into the 'init' action
add_action( 'init', 'custom_navigation_menus' );
now go to the Apprearance->Menus
and create the new menu type menu name my menu name is header menu
see below
Make pages for menus about us , services, news , quick contact.
// Register Theme Features(Register them setup)
// Register Custom Feed Links, Post Formats, Editor Style, Semantic Markup and Translation
function custom_theme_features() {
global $wp_version;
// Add theme support for Automatic Feed Links
if ( version_compare( $wp_version, '3.0', '>=' ) ) :
add_theme_support( 'automatic-feed-links' );
else :
automatic_feed_links();
endif;
// Add theme support for Post Formats
$formats = array( 'status', 'quote', 'gallery', 'image', 'video', 'audio', 'link', 'aside', 'chat', );
add_theme_support( 'post-formats', $formats );
// Add theme support for custom CSS in the TinyMCE visual editor
add_editor_style( 'editor-style.css' );
// Add theme support for Semantic Markup
$markup = array( 'search-form', 'comment-form', 'comment-list', );
add_theme_support( 'html5', $markup );
// Add theme support for Translation
load_theme_textdomain( 'computer', get_template_directory() . '/language' );
}
Now open footer.php file in dreamweaver and add wordpress function.
Wp_footer();
The wp_footer action is triggered near the </body> tag of the user's template by the wp_footer() function. Although this is theme-dependent, it is one of the most essential theme hooks, so it is fairly widely supported.
This hook provides no parameters. You use this hook by having your function echo output to the browser, or by having it perform background tasks. Your functions shouldn't return, and shouldn't take any parameters.
Now open sidebar.php file in dreamweaver and add wordpress function.
Firstly register the sidebar in function.php cause without register dynamic sidebar is not working so we are going to register dynamic sidebar.. open function.php and register sidebar.
// Register Sidebar
function custom_sidebar() {
$args = array(
'id' => 'unique_id',
'name' => __( 'right-sidebar', 'computer' ),
'description' => __( 'This is the right hand sidebar ', 'computer' ),
'before_title' => '<div class="widgettitle">',
'after_title' => '</div>',
'before_widget' => '<li id="%1$s" class="widget %2$s">',
'after_widget' => '</li>',
);
register_sidebar( $args );
}
// Hook into the 'widgets_init' action
add_action( 'widgets_init', 'custom_sidebar' );
}
After register sidebar open sidebar.php and add dynamic sidebar function into sidebar.php..
<?php
if(!function_exists('dynamic_sidebar') || !dynamic_sidebar('right-sidebar' )):
?>
<?php endif; ?>
This function dynamically added the sidebar..
Now we are going to add wordpress function into index.php file and include header, footer, and sidebar into index.php file.
What is means of get_header(); , get_sidebar(); and get_footer(); function see below..
Get_header();
Includes the header.php template file from your current theme's directory. If a name is specified then a specialised header header-{name}.php will be included.
If the theme contains no header.php file then the header from the default theme wp-includes/theme-compat/header.php will be included.
Get_sidebar();
Includes the sidebar.php template file from your current theme's directory.
If a name ($name) is specified then a specialized sidebar sidebar-{name}.php will be included. If sidebar-{name}.php does not exist, then it will fallback to loading sidebar.php.
If the theme contains no sidebar.php file then the sidebar from the default theme wp-includes/theme-compat/sidebar.php will be included.
Get_footer();
Includes the footer.php template file from your current theme's directory. if a name is specified then a specialised footer footer-{name}.php will be included.
If the theme contains no footer.php file then the footer from the default theme wp-includes/theme-compat/footer.php will be included.
After completing this part go to wordpress and open your wordpress account
Now go to Posts tab see below..
Click on Add New
Now Post your content
And make new category if you don’t make category then post will be add default in uncategorized category see it below:-
And publish post.. our original wordpress theme design given below so we adjust content and function for design same as theme..
So some post are remaining welcome, schedule and contact so goto post tab and create remaining post and make new category name like content select content category for all three posts.
After creating the Posts goto index.php file make function for fetching the post into theme template look…
This function fetching the all post into theme template see theme hows look
That time our post is not show as a orginal theme cause
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<?php the_content(); ?>
<?php endwhile; ?>
<?php endif; ?>
Function
fetch all post into theme but latest news and content category post like
welcome, schedule, and contact is design is different so change in this
function define category in this function and set the content in theme how see
below:-
See we define condition in top post give the condition if post under category 44 then show only latestnews post and in the bottom post define if the post under category 45 then show only category 45 posts.. how to check category id number simple goto Posts -> categories and mouseover on the category then link is shown below show the category and tag id..
After completing the post part then check your wordpress theme.. theme look like this..
We’re done, Finally!
Now save your file and open this file in your browser..
So please tell me How was the tutorial? I hope you learned something from this tutorial. If you have some techniques, comments, suggestions please share and drop it below.
If you liked this tutorial kindly share it with your friends. Thanks! :)