Step 1: Background and Base

Ok so this banner is going to be modeled after the look of legit tutorials. Don’t worry though, that’s not the important part of the tutorial. I’ll be teaching you how to make a cool ribbon, animation, and more. Anyway, open up a fresh document 200×200 pixels in size. Set the background to white.

Create a new layer (ctrl+shift+new), and grab the rectangular marquee tool. On the top bar change the style to “fixed size” and enter the dimensions 123×123 pixels. Click on the document to make our square, and fill the background. I used #dbd4bd.

Ok, now I’m going to apply the same pattern that the legit tutorials theme has. To do this open up blending options, on the box layer, and apply pattern overlay.

Create a new layer and grab a 160 pixel white soft brush. Brush the top of our background just so it doesn’t look so flat.

Get a selection of the original box (ctrl+click on the layers pallet), and contract the selection by 1 pixel (select>modify>contract). Now select the inverse (select>inverse) and delete that selection from the shine layer.

Introduction

If you have been using wordpress for a little while, you have probably noticed the little post except box underneath the wysiwyg editor, when writing a post. Until the other day, I never understood what this feature was, and how it could make my blogging that much easier. In this article/tutorial you will learn what post excepts are, and how to implement them in your theme.

What are post excepts?

Basically post excepts are little spans of text you can insert any where on your theme. In my case, I place them in my index.php right next to my post images. This allows me to write a little something about each post, without it being part of the actual post body. This is great for magazine style wordpress themes! Let’s take a look atwhat I’m talking about.

How can I include post excepts in my theme?

Simple, in fact, its just one line of code. here’s the code to output the post excepts for each post. All you have to do is place it somewhere in the wordpress loop.

Remember to include the code in both index and single .php. Happy Theming!

Why Aren’t My Tutorials Popular?

This is a common question when running a photoshop tutorial site. You’re probably asking yourself: Are my tutorials to long? To short? No good? Hard to follow?. Even though half of those are probably the case (just kidding), thats not what it comes down to. The fact is that 90% of the time it’s that little 40×40 icon that sits next to your tutorial. Think about it, when you open up your favorite tutorial directory, where are your eyes attracted to? Yep, thats right, the icons. Even if you try to ignore them, you’re still doing it on a subconscious level. You’ll most likely read the title of the one with the coolest icon first. It’s funny how the brain works.

So whats wrong with my icons?

Chances are they’re just boring. To flat, with no contrast or vibrant colors. Lets take a look at the icon, of a tutorial here, that experienced the most clicks.

You’re probably thinking to yourself “oh my god! what is that? It looks like it was made by god himself! I cant even tell what it is, but I’m gonna click it!”. Ok well maybe your not thinking that… but you get the idea. Even though we’ve written better tutorials before, it still received 1700 clicks in a matter of 8 days. That’s more then tutorials which have been up for over a month. I watched this tutorial pass up tutorials that were posted 2 days before mine, in a matter of 24 hours. Anyway, keep this in mind.

Remember, clicks aren’t everything.

Getting visitors to your site is only half the battle. Getting them to stay, now thats a completely different ball game. Content is king, no matter what anyone tells you. You need to produce high quality unique content if you want users to stick.

Hope you guys enjoyed this article, comments are welcome.

Why Use Textures?

From my point of view, textures are making a huge move in the web design world. Back in the day, people just used a basic pattern for their website backgrounds. These usually consisted of diagonal lines, stripes, x’s, or whatever. After that stage I noticed people using fancy patterns as backgrounds. You know, something you’d find on a chair in some old victorian home. Now-a-days, websites are all about using multiple textures, to create a grungy, yet simplistic, feel to their design. Anyway, this specific texture will look good as the background for a dark themed website, or even on a navigation bar.

Download This Texture

Click to Download the 1200×1200 .png

Step 1: Background

Before we begin making the wallpaper, we must first create our diamond logo. Open up a fresh document 350×350 pixels in size, with a white background.

Create a new layer and set your foreground color to #d8e4ef.

Step 1: The Background

Open up a new document whatever size you want. I’ll be using 600×300 so the images fit on this page fine.

Grab the paint bucket tool and fill the background with a nice light yellow (#e3dfcb).

Create a new layer (ctrl+shift+n), set your foreground color to #524238, and your background color to #cab6a9. Render clouds on the new layer (filter>render>clouds).

Apply splatter to the clouds (filter>brush strokes>splatter). Use the settings shown in the picture.

Lower the opacity of this layer to 30 percent. Bam, we now have a simple grungy background to work over. Don’t worry it’ll get better.

Pre-Step: Find a Demo Image

Before we begin, find an image to use as a demo. This image will be placed in the slider to show us how it will look when the slider is live. I will be using this picture of a tree which I found on google.

Step 1: Find a Picture

Before we can begin, you’re going to need a photo to use. I will be using this picture of a flower I downed on the internet. Once found, open the picture in photoshop, and resize it if you need to (image>image size).

Pre-Step: 960gs and a Pattern

Before we begin, make sure you are familiar with how to use the 960 grid system. If you’re not sure what that is, or how to use it, you can read my tutorial on it here. Also, we will be using 1 pattern for this layout, here it is (right click>save as):

About The Month

Legit Tutorials had an amazing first month, and it’s all thanks to you guys, the visitors. When Legit Tutorials launched, on November 22, it had a buggy design, and sloppy tutorials. By the end of the month, legit tutorials was completely redesigned, cleaned up, and growing faster than I ever thought.

Best Tutorials of Month 1

These tutorials are a mix of my personal favorites, and the most popular, tutorials of the month. They are in no particular order.

Dark Blog Theme

Before I wrote this tutorial, I first designed it for fun. I realized it looked nice, afterwards, and decided to write a tutorial on it. To this day (December 27, 2010), Dark Blog Theme is still the highest viewed tutorial on the whole site. View “Dark Blog Theme” Now.

Designing a Graffiti Logo

This one was my personal favorite, and a very popular tutorial, this month. I’ve always been a fan of graffiti. I love going to venice beach, or other parts of Los Angeles, and seeing all the graffiti, while visiting. That’s what inspired me to write this tutorial. View “Designing a Graffiti Logo” now.

Setting Up/Using 960gs in Photoshop

Although this tutorial is very basic tutorial, I choose it because it’s very well written. Not only that, but it also brings in organic search engine hits! I got tired of explaining 960gs over, and over, so I decided to write a separate tutorial that I could refer people to. View “Setting Up/Using 960gs In Photoshop” Now.

Best Downloads of Month 1

We only had two non-source file downloads, but here they are anyway.

LegitTutorials 1 Full WordPress Skin

Once Legit Tutorials was redesigned, I decided to release the original skin for free. LT1 is a completly unique skin, easy to use, and widget ready! Download “Legit Tutorials 1 Full WordPress Skin” Now.

Dark Blog Template

Immediately after writing the tutorial on how to design it, I coded and released it. I thought it was cool to have a tutorial, and a download, for the same theme!Download “Dark Blog Template Download” Now.

Conclusion

Well thats it, this month has been great, and its been amazing watching legit tutorials grow. I cant wait to see what next month holds. Remember to follow/like us too!