Create a professional dubstep artist website

Lately I get a lot of questions on how to become a more professional dubstep artist in terms of publicity. As you know almost all dubstep artists have their own website with their gigs, biography, news and all that kind of stuff on it. Lots of those websites are custom made and if you don’t know anything about programming you won’t be able to put something like that together. But we’re going to change that. I’m going to show you how to create your own artist website without knowing lots of coding and stuff..

1. Preparation of your own dubstep artist website

Before we start creating a cool website for you as an dubstep artist, we have to prepare ourself for it. We need several things:

1A. Domain name and webhosting

The first thing is getting a webhosting account with your own domain name! Cool isn’t it?
I’ve spend some time searching for the cheapest and best webhosting and came with Hostgator.com

Click here to go over to their website and I’ll show you how to get your webhosting and domain:

Hostgator

First click on the web hosting or on view web hosting plans button, they’ll bring you to the same page.

Hostgator

Choose for the cheapest – it will give you a free domain, unlimited bandwidth and unlimited disk space (so you can upload as much tracks as you like ;-))
Click on ORDER NOW just like the image above shows.

Hostgator

What name will we choose? Of course you have your nickname, but is it available? Type it in the box to see if it’s available, keep on trying till you’re happy.
This name can’t be changed after you’ve registered it. Proceed to Step 2.

Hostgator

Choose for the Hatchling package (in case it isn’t selected). Then select the amount of time you want to register your domain and web hosting for. The longer the billing cycle is, the cheaper it gets.
I recommend to pay your website for at least 12 months.

After that we have to choose our username. Just pick one which fits you, but make sure you keep it in between 2-8 characters long (imo that sucks, cause DubstepTutor is 12 chars long). Also create a security pin.

Hostgator

I think this form speaks for itself. Just fill your credentials in and proceed to the next step.

Hostgator

You don’t need any of these hosting addons. They’re a waste of money. Make sure you UNCHECKED them and proceed to the next step.

Hostgator

Review your order details, make sure you CHECKED the terms and conditions button and then press CREATE ACCOUNT.

Hostgator

I’ve chosen for paypal payment. Choose Pay now to pay. Or if you want to subscribe to the recurring payments you choose subscribe.

Hostgator

Check if your details are right and press the PAY NOW button. (Nu betalen = Pay now in Dutch)

Hostgator

Your payment is made! You’re now owning your own dubstep artist website!

Hostgator

By now you should’ve received a e-mail with your login credentials. Save this e-mail somewhere others can’t see it, and don’t delete it. We need it – a lot!For this tutorial I created the website: natsdubstep.com – I’m gonna show you how it’s done on the basis of this site. Ok, that’s it for part 1A. Lets head over to part 1B.

1B. Downloading WordPress

The easiest way to create your own website without knowing lots of coding and stuff is to install WordPress. This is very easy, even for beginners like us!

wordpress

Go to http://wordpress.org/download/ and press the Download WordPress 3.x.x button.

wordpress

Save it somewhere you can find it. Put it in a folder where we can save other files too.
Woaw, that was easy! Let’s head over to the fun part, choosing a WordPress theme!

1C. Choosing a theme for your wordpress website

Because we are no designers, we’re going to choose a pre-made template for our artist website.
Head over to themeforest to choose on of their 2500+ themes.

Themeforest

I’ve chosen for the Shapeshifter 2 template, it’s a very nice responsive theme for our WordPress installation. Responsive means that the website adjusts itself to any type of visitor visiting your website – whether they’re on a tablet, pc, laptop, smartphone.. it doesn’t matter, they can watch your site without a problem.
If you want an other theme, I can understand. But this tutorial will focus on the Shapeshifter 2 theme.
Ok, did you found one? Yes? Let’s go then!

2. Setting up our WordPress

Ok, to create our super cool dubstep artist website we have to start with install our just downloaded WordPress on the server. To do this, we need a FTP (File Transfer Protocol) program. We use FlashFXP, in my opinion the fastest and easiest one around. Download it, install it and we can start!

FlashFXP

Open FlashFXP and go to Session -> Quick Connect

FlashFXP

Fill in your login details and press connect. Use your sites name (without http://www.) as address / url.

FlashFXP

Cool we logged in! Double click on the “www” folder and proceed to the next step.

FlashFXP

Delete the default.html file. We won’t need that anymore.

FlashFXP

Ok, now we’re going to upload our WordPress! Browse to the folder where you’ve saved WordPress. Double click on it and drag the contents of the folder into your FlashFXP like I show you above.
Press right mouse button, and press: “Transfer” or press CTRL+T.
Have some patience while our WordPress is uploading to our web hosting account. When it’s uploaded continue to the next step.

FlashFXP

Go to the e-mail you got from Hostgator.com before, and click on the link like you see above.

FlashFXP

Log in with the username and password which you also find in the e-mail you got from Hostgator.com. You’ll see a screen with a LOT of different buttons. Scroll down and find the heading “Databases” and click on “MySQL databases”. This is where we’re going to create a database for our WordPress installation.

FlashFXP

Go to new database, and fill in “wp”. After that press the button “create database”.

FlashFXP

Go to username, and fill in “wp”. Fill in your password twice, and click on the “create user” button.

FlashFXP

Make sure, you add your user to the database. Click “add” like you see above.

FlashFXP

Make sure you hit the “All privileges” button, and after that the “Make Changes” button.

FlashFXP

In FlashFXP rename wp-config-sample.php to wp-config.php. Install Notepad++ – the best editor around – and open “wp-config.php” with it.

FlashFXP

Find the DB_USER, DB_PASSWORD and DB_HOST lines and fill it in like this:

‘DB_NAME’, ‘yournick_wp’
‘DB_USER’, ‘yournick_wp’
‘DB_PASSWORD’, ‘yourpassword’

Save it, and upload it.
After that, browse to your website.

FlashFXP

Fill in your website’s name, your admin username, your admin password (twice), your email and keep the Privacy tab selected (you want to be found by Google). When you’ve done that, press “Install WordPress”.

FlashFXP

Succes! You just installed your first dubstep artist website! Press “Log In”.
If you want, you can go to your website and check it out. You’ll see that it’s a very blank website.. Let’s do something about it. It’s time to install the WordPress theme.

3. Installing the dubstep artist theme

Ok it’s time to install our super cool dubstep artist theme!

Theme

Go to your theme folder which you saved before, and drag it to the  wp-content/themes/ folder in FlashFXP. Give it some time to let it upload.

wordpress

After you’ve uploaded it, login to your back-end of your website. Which can be found at: http://your-website.com/wp-admin

Theme

In your back-end click on “Appearance”.

Theme

Find your theme, and activate it.

Theme

Read the message on top, and click on “Begin installing plugins”.

Theme

Make sure you select “Install” from the drop down menu, and press “apply”

Theme

Done! Ok we’re all set.. Ready to edit your own dubstep artist website!

4. Making the dubstep artist website ready for editing

We’ve done a LOT of work now.. If I were you, I’d take a break for a moment.. I’ll do that too.. Maybe you can take a look at your website..

Holy shit, there’s nothing on it?! What now?! Hmm lets think.. Oh yeah! We have to import some stuff.

Theme

Go to Tools > Import > WordPress and import the XML file found inside the Resources folder that comes in the download zip from ThemeForest. Download/import everything.

Theme

Make sure you select your own existing username on option 1. and 2. and then hit the box for “download and import file attachments”. Then hit submit.

Theme

Now we’re going to install a plugin, which help us making the website visible. Go to Plugins > Add new and search for Optiontree. You should find it right away, click download.
Note: Make sure you activate the plugin after the installation is done!

Theme

When it’s installed, go to Optiontree > Settings and hit the import bottom.

Theme

Go to your theme installation folder (on your hard drive) and find the Resources folder. Inside that folder is a file called: demo-theme-options.txt. Open that and copy all that’s inside. Paste it in the Theme options area like shown above. Make sure you press Import Theme Options.

This is the moment, you’ve been waiting for. You have your own dubstep artist website! Ofcourse you have change a lot, but that’s only textual – which you can do by your own. Go take a look at your artist website!

Because everyone will change their website in their own way, I won’t go in to detail on that part. You have to change the website by your own. I do have some tips and tricks for you:

1. Use the theme’s documentation: They give a lot of information on how to change your theme.2. Get some basic info about worpress here.
3. If you need help, post it in a comment.

I hope you enjoyed your new dubstep artist website and have fun with it! Thanks for your time, and I see you next time ;-)

Did you enjoy this article?
Share the love
Get free updates

About

NATS is a 25 year old dubstep producer. He learned producing dubstep all by himself. Even though it cost him a lot of time and effort, he does want to teach you how to do it for free!

2 Responses to “Create a professional dubstep artist website”

  1. Hey Nats,

    Let me say first, that you are totally right about HostGator. I’m a web designer / web developer, and i’ve been working with HostGator for more than five years, and I have nothing but the best to say about them.

    However your tutorial could be improved in one aspect. Instead of downloading WordPress, uploading by ftp, creating Database, installing and configuring wordpress, just use the “Fantastico De Luxe” feature on HostGator cPanel, where you can install dozens of CMS’s (including WordPress) with a few clicks.

    It saves you a lot of time, and a lot of headache for the newbies.

    Thanks for you music tutorials, i’m trying to learn how to make some good music, and they will be helpful. Just thought i should contribute with this tip.

    Cheers,
    Tiago Rio
    http://www.tiagorio.com

    • Hi Tiago,

      Cool, I didn’t even know that myself! Thanks for your comment and help.
      I’ll add it to the post asap.

      Cheers,

      NATS

I would love to interact with you!


9 − 9 =

 Subscribe to my newsletter