Setting up a WordPress eCommerce website

If you’re new to the world of ecommerce and you’re looking for a cheap option to build your site, I’d highly recommend using WordPress. Turning this free blog builder program into a functional site where you can process orders and control your design is more confusing to set up initially than many all-in-one builders out there, but could save you money in the long run. Plus, you will have the flexibility to take your site to another hosting company in the future, or even take it offline for awhile without losing everything if you change your mind.

WordPress is designed to build blogs, but instead of writing posts, you can create pages that will stay in place. By having it hosted yourself (usually $6-8/month), you’ll have full ecommerce abilities like using your own domain name, attaching a shopping cart plug-in to process sales, and using new themes, etc.

Initially, you can sign up for a free blog at www.wordpress.com and play around with various options, like uploading pictures, changing templates, changing widgets, etc.

Once you decide to have it hosted on your own, you’ll need to take a few steps:

1. Visit http://wordpress.org/hosting and pick a host that’s easy-to-use with WordPress.
2. Install an FTP client on your computer. This will enable you to save all the files you’ll need for your site and send them to your host. I highly recommend downloading the free option at http://smartftp.com.
3. Download the latest version of WordPress from http://wordpress.org/download.
4. Follow the instructions at http://codex.wordpress.org/Installing_WordPress to connect the dots.

Here are a few more resources that will be useful:

• http://www.wordpress.org – a collection of tutorials
• http://free-wordpress-plugins.blogspot.com – a list of plugins to make various functions work
• http://www.instinct.co.nz/?p=16 – a free shopping cart plug-in

Create a header to match your image

Look through the templates on your website builder to see if they have any headers that match the style for your company. A lot of newbies without much design experience can use Photoshop, Gimp, or similar programs to create their own header. If you don’t have Photoshop already, I think using Gimp would be a good (free) choice for editing your images.

Start by downloading the PC version and the help section. There  is also a good FAQ section available.   I really like Gimp because it is free and has a lot of tools Photoshop offers (at least for beginning and intermediate users). Go to www.gimp.org for more information and tutorials.

To create a header using Gimp:

1. Find the size you’ll need for your header by logging into your website builder and checking the default size. Generally, headers heights are anywhere from about 100 to 400 pixels, but 100-200 is a normal range. It all depends on the feel of your site and what you like.

2. Once you know what size you want, open Gimp, then go to File > New, and type the values you want for the size of your header.

3. Add any backgrounds you desire, any images, and text. You can play around with different tools like the gradient tool (most appropriately used subtly, or to fade the edges of images into the rest of your header, so you don’t have a tacky 90s feel). Use any of the following suggestions:

a. To add a picture, open the file of the picture you want in Gimp. Now you should have two Gimp windows open. One is your header and the other is the image you opened. In the window of the image you want to add, go to Edit > Copy. Then select the box where your header is, and select Edit > Paste. (Try stock photo sites like http://www.sxc.hu/, istockphotos.com, dreamstime.com, and any other stock photo sites you find using Google.)

b. To add text, like the name of your company, a slogan, or quote, select the text button (T) from the Gimp toolbox. Type your text in the Gimp text editor that will pop up. To change the font of the text, go to the Gimp toolbar, > File > Dialogs > Font. If you want to change the color, click on the color boxes to adjust the outline or filler color.

c. I suggest adding a new layer for each element you want to add to the canvas (at the top of the box where your template canvas is, go to Layer > New Layer and title the new layer with the element your adding, i.e. “person smiling,” or “sky background,” etc.) If you need to edit, hide, show, or delete layers, or change the order of which layer is on top, go to Dialog > Layers to see all your layers. Gimp.org has some basic tutorials teaching you how to do basic things in gimp.

d. To create a gradient background in Gimp, select the gradient tool from the toolbar (green gradient in a box).

i. Select the Foreground Color Box (black rectangle with arrows pointing back and forth to a white rectangle on the left). Double click to select the color you want. Once you’ve messed around with it for awhile and have a shade you like, make sure to write down the RGB values for in case you want to match your color in the future. (RGB tells the computer the amount of red, green, and blue in a given color. Sometimes, you may also see CMYK, which is a way to keep track of colors in print rather than on a computer screen.)

ii. A tool options box should show up at the bottom of your toolbar (shows opacity, mode, gradient, etc.) If not, go to File > Dialogs > Tool Options and the box should appear.

1. From here, change the gradient box to be whichever style you desire. If you want a simple gradient, or multiple gradient on the same layer, select “FG to Transparent.” Any time you see grey checkers using Gimp or Photoshop, it means the background is transparent so you can see behind that layer to the next layer.

2. You can also change the opacity of the color you want on the dark end of your gradient, if desired.

iii. Then pull your cursor over to the canvas and click on the spot you want to be dark, and drag over to the place you want to be transparent (don’t worry, this will turn into white in the final product. If you want the canvas to have a gradient in another spot, repeat the process by clicking where you want the second edge to start (dark color), and drag over to where you want the gradient to end.

4. Then save your image as an XCP (Gimp) file. I suggest saving often, and creating a copy of the original whenever you want to add a new element to your picture! When you’re ready to use a final image on your site, make sure to save it as an XCP file, but save a copy as a JPG file that can be used in your website builder.

5. You are starting to learn some of the basics of Gimp already!!! I promise it can be a lot of fun to work with once you know what you’re doing. When you can manipulate any image, you’ll never feel confined with your options again. I’d start trying to learn more by going through some of the beginner tutorials at www.gimp.org/tutorials/.

Try out Word Press

If you’re new to web design, Word Press is one of the best web design options for affordability flexibility. It was designed as an an open source blogging program, but there are tons of options to design pages to go the traditional website route. In addition to running the eCommerce SOS blog, I also have a few other accounts including a Word Press account to keep my siblings in touch sharing updates on everyone’s families. It’s a great place to share pictures with loved ones and friends who live far apart!

Register for a Word Press account and play around with various options, like uploading pictures, changing templates, changing widgets, etc.

Technically, Word Press “hosts” the site for you, but if you want to use a different domain (that doesn’t have Word Press in the name) you have to sign up for an additional hosting provider, like Blue Host, 1 and 1, iPowerWeb, or Hostmonster, just to name a few, once you’re ready to launch the site. You’ll have a lot more flexibility if you have the site hosted by a company that gives you FTP access so you can attach a shopping cart plug-in, use new themes, etc.)

See www.wordpress.org for a collection of tutorials, as well as http://free-wordpress-plugins.blogspot.com/, where you can find a list of good plugins to make various functions work. You can get a free shopping cart plug-in at http://www.instinct.co.nz/?p=16.

 

Assessing your options & selecting providers

Before starting a website, it’s important to consider your web design experience level, what functions your hosting company should allow, and what domain name would be best.

Web Design

Are you experienced enough to build the site yourself from scratch? If not, don’t kill yourself learning, as your time can be spent better elsewhere. You may want to look for an all-inclusive package that includes builder tools, templates, and hosting. I would compare rates and look at example templates to see how professional they are. Two builders I highly recommend for beginners are Word Press and Site Creator Plus. This blog has a section dedicated to each, so you can check back for more information on learning how to do a lot with each.

One of the easiest programs I know of is Site Creator Plus. They offer ecommerce tools, free templates, and make it very simple for anyone to get a website up and running very quickly. The start-up fee for Site Creator Plus is actually the price for your first year. So it’s $120 for the first year (only $10 per month) then $24.98 per month after that. You may want to graduate into something more advanced later on, but this is an excellent choice for beginners! I also recommend www.web.com if you’re looking for an all-inclusive program.

Also, if you’re feeling more adventurous and patient, you may want to look into:

• Word Press (www.wordpress.com). To make full use of this free program, you should have your site hosted (so you can use your own domain, attach a shopping cart plug-in, use new themes, etc.) See www.wordpress.org for a collection of tutorials, as well as http://free-wordpress-plugins.blogspot.com/, where you can find a list of good plugins to make various functions work. You can get a free shopping cart plug-in at http://www.instinct.co.nz/?p=16.

• Shopify (www.shopify.com). It is a really cool program, but does require more knowledge of HTML if you want to change the templates they provide. You can use it for free until you want to connect your own domain name or until you process 5 orders.

• Using a free site building program included in the price of a hosting package (like BlueHost, GoDaddy, etc.)

For the most part, I recommend avoiding free builders like Yahoo because they don’t allow much space for meta tags and you won’t have full control over editing your site. This will hurt you in the long run when you’re trying to optimize and drive traffic to your site. In general, avoid builders that will put their own advertisements all over your site. If you can, I’d try to find a company with a trial period so you don’t waste money on a service you end up not liking.

If you are an intermediate or advanced website builder, you’re welcome to use any program you feel comfortable with. If you’re looking for a free program, again Word Press would be a good option. NVU (www.nvu.com) is a free web authoring system comparable to Front Page or Dreamweaver, but one problem is that you have to set up a database to use for a shopping cart, which is really complicated unless you know what you’re doing. Plus, the actual programming for hooking it up to a database and collecting money is a whole new issue, so keep that in mind.

Hosting Providers

I recommend using Blue Host, 1and1.com, iPowerWeb, or Hostmonster, just to name a few. These options will require a more intermediate to advanced understanding of how hosting works, but they are affordable and also offer quality service. If you’re a beginner, I think the extra few dollars a month for Site Creator Plus would be worth it to pay for an all-inclusive service that will save you a lot of stress. Really, it’s up to you. Search the web to see what suits your needs. Whichever company you pick, some things to look for are:

• Professionalism
• Fees
• Uptime
• Band width (also called data transfer)
• Space
• Technical Support
• FTP
• Security

A lot of free or dirt cheap hosting options out there will litter your website with tacky advertisements and pop-ups that will turn customers off to your business. Also, you’ll want to look for a host with a 99.9% uptime guarantee so you know your site will be reliable. Each website is different, so keep how much space and band width you’ll actually need in mind. Most websites don’t use more than five megabytes of space, so don’t feel pressured to pay for unlimited space if you won’t need it. Also, the average site uses less than three gigabytes of band width per month. However, if you have a lot of pictures, streaming audio, or videos on your site, you’ll probably need more. Whatever option you decide to go with, make sure to look into the host’s policy to see what happens if you go over, just in case. You’ll want a host that will be there for you any time of day, so paying for a company with 24/7 technical support can be worth the cost. FTP access will be really important if you’re using WordPress, because it enables you to transfer new themes and plugins from third-party users to your account to expand your options. Secured Socket Layer (SSL) is also an important option to secure your information and keep your customer’s information private.

Your Domain

The domain name should be descriptive of the products or services you are selling. For example, if I were selling shoes, the perfect domain name would be www.shoes.com. However, many of most simple domain names like that are taken. You may need to be creative when searching for options. You want it to be easy-to-spell, catchy, and relatively short. A lot of times you’ll get a domain name for free with a hosting package. I have found www.1and1.com to be a really easy registrar to work with when all you’re doing is buying a domain name. Their prices and tech support are great and the process to set up a domain name is pretty much fail-proof.