Essential Keystrokes is…

where I share my favorite tips, tools, reviews and commentary on web design, marketing, blogging, new media and related topics. For more about this site and the voice behind it, check out my About page.

Connect

SubscribeFollow me on TwitterLinked In Stumble Upon What I Digg Email me

Archive for Tutorials

Note: This is one in a series of tutorials on customizing your WordPress theme geared to the beginning or intermediate WordPress user.

One of the easiest ways to customize a basic WordPress Theme is by changing the background. Using this step-by-step guide, even novice bloggers can make small changes that will have a big impact!

When you first install WordPress the default template is loaded and it looks something like this:

WordPress background tutorial

In order to make changes to it, you need to first log in to your WordPress dashboard, choose Presentation and then Theme Editor. On the right hand side you will see a list of files you can edit. Select style.css.

WordPress background tutorial

Scroll down to the part of the code labeled body. In that code block you will see a line that says background. This is the part of the code that tells the template what color and/or background image to display. If you just want to change the background color and do not want an image in the background, you can easily change it.WordPress background tutorial

I deleted the piece of code starting with “url” and replaced the color code with one for a deep red – #990000 (see a complete list of color names and codes). Once you make your change, select Update File and go take a look at your results.

WordPress background tutorial

Let’s say you want to get a bit fancier and would prefer to use one of the many beautiful free backgrounds available on the web (check my list of 13 sites for Beautiful Patterns and Backgrounds first). In which case, you need to find the background you want to use and download it. Use an FTP program (Need help? See my FTP tutorial for details) to transfer the .gif or .jpg file into the theme’s image directory.

WordPress background tutorial

Once the file is there, go back into your WordPress dashboard, select Presentation, then Theme Editor and open up the style.css file again. Take a look at the background line of code again and change kubrickbgcolor.jpg to the name of the background image you want to use – in my case, distressed-in-blue.gif (from Din Pattern).

WordPress Background tutorial

Select Update File and take a look at your handy work.

WordPress Background tutorial

Each theme you use is going to coded a bit differently, but the majority of them should operate very similarly to this – especially the ones that are well-coded. Once you get comfortable working with the style sheet and its components, it is relatively easy to make basic customization changes.

If you are up for it and would like to learn more about the code for WordPress theme, there’s a good tutorial on creating your own WordPress theme.

I plan on adding more tutorials to this series in the near future with one on adding a graphical header, customizing your fonts and colors, as well as other basic WordPress techniques. If there is any particular topic you would like me to deal with sooner rather than later, let me know!

Categories : Tutorials, WordPress
Comments (26)

Yesterday I got an email from a friend asking how to make an affiliate link look “clean”. If this very experienced blogger was asking the question, then chances are, there are many of my readers that would like to know too.

WHY WOULD I WANT TO SET UP A REDIRECT?

When you sign up with an affiliate program, the program has to give you a unique line of code that can be tracked so that you can get proper credit for the leads or sales that you generate from your site to theirs. In most cases, this means the link you are assigned will be long and drawn out, a combination of letters, numbers and symbols, and it will be long. For many users, if they mouse over such a monstrosity, they will not even click through for fear of the unknown.

Another reason you may want to use redirects with affiliate links has to do with managing them. Let’s say you sign up as an affiliate to program XYZ and you link to your affiliate link in dozens of blog posts. Then, one day the affiliate manager changes your affiliate link. You now have to go back through all of those links and change them. However, if you had set up a redirect, you could change it in one place and all the links would be routed correctly.

HOW DO  I SET UP A REDIRECT?

Setting up a redirect is a fairly simple process.  Basically you have to create a new php file that will contain the affiliate link and some additional code, save it with a unique name, and use the new file name when referring to that affiliate link.

1. Open Notepad or your favorite code editor

2. Type in the following code as you see it below, replacing the red text with your affiliate link.

How to set up a redirect

3. Save the file as keywordxyz.php (you come up with a file name that makes sense)

4. Upload the new php file to your web server (Need help with FTP? Check out my FTP Tutorial)

5. When linking to your affiliate link, you can now use:

setting up a redirect

I find that using redirects helps me stay more organized and I don’t have to go hunting for my affiliate links everytime I want to use them.

As it is with everything in the web development world, there is usually more than one right way to do everything. There are other ways to set up redirects, but I have found this method to be the easiest to set up and keep track of.

Related articles:

Categories : Tutorials
Comments (25)
Aug
29

Tutorial: FTP – it’s easy as 1-2-3

Posted by: Char | Comments (12)

One of the most daunting tasks for beginning bloggers and web site owners is figuring out how to get files from their personal computers on to the web. Most blogging platforms and content management systems offer some level of upload capability, but there are times when you need to do something a little more advanced (like uploading a new theme or plugin), and that usually means using FTP.

What is FTP?

Well, it stands for File Transfer Protocol, but all you need to know is that it is a way to connect your PC to your web host so you can transfer files from one place to the other.

It’s as easy as 1-2-3…

1. Get an FTP program

Most of the FTP programs work basically the same so once you get the hang of one of them you should be able to handle any of them. If you use Firefox, you can download FireFTP for free. It is an extremely easy FTP program to use.

Other good FTP programs include:

2. Set up your connection

For the purposes of this tutorial, I am going to use FireFTP instructions and screen captures. Your FTP program may not have exactly the same screens, but they all ask for the same information.

Launch FireFTP and then choose Manage Accounts. Select New. You will now see a screen that looks like this:

FTP setup screen

    1. Give your site a name that makes sense (most likely your site’s name).
    2. Fill in your host address - this is usually your IP address, but depending on your web host, it may be your full domain name or it could be ftp:yourdomain.com. When you set up your hosting account, this information should have been provided to you.
    3. Fill in your user name and password and then choose OK. (Don’t worry about those other two tabs right now)
    4. Next click the Connect button to establish a connection between your computer and the web server.

      3. Drag and drop

      One side of the screen will show the files on your computer and the other side will show the files on the server.

      The basics of an FTP screen

      1. Navigate to the folder/file you want to upload FROM on your computer. Look at the other side of the screen and navigate to the folder you want to upload TO on the server. (See step one in the graphic)
      2. On the “local” side (also known as your computer), highlight the file(s) you wish to upload.
      3. The buttons in the center represent the direction of the file transfer -  you want to click on the  arrow pointing towards your server  (upload).
      4. The file will arrive on your server and be listed in the folder you selected.

      Most programs, like FireFTP, allow you to do this process via Drag and Drop, too. In other words, you can select the file on your local computer and drag it to the folder on the server that you want it to go to.

      As for downloading – the whole process also works in reverse. You can select a file on your server and transfer it to your local computer side by following the same instructions as above, just start on the server side of the screen.

      Obviously, these are just the very basics of FTP, but with a little practice, even the novice can become proficient at moving files from one place to another.

      Related Posts:

      Comments (12)

      RECENT PROJECTS

      Team Training NE Celiac Family