How to Create an Elegant WordPress Theme – Tutorial



Join us right now!

Our Members get unlimited access to download everything




How to Create an Elegant WordPress Theme – Tutorial

In this tutorial, I will show you how to create an elegant WordPress theme. If you’re a member, you can download the PSD Layout for this tutorial at the bottom of the page. You can use this web template for consulting agency websites, services websites, marketing website templates, business website templates, finance website templates and more. The design is very clean and can be modified very easy into a great template.

This is our final design. Please click on the following image to see better how this elegant WordPress theme looks.

For start you need to create a new document. As always i recommend you to start with a blank document with sizes over 1100 pixels width. With Rectangle Tool create a big blue shape in top of your layout.

Then with Rounded rectangle Tool add another shape but this time use a darker blue.

Rasterize this shape. To rasterize a layer you need to right click on this layer inside your layer palette, and choose Rasterize shape. Then with Rectangular Marquee Tool make a selection like in the following image.

Hit the delete key on your keyboard until you leave only the top part of the dark blue shape. Do not forget to press on CTRL+D to deselect.

With Rounded rectangular Tool, create another white shape.

And then do another shape but a little smaller.

I will add a nice image with some sparks. here you can add your own images, or you can create a nice slide show.

On the left and right side i will create some small shapes with the same dark blue color.

Under the slideshow i will create a smooth shadow. You can create this shadow with brush tool.

The next step is to add a button in the hoover state. First create a rectangle with Rectangle Tool.

Bellow you will find all the layer styles i have used for this button.

Create a new layer ( press on CMD+SHIFT+ALT+N ) and then with brush tool create a small drawing. Make sure you use a brush with a smooth edge.

Then you can lower the opacity for this shape, and then you can go to Filter > Blur > Gaussian blur.

On top of this button please create a thin line ( created with Line Tool )

I will move to the bottom of the layout where i will create a shape.

Here are the layer styles i have used to create this shape

On the right side i will do the same. i will create there also a new shape.

With horizontal type tool i will create some text, and i will add some vector icons which you can find them in our vector icon pack. Download vector icons

I will add more text inside the shapes.

Also under the slides how i will create more text with horizontal type tool

On the right side i will create some circles. Here you can navigate through your slides

Bellow you can find the layer styles used for the small circles

And the last step is to add on the header of our wordpress theme some text buttons, and our logo with Ultimate Designer Toolkit

This is my final layout. I hope you like it. If you create a website based on this layout please leave a reply. i will be happy to see the outcome.

More Resources in Tutorials

How does Ultimate Designer Toolkit work?
Next »