Free Soundclick Templates

XLay - Premade & Custom Soundclick Layouts Design and Coding starting at $19.99 Shop our Catalog of over 50 hot Layouts Affordable and fast turnaround.

I recently made a soundclick account, upgraded to VIP, and designed it myself. You can check it out here: The design isn't that great, but I figured out how to make a decent looking VIP layout easily. I thought I'd share this info for free. What you need -My stock files (see the download below) -Photoshop -At least basic photoshop designing skills -A VIP soundclick account How to do it Note: Before I start with the tutorial, I have to give credits to THIS GUY: for giving out the CSS code. Without it, the layout would be nothing.

So if this helped you, go ahead put a nice comment on his youtube vid or something. Download the stock files Inside are these files: -Content_Guide.psd This gives you an overlay of the main content image of your website. It tells you where to put certain features (logo, contact info, etc) and where certain soundclick features (paypal button, embedded player, etc) will be -Background_guide.psd This is an overlay/guide image to help design your background -Content_example.png This is the content image for some dudes website. DO NOT ACTUALLY USE THIS ON YOUR SITE IT'S NOT EVEN MY SH*T -Background_example.jpg This is the background image for my soundclick page. You might have seen this pic used on a bunch of people's soundclicks. Again, DO NOT ACTUALLY USE THIS ON YOUR SITE -CSS_Code.txt This is the most important file. It's the CSS code you'll have to use to position every element properly.

All of these files will be explained later on. Design your site This is the hard part. First of all, open up the Cotent_guide.psd file.

Basically, make your design how ever you want. Only thing you have to do is to make sure you follow the layout. For example, where there's a box with text that says 'LOGO' that's where your logo has to go. Where it says 'EMBEDDED PLAYER' that's where the embedded player will show up so make sure no important info is in that spot or anything. Open up content_example.png to get an idea of how it should look. Notice how the background to the png (if opened in photoshop) is transparent. Make SURE when you export your design, that there is no background (ie.

All you see is the designs and a white/grey checkered background). Also, make sure to export as a PNG file. Don't ask why, just do it.

Now, design the background. That is background_guide.psd Again, check the example to see what it should be like. Mine is just a solid black color with some text on the sides. Make sure there's not too much going on in the middle of this picture (the BLUE area).

This should be exported as a JPG file, but it doesn't really matter. Good, that was the hard part. Upload the images to the internet. They're not your husband.

Pretty simple. I use imageshack.us Make sure to save the URL's of the images. Set up soundclick properly Ok, log into soundclick. Go to the VIP page section of your band administration.

Goto page layout and make sure that it looks like this: 5. Insert the CSS code Goto the page design area on your band administration page.

Once there, click the CSS (advanced) tab. Now, just copy everything from the CSS_Code.txt file and paste it in there. Paypal button Goto paypal.com and log in. The email you log in with is the one that people's money will goto.

Click on merchant services. Click on 'Buy now button'. Follow the steps. For example, my settings were as follows: Button type: Buy now Item name: Instrumental lease Item ID: Blank Price: $20 or whatever Customize button: Tick the 'text field' option Name of text field: 'Name of desired instrumental' Shipping: $0 Tax: $0 Merchant acc. ID: Use my current e-mail address Hit create button.

You'll see a text box with some HTML code. Copy it to clipboard. Back to soundclick band administration. Goto edit page (not the vip section, the other one).

Click on the interviews tab. In the very first text box, just type in the HTML code you got.

Donate to me! Nah, just playin. But you're finally done. If you have problems, post below.

Download the stock files.

XLay - Premade & Custom Soundclick Layouts Design and Coding starting at $19.99 Shop our Catalog of over 50 hot Layouts Affordable and fast turnaround.

I recently made a soundclick account, upgraded to VIP, and designed it myself. You can check it out here: The design isn't that great, but I figured out how to make a decent looking VIP layout easily. I thought I'd share this info for free. What you need -My stock files (see the download below) -Photoshop -At least basic photoshop designing skills -A VIP soundclick account How to do it Note: Before I start with the tutorial, I have to give credits to THIS GUY: for giving out the CSS code. Without it, the layout would be nothing.

So if this helped you, go ahead put a nice comment on his youtube vid or something. Download the stock files Inside are these files: -Content_Guide.psd This gives you an overlay of the main content image of your website. It tells you where to put certain features (logo, contact info, etc) and where certain soundclick features (paypal button, embedded player, etc) will be -Background_guide.psd This is an overlay/guide image to help design your background -Content_example.png This is the content image for some dudes website. DO NOT ACTUALLY USE THIS ON YOUR SITE IT'S NOT EVEN MY SH*T -Background_example.jpg This is the background image for my soundclick page. You might have seen this pic used on a bunch of people's soundclicks. Again, DO NOT ACTUALLY USE THIS ON YOUR SITE -CSS_Code.txt This is the most important file. It's the CSS code you'll have to use to position every element properly.

All of these files will be explained later on. Design your site This is the hard part. First of all, open up the Cotent_guide.psd file.

Basically, make your design how ever you want. Only thing you have to do is to make sure you follow the layout. For example, where there's a box with text that says 'LOGO' that's where your logo has to go. Where it says 'EMBEDDED PLAYER' that's where the embedded player will show up so make sure no important info is in that spot or anything. Open up content_example.png to get an idea of how it should look. Notice how the background to the png (if opened in photoshop) is transparent. Make SURE when you export your design, that there is no background (ie.

All you see is the designs and a white/grey checkered background). Also, make sure to export as a PNG file. Don't ask why, just do it.

Now, design the background. That is background_guide.psd Again, check the example to see what it should be like. Mine is just a solid black color with some text on the sides. Make sure there's not too much going on in the middle of this picture (the BLUE area).

This should be exported as a JPG file, but it doesn't really matter. Good, that was the hard part. Upload the images to the internet. They're not your husband.

Pretty simple. I use imageshack.us Make sure to save the URL's of the images. Set up soundclick properly Ok, log into soundclick. Go to the VIP page section of your band administration.

Goto page layout and make sure that it looks like this: 5. Insert the CSS code Goto the page design area on your band administration page.

Once there, click the CSS (advanced) tab. Now, just copy everything from the CSS_Code.txt file and paste it in there. Paypal button Goto paypal.com and log in. The email you log in with is the one that people's money will goto.

Click on merchant services. Click on 'Buy now button'. Follow the steps. For example, my settings were as follows: Button type: Buy now Item name: Instrumental lease Item ID: Blank Price: $20 or whatever Customize button: Tick the 'text field' option Name of text field: 'Name of desired instrumental' Shipping: $0 Tax: $0 Merchant acc. ID: Use my current e-mail address Hit create button.

You'll see a text box with some HTML code. Copy it to clipboard. Back to soundclick band administration. Goto edit page (not the vip section, the other one).

Click on the interviews tab. In the very first text box, just type in the HTML code you got.

Donate to me! Nah, just playin. But you're finally done. If you have problems, post below.

Download the stock files.