How to create a dark wordpress business layout

Razvan

Hello. In this tutorial i will show you how to create a clean dark wordpress theme. You can download the PSD layout for Free if you don’t manage to create alone this layout. however i recommend you to try to follow my tutorial because i am sure you will came up with a great simple wordpress layout

For start create a new document with the following sizes: 1200×1200 pixels. Set the background color to  #D5D5D5. As you can see from the following image i have placed a dark shape ( #414141 )on the top of the layout.

On the top of the layout i will add our simple text logo: Free-Stock-Graphics

I will use the following layer styles.

Under my logo i will create a round shape with Rounded Rectangle Tool

For this navigation bar i will use the following layer styles.

This is how the navigation bar will look like.

Under this navigation bar i will add another shape where we will place our slide show. You can use different types of slides hows powered by jquery, or mooTools.

Over my Horizontal Navigation Bar i will create another round shape. here i will create a search form.

Here are the layer styles i have used to create this indented search form.

This is my result so far.

On the right side i will create another round shape, where i will place the latest blog posts.

To create this shape i have used the following color: #CFCFCF, and of course i have used also a simple layer style

On the footer of the layout i have placed some text and some horizontal lines.

I will zoom in to see better how this lines are aligned. If you look more carefully you will see that i have used two thin lines with different colors.

I have placed also on the left side on the footer some text, and this is my result.

On the body of the layout i have placed also some text and some images.

And on the right side i have used Horizontal Type Tool to write some text in the Latest Blog posts area.

This is my final result. i hope you like it. If you need another types of tutorial do not hesitate to leave us a comment with your suggestion. I would also like to recommend hosting plans for wordpress

8 Responses to “How to create a dark wordpress business layout”

  1. Reply Razvan says:

    Awesome tutorial. I really like it

  2. Reply Cgbaran says:

    Great tutorial thanks

  3. Reply cgvector says:

    Hi very nice tutorial it help me a lot thanks

  4. Reply Brett Widmann says:

    This is an amazing tutorial! I love the final product. Thank you.

  5. Reply zimo says:

    Yes, this is step 1 …a good tutorial about using Photoshop.
    But what about step 2 …making it a real wordpress theme?
    Thanks

  6. Reply Justin says:

    How does one go about implementing a custom layout like this?
    Thats a tutorial worth a million thanks!

    Thanks for the awesome site, looks like your just starting, I would be more than happy to contribute.

Leave a Reply

WordPress Themes

Free WordPress Themes
WordPress Themes ThemeForest
Close