Building a Theme

1. After finishing my design in photoshop I carried on by building pure HTML5 &CSS website
2. Creating php files. For this part I have used files of Blank Theme  given by Lynda.com All those files include neccesary php code for all basic pages. As they don’t do any harm I didn’t have a need to remove them.  Screenshot of all files and folders from Blank Theme Template

3.  Following a tutorials from Lynda.com, the following step was to create a sidebar. I slightly jumped over this step. Where I almost deleted all content form sidebar.php so this was blank.

4. Creating Navigation:

  • to register  Main Navigation Menu in function.php

if (function_exists(‘register_nav_menus’)) {
register_nav_menus(
array(
‘main_nav’ => ‘Main Navigation Menu’
)
);
}

  • creating all pages for Main Navigation Menu and given template names:

<?php

/*
Template Name: About Us
*/

?>

home.php, about_us.php, catalog.php, services.php, contact.php

Same steps followed when creating other 3 navigations.

5. Next step was to create  page-product.php & page-category.php useing custom fields. Based on this skill I built rest of a theme what turned to be a bad move, where instead of post I have used only a pages.

6. Building about_us & services pages. This was straight foward where I just filled text field with html code.

7. Home page template: Over here I repeated steps for custom fields creating latest jewellerey page and 2 latest items

8. Back with sidebars. Reason I didn’t work with sidebars early from a start was that I couldn’t find right code. Everything I wanted to achieve was to use different elements ( catalog navigation, jquery and posts ) for diferent pages useing a statement when to include those elements. Finaly I came a cross different solution:

Creating a new sidebar-name.php and adding this extra name to page.php we need. Example:

about_us.php include <?php get_sidebar(‘collection’); ?>   where sidebar-collection.php include search form and jquery plugin – widget.

So this step required to create few sidebars for different pages:

  • sidebar.php (home.php) – search form and posts
  • sidebar-collection(about_us.php, services.php) – include search form &  jquery plugin
  • sidebar-contact.php ( contact.php) – search form and posts
  • sidebar-catalog.php(catalog.php, page-product.php) – search form and catalog navigation
  • sidebar-category.php(page-category.php) – search form, catalog navigation and jquery

9.  Including posts into a sidebars:

http://wordpress.org/support/topic/how-to-show-single-post-content-in-sidebar

<?php query_posts('p=96'); if(have_posts()) : the_post(); ?> 
<?php the_content(); ?>
<?php endif; ?>

10. Plugins and widget area. For my contact page I have used FS Contact form plugin. Which need to be installed, activate and php code placed into our page.php. All elements are available to style as we need. 
Jquery plugin is placed in widget area as this widget will be placed into our sidebars where we need to include our slideshow. This required to install and activate gallery where we placed our images.
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: