Featured Article

New Version

New Version

The new version of Templates For All is complete! I have been working on using a new backend for the site. Killing bugs. Even getting some tutorials for the site.
I’m even exploring video tutorials. Those could be interesting to add to the site.

Continue Reading...

Resources: Six sources for free Stock Photography

One question asked by people new to making websites always is, ‘Where can I find pictures to use on my website?’ Many people point people to stock photo sites that cost money either per picture or per membership. Often lots of them require a royalty fee as well.

There is some good news! There are several that actually offer free pictures you can use. There are even some that offer pictures that are royalty free.

Always check the terms of use and the licenses for the picture you choose to use. Sometimes you may be required to link back to the site in exchange for using the picture.

  • Every Stock Photo
    This one isn’t my favorite site on the list, but I put it first because it is a stock photo search engine. They claim over 4 million pictures in their database. When searching you can specify license type.
  • Stock.XCHNG
    My personal favorite of the bunch. I’ve used it for years. They have an excellent search and a large selection of pictures. If you are a photographer, you can even upload your own pictures for other people to use. They claim 350,000 images by 30,000 photographers.
  • MorgueFile
    Despite the name, this site is a very good source of pictures. A morguefile is a term used my illustrators and newspapers to refer to their picture stockpiles. They have many categories of pictures. As with most of the sites on this list, photographers can upload their own pictures.
  • DesignPacks
    This site has multiple picture packs consisting of 15 pictures on a particular subject such as flowers, cars, or tools. Some of the pictures are pretty abstract, but they would have a use for headers or the like.
  • StockVault
    This site has quite a few Photoshop tutorials in addition to thousands of pictures. Registration isn’t required for this site, but it does give you additional features. You don’t need to register to download pictures.
  • ImageBase
    The pictures here are licensed by a Creative Commons License. The pictures come in very high resolutions. Many different pictures across many categories.

Tutorials: Turning a template into a site

“How can I edit a website template?” That’s one of the most common questions I receive by email. There are several ways to edit templates, but I have my own methods. This tutorial will show you the most logical way to edit a template.

This tutorial assumes that you know how to uncompress a .zip file. We wont cover that in this tutorial.

You also need an HTML editor for this tutorial. There are two types of editors. WYSIWYG editors, which you would edit HTML in a word processor like environment, are very popular. Another style is the text editor style, where you edit HTML like you would a text document.

I’m going to use KompoZer for this tutorial because it is probably the easiest way for a beginner to edit a template. KompoZer is a 100% free and open source WYSIWYG editor. These steps will work with any editor.

Before you start, think about the pages you want to access from any page. I’m going to use Home, Products, Services, About, and Contact.

The steps we are going to take:

  1. Create the navigation links
  2. Use the template file to create the rest of the pages
  3. Edit the content
  4. Test the navigation to make sure it works

Step I: The template I chose already had those pages listed in the navigation. Go ahead and list the pages you want accessible from every page. Now we’ll make a link to the pages using a one-word name followed by .html. For example, About Us would become about.html and Contact Us would become contact.html. Right click the page name and go to link properties. For the Home link I’ll put index.html because that’s the default file a webserver loads when you go to a website. For the rest of the pages just enter your desired name for the page followed by .html. It’s important to make sure the link is lowercase. Save the file and proceed to the next step.

Step II:The next step is pretty easy. We’re now going to make a copy of the template file to make the other pages of the site. The easiest way to do that is right-click the index.html file and select copy. Then right-click a blank space in the folder and select paste. That will create a copy of index.html named Copy of index.html. Just rename that file to the second page of the site. We already have index.html which is the homepage. Now repeat that step for the rest of the pages.

Step III: The next step is also very easy. Go ahead and enter all the content across all the pages. There are lots of places to get pictures for you to use on your site. Sites like Stock.XCHNG and morguefile have very good free photos you can use on our site without paying royalty fees.

Step IV: We’re at the last step. Now we want to test the navigation and make sure it all works. Just open index.html up in your favorite browser and click all the links in the navigation.

We’re done! Congratulations, you now have your very own website. Now all you need to do is upload it to your webserver so people can access it.

News: New Version

The new version of Templates For All is complete! I have been working on using a new backend for the site. Killing bugs. Even getting some tutorials for the site.

I’m even exploring video tutorials. Those could be interesting to add to the site.