Create Shopping Cart Button

Create new document (Ctrl + N) with your desired width and height size. I will start with 250 x 100 pixels.

Creating the button

1. Fill 'Background' layer with Black color (Shift + F5).

2. Create new layer, called it Button layer (Shift + Ctrl + N).

3. Change your foreground color to #ff9000

4. Rounded Rectangle Tool (U). Use this setting:

The setting is located in 'Options' panel. If your 'Options' panel is not showing up, you can always pull it out by going to menu 'Window > Options'

Click to enlarge

5. Draw a rounded rectangle box in the middle of Button layer.

6. Right click on Button layer and choose 'Blending Options'

7. Apply 'Inner Glow' with this setting:

8. Apply 'Stroke' with this setting:

9. We are finish with the button and you should have something like this:

Writing the text

1. Horizontal Type Tool (T).

2. Change your foreground color to White.

3. With 'Horizontal Type Tool', type "Add to shopping cart" in the image area.

Photoshop will automatically create a new layer for the text.

Pull out your 'Character' panel and use this setting:

4. Right click on the newly created text layer and choose 'Blending Options'.

5. Apply 'Drop Shadow' with this setting:

Adding Custom Shape

1. Create new layer (Ctrl + Shift + N). Name the layer 'Cart'.

2. On your 'Tools' panel, click and hold the 'Shape Tool' and choose 'Custom Shape Tool'

3. On the 'Options' panel, change the setting of 'Custom Shape Tool' to the setting below.

If you don't have Shopping Cart shape, you should load the 'Web' shapes first by clicking the little arrow button.

4. Draw a shopping cart to the left of the text.

Extra touch

1. We are pretty much finished with the button. However, we can add extra touch to make the button looks more beautiful.

2. Change your foreground color to White.

3. Using 'Pen Tool' (P), draw a shape like below:

Using 'Pen Tool' is pretty hard if you never used it before. Keep playing with 'Pen Tool' for a while to get yourself used to it.

4. Rasterize the shape layer by clicking on the shape layer and goto 'Layer > Rasterize > Shape'

5. Use 'Magic Wand Tool' to select the empty area of Button layer

6. Go back to Shape 1 layer and press 'Delete' button on your keyboard.

7. Deselect the selection

8. Change the 'Opacity' of the Shape 1 layer to about 39%.

9. Save the work and you're done!