Posted on February 2, 2009 with No Comments
We have almost completed the coding of the WordPress theme we where making. Now its time to make it a bit more visually appealing. As I have shown you in the first post of this series, We are making a minimal theme without many images.. So CSS is the star here.
This is how our theme going to be after Styling.
Tags: CSS, Design, Download, fee, Free, Freebie, HTML, Template, theme, tools, Tutorial, wordpress, wp
Category: Tutorials
Posted on November 8, 2008 with No Comments
This is the third post in my ‘WordPress theme for uber n00bs‘ series. If you haven’t read my past posts in the series you will not understand what I am talking here, so go and try to learn the previous posts in the series.
This part is where you exactly need a locally installed WordPress, From this chapter we are going to create a WordPress theme step by step, So Install the WordPress in your computer for convenience. If you have installed Web Developer Server Suit, The server must be running now, go to http://localhost/wordpress/ to start running WordPress, you might need to finish the WordPress installation (Giving email, Blog name and getting a password.)
Step 1: make sure your local host is running, Open the ‘Web-Developer Controller’ from your Windows Desktop, we need Apache and MySQL running to start and work on WordPress (See the marking, in below picture)

Now the local server must be running on your PC, you can close the ‘Web Developer Suit Controller’ window now, and Navigate to the WordPress theme folder in your local disk : %drive%\www\webapps\wordpress\wp-content\themes\ – replace the %drive% with your Drive letter, C:\, D:\ etc.. where Web Developer Suit is installed.
Step 2 : Now create a folder for your theme in the WordPress themes folder, name it as tutorial for now.
Step 3 : Now open intype or notepad and create blank style.css and index.php files in the folder tutorial. Now open index.php in intype and paste these lines to it and save it.

<?php get_header(); ?>
<?php include(TEMPLATEPATH . '/blog.php'); ?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
Now you did is, you called the header, blog-module, sidebar, and footer templates to the index.php , these are the modules we are going to create in the coming episodes. Now your tutorial theme folder must be like this

For some more expansion we can add theme information. Theme informations are added in the first lines of style.css file as some comments. WordPress can read the theme details from it.
/*
Theme Name: FeatherPot Tutorial
Theme URI: the-theme's-homepage
Description: A basic theme created with the help of a FeatherPot Tutorial
Author: FeatherPot Reader
Author URI: http://featherpot.com
Version: 1.0
.
General comments/License Statement if any.
To create your own WordPress theme follow the tutorial in FeatherPot. This is a Free theme released under GPL terms
.
*/
Now you can activate the theme we are creating, login to the the WordPress dashboard of local installation by http://localhost/wordpress/wp-admin/, and navigate to Design > Themes > and activate the ‘FeatherPot Tutorial‘ theme by clicking on the name. you can see the theme details we have just added into the style.css working here. Take a look at the theme we just made, how is that ?
OK, don’t get nervous, you are seeing some errors because WordPress can’t find some template files we said to include to the index.php only you and me know that we didn’t created those templates, and we will create them in the coming episodes.
Hope you have understood todays class, keep in mind that a WordPress theme must have a style.css and index.php to work, else you will not be able to find the theme in the Design selection area of WordPress dash board. That means a WordPress theme will not work if there are many files except index.php and style.css
Stay tuned without destroying the work we have done. If you have any doubts kindly add it as a comment, emails / IMs won’t get a reply anymore !
Tags: CSS, downoad, Free, Freebie, HTML, php, programming, Template, theme, tut, Tutorial, wordpress
Category: Tutorials
Posted on October 28, 2008 with 7 Comments
There is a reason why I called you a ‘Hyper N00b’. I call myself noob, don’t know anything completely.. still learning.. etc.. are the reasons.. So if a noob is teaching someone something, I must call him Hyper Noob
So you are looking for a n00b-ready tutorial to create WordPress themes ? Here we go I will teach you how to create a basic WordPress theme with common functionality.
I am not creating a unique thing here, similar tutorials have been made on the web by many good designers before I heard of WordPress ! Now you will ask ‘Then Why ?’ OK most of the tutorials is scaled to fit a normal guy who have an average knowledge about WordPress, php, html etc.. On my first day with WordPress Theme, It was a bit difficult for me to understand. And many of my friends came through IM’s asking for help and step by step information for creating a WordPress theme by their own. Sometimes it will be a bit annoying, answering their ‘hyper-noob’ questions
Now you might have got an idea about what we are going to do.
This tutorial is splited into some episodes for easy grasping. Each day we will learn about some elements of a basic theme. Today we will by creating an environment for studying. Here our environment consist of an WAMP server, The WordPress Software, WordPress Codex as a reference (Please guys now use this one, am trying to simplify what CODEX says with my new ******
) Some desktop Applications of course time and dedication.
Tools You Need
To run WordPress locally on the computer, you need to setup a AMP (Apache, MySQL, PHP) Software package, Many are there and you can choose accordingly Everything depends on the platform you are using, WAMP for Windows users, MAMP for Mac users, LAMP for Linux users etc… Here is the Complete list of AMP.
WordPress Codex has all explanations for you on ‘How to Create a WordPress theme’ But here am using WP Codex just to refer you about the Functions and Template Tags Used in WordPress themes. Don’t get nervous if I said something that you can’t grasp, Just leave a comment here, I will respond to you !. Install these things on your computer and wait for my next post, It will be posted soon for sure ! If you can’t Install WordPress, WAMP or anything email me or leave a comment here. If you have selected WebDeveloper Server Suit, WordPress should be Pre-Installed in it, If it is not the latest Just Upgrade it. and navigate to http://localhost/wordpress.

All the Tools I said above are noob ready there are many advanced softwares with simlar functions available, Its up to you which to choose, I will be following the listed things.
Tags: Code, CSS, Design, Free, HTML, Programme, Series, Template, theme, Tutorial, wordpress
Category: Tutorials
Posted on June 16, 2008 with No Comments
Comments are the one of the most attracted part of a blog design, where the readers can also participate, and do anything as there own. So the designers must be careful with the Comment Designs, keeping it unique will make readers remember about the whole blog. I am presenting you some of the inspiring comment templates
Posted on May 23, 2008 with 3 Comments
Over the past few years WordPress was the dominating weblog engine, It is because of its easy to use environment, the wide availability of themes, plugins and other add-ons as well as the support from the huge community that made. But what is even more important is the fact that WordPress is an Open Source project. Means every one can read and understand its well documented Source Code since it is free of cost.
Posted on May 19, 2008 with No Comments
Instead of each option being boxed in a clickable rectangle, there is a 1px notch in each corner of the Google Analytics Left Navigation bar. It’s not necessarily a curved corner, but it is a little softer than a normal box. Nice little trick.