Oct
09

Tutorial : Making WordPress Theme by examples #1

First Step :

  1. You should to have Webmaster editing tool (I use Dreamweaver)
  2. You should to have Graphcis editing tool (I use Adobe Photoshop)
  3. Important here, you should to have local webserver for a testing mode. (I use Xampp) Download and install Xampp now.

Second Steps :

  • Draw your WordPress theme layout. (Single column or 2 column or 3 column or 4 column)
  • Choose color (blue?, black?, white?, orange? etc)
  • Ok? done? now we go to the next steps. (I picked 3 column theme) Here is my layout.

Tutorial : Making WordPress Theme by examples #1

Open your Dreamweaver and create new HTML file and it should be like this.












Now create your layout.


My Entry

End of html file











My Entry

Live view your HTML file here

Now your layout task is done! Tomorrow we learn how to add style to our layout. Subscribe our feed now :)

This post was viewed 26,351 times

32 Comments to “Tutorial : Making WordPress Theme by examples #1” | Leave a Comment!

  1. Levis says:

    I am really impressed, I must say. Really hardly ever do I encounter a blog that’s each educative and entertaining, and let me tell you, you will have hit the nail on the head. Really great.

    Tuxedo Park dog walker

  2. Jack R. says:

    I thought about it, but I think it’s too hard for me. Thanks for the post anyway.

  3. Fantastic post and simple to understand description. How do I go about getting permission to share section of the article within my upcoming newsletter?

  4. Paulo says:

    I think it will be nice to add other related tutorial in this one, like other examples of codes for the single.php or page.php template.

  5. When I originally commented I clicked the “Notify me when new comments are added” checkbox and now each time a comment is added I get four e-mails with the same comment. Is there any way you can remove me from that service? Appreciate it!

  6. Duane says:

    Hey wheres the other tutorials? hehe nice job though

  7. Devin Walker says:

    Hey, good advice for a n00b like me. I’ve been trying to pimp my wordpress site out. Check out what I’ve done so far: http://www.dlocc.com No quite as cool as this. Although, I do like the brush metal bg.

    Dlocc

  8. Ernie says:

    Wheres part 2???

    Great job!

  9. Robin says:

    Well that was a lesson and a half. I’m not sure if I can do that but it’s very informative.

  10. Steveorevo says:

    ThemeDreamer v.41 is now out. Makes it a bit easier for Dreamweaver developers mod’ing WP themes.

  11. gorge says:

    thank you for this tutorial

  12. It is not out-of-date information? Because I have other data on this theme. http://video-online-go.ru/map.html

  13. bopdilly says:

    Excellent site! I wish the owner to develop and please all! http://sex-free-online.ru/map.html

  14. Ken says:

    Hi,
    You did a great job writing down here a lot of good information.
    I’m not an expert in php and your advices really help.
    Now, I want to change my default wp theme (on my new blog – the old one is ok) in just one way: I want every post from index and achieve pages to has (read more) by default. Let’s say, they will can read only the first paragraph, or first 50 characters or something like this… not entire post in index.
    I really don’t like when the people can read with just one click on my home page, entire all (10) latest posts.
    Can you help me with this?
    I really appreciate!
    Ken.

  15. where I can find a tool wizard to build my theme of wordpress online?

  16. Bridges the gap between Dreamweaver and WordPress. Just open an exiting theme in Dw and hack away…

    http://www.themedreamer.com

  17. Squeaky says:

    Nice tutorial. Is the a second tutorial?

  18. Malaikax says:

    Nice.. This helping me to create my own theme next. Thx for share. You are the best !

  19. Andy says:

    Oh, and did not know about it. Thanks for the information …

  20. danny says:

    Hi Jai,

    Please do continue this tutorial. It will help many :)

  21. wanmus says:

    wow…it’s looks like malayia will have many wordpress theme builder..it’s a good news..keep working

  22. samuro says:

    I’ve never found wordpress themes tutorial like this. It’s really interesting, keep the good works. I am waiting for others your tutorial. Great Bob!

  23. Leanne says:

    Just downloaded your theme to my new site! Where have you been…. I have been searching for days for a nice clean simple theme and you have them all…glad I finally found you – you have the best themes! :)

  24. reezluv says:

    I like your tutorial..when the next tutorials?erm..I wish I will make some great theme just like you on eday..thanks

  25. rumblepup says:

    I found you today. Great resource and great tutorial. Please come out with next one soon!

  26. vangardx says:

    keep it up..jom meriahkan theme2 dari malaysian

  27. iCalvyn says:

    great tutorial, wish to have your next style step…

  28. komad says:

    I was able to change the “Blue Box” text by editing the logo.psd file that’s stored in the images folder.

  29. kita says:

    wahhh…tutorial yang bagus sekali….bila nak post episd 2 pulak…cepat ler update cikit erkkkk

  30. shery says:

    thanks waiting for the next entries

  31. komad says:

    Dear Bob, I’m designing my site using your WordPress template, Blue Box. I was wondering how I can rename or remove the “Blue Box” text that appears on the blue banner located in the upper left corner of the page. Thanks for your help.

  32. geblek says:

    continue please…!


Websites that Link to this Post

  1. wedding jewelry sets
  2. Free Music Downloads for iPods
  3. Cara Sederhana membuat Halaman Tema Wordpress.
  4. links for 2008-06-06 | simonponder.net
  5. Malaysian Blogger Rss Feed » Blog Archive » Tutorial : Making Wordpress Theme by examples #1
  6. links for 2007-10-15 at DeStructUred Blog

Leave a comment

Search :
Browse :
Archive :

$$$ Make Money $$$

Become an Affiliate

Welcome to Blog Oh! Blog's affiliate program! I personally invite you to make money by selling all of Blog Oh! Blog's Premium themes.

You will get a whopping 25% share on each sale generated through your affiliate link.

All you need to do is sign up as Blog Oh! Blog's affiliate, choose a banner, paste it on your website or blog and wait for sales to happen. It's as simple as that!

All affiliates will be paid on 10th of every month. Your affiliate earning needs to be a minimum $50 to get paid for each month.

Here is the sign up link and here are some banners to get you started!