Tools and Resources

favorite resources and toolsCreating websites can be a blast. But if you’re new to WordPress you can spend countless hours searching for resources like WordPress themes and researching tools to get the job done right. I’ve decided to share my favorites with you to get you started off on the right foot.

WordPress Themes

Boutique WordPress e-commerce theme

Boutique by Elegant Themes

Choosing a theme is definitely my favorite part of creating a website. I have a page with a list of dozens of WordPress theme providers and in my tutorial I offer advice on how to choose a theme. You can also check the blog section for individual themes and even sales. Look in the right hand column for a list of tags. If you click on the tag ‘themes’, you’ll get a list of blogs that talk about themes.

WordPress Plugins

Plugins extend the function of your site. I have a list of places that you can find plugins and my tutorial covers how to install plugins. You can also check my blog for plugins, including reviews and sales. If you click on the tag ‘plugins’, you’ll get a list of blogs that talk about plugins.

Traffic and Website Analysis

google website analysis toolOnce you have your WordPress site up and running, why not keep track of your incoming traffic? Google Analytics is the best way to go, and it’s free. If you already have a Google account, just sign into Google Analytics using your existing account. To track the traffic for your domain, click on ‘create a new account’ and follow the steps. If you plan on advertising your site with Google AdWords, on the screen that provides you with the html code to insert into your template, be sure to click on the box titled “I want to track AdWords Campaigns”. Google provides you with instructions for setting up your Adwords account to be tracked by Google Analytics. It’s very simple.

Google Analytics

Add New Account to Google Analytics

While signed into Google, check out the Webmaster Tools. Here you can XX.

You first need to add your website and verify that you are the owner. Click on Add a Site and enter in your website without the http://. You will then need to download a file and upload it to your hosting account. To upload the file, yYou can use either the file manager that comes with your hosting account, or a free FTP program (see below). Once verified, you will be able to see search queries, crawl errors, keywords, links to your site, and you will be able to submit a site map (highly recommended). If you followed my tutorial, you would have read that the SEO plugin Yoast SEO creates an HTML site map that you can submit to Google.

Templates for Logos, Business Cards, Brochures and More!

Thanks to a host of very talented graphic artists who are willing to sell their work at extraordinary prices, you’ll finds loads of awesome, unique templates on GraphicRiver. You will need to have Adobe programs to modify the templates to meet you needs. Adobe is the standard for high quality templates such as these, and well worth the money. And if you’re a full time student or teacher, you can get a HUGE discount on Adobe products. Check out their package deals. Adobe PhotoShop is the best program around for printing photos, so if you love to print photos that you take, PhotoShop is the only way to go!

 

Adobe

Photos and Icons

iconsWhat fun is a website without any pictures or icons? Yes, you can purchase them if you can’t find what you need for free. A word of caution before you decide to start to Google ‘free’ anything. Be sure you have an anti virus program. People just love to ruin your day by offering you something for free only to infect your computer with crap you don’t want in there.

Here are a few places to start looking:

Icons

WooThemes

YouTheme - some are free, some are not

iStock Photo –

GraphicRiver – you’ll find icons and graphic here, along with a whole lot of other very cool stuff! Check them out!

Traditionally a site where you have to pay for images. Sign up for their newsletter, they give away free images and videos on a regular basis.

Images

stock.xchng – now owned by Getty Images.

FreeFoto.com

Image * After

morgueFile

Stockvault

Freeimages

Fickr Creative Commons: you’ll find loads of images here, but be sure to read about Creative Commons licensing for these images before you use them. Flickr gives you a brief description of the licensing.

Photo Editors

One of the main tools that every webmaster needs is a photo editor. Editors are used to crop images, add text, change the dimensions, change resolution (dpi – aka dots per inch), and so forth. If you plan on editing a lot of photos, I highly recommend purchasing a photo editor. If that’s not in your budget, or if you’re only going to be editing a few photos, there are free photo editors to be found on the internet.

edit digital photos

A note about images and their file size:
Digital cameras. They’re a great invention. You can print the photos that you take, and you can upload them onto Facebook, websites and the like. But when you take a photo with a digital camera, the file size of an image can be huge! You need to take into account both the resolution (dpi – dots per inch) and the dimensions. Photos that have a large file size will increase the time that it takes for your website to load. You want your pages to load as fast as possible. This is why you need to edit your photos.

When you are using photos or graphics on a website, 72 dpi is the highest resolution that you need to save your images at. You should also keep the dimensions at or just a smidge above what you plan on displaying them at. This will keep your file size down to a minimum.

 

 

 

Adobe

Adobe PhotoShop is the photo editor that I recommend and you don’t have to wait for it to arrive in the mail or go to the store to buy it. You can download it. There are a couple of different versions to choose from. If you only plan on using your photos on the internet, PhotoShop Elements is the way to go. If you want high, print quality photos, then the absolute best program out on the market today is undoubtedly PhotoShop CSx. The X stands for the most recent version, which will change as time goes by. When I wrote this post, the most recent version was CS5. PhotoShop Elements is priced under $100. PhotoShop CS5 is is much more expensive at around $700. But wait! If you’re a student or a teacher, you can get a incredibly HUGE discount – up to 80%! If you like to print off photos that you take with your digital camera, Photoshop CS is the way to go.  If you are a student or a teacher, and you visit Adobe, visit the Education Store and read up on how to qualify for your discount. While you’re there, check out their other software. Adobe is the software that professionals use for not only photo editing, but creating and editing videos, brochures, flash and of course Adobe Acrobat files. Adobe also offers program bundles that will save you even more money.

Free Photo Editors

Photobucket

Created with Photobucket

If purchasing a photo editor simply isn’t in your budget, here are some free photo editors:

Gimp – You need to download this one. Probably the most popular free photo editor that you can download out there today.

Aviary – This resource was quite a find! It’s even more like PhotoShop than Adobe’s free online photo editor. What really stood out for me was the fact that you can create and edit images in RGB (red, green, blue) and CYMK (cyan, yellow, magenta and black). Please note: for images that you are going to use online, go with RGB.

Photobucket - Online editor. The flashing, glittery photo on this page was created using Photobucket. Over the top, yes, I know. I just wanted to give you an example of what you can do with Photobucket. I did not upload this photo to WordPress, either. Photobucket provides html embed code. I just copied the code and pasted it into WordPress using the HTML editor, not the Visual editor. You’ll learn about how to embed photos and videos this way in my tutorial.

Pixlr – Online editor

Photoshop.com – Even Adobe has a free online version. Personally, I wasn’t impressed at all. I’m a huge fan of PhotoShop and even treated myself to PhotoShop CS5. Guess what? Their online editor is absolutely nothing like PhotoShop CS or PhotoShop Elements. Go figure!

Screen Capture

capture screenEver wonder how people capture what’s on internet browser and turn it into an image that they can use on their website? You can use the keyboard shortcut (for Windows it’s ALT Prt Sc). But this will only capture what you can actually see on your screen. If you want to capture the entire page, you’ll need a screen capturing program. For years I used to used the Firefox plugin called FireShot. Then one day it updated and wanted me to pay money to use it. Forget that! Try this instead:

http://www.aviary.com/launch/talon

It captures the screen and then opens a new window in your browser with the image right inside their very cool online image editor! Sometimes it has trouble capturing the screen with their online version. Try installing their browser plugins. They have one for Firefox and for Google Chrome.

Free FTP Program

ftpFTP stands for File Transfer Protocol. An FTP program is used for uploading files to your website. Although WordPress makes it easy to upload pictures as you create your pages and posts, and even install themes and plugins without needing a FTP program, you’ll need one to backup your files onto your computer. Your hosting provider will most likely have a file manager, but you cannot upload or download and entire folder and it’s content using their file manager. I recommend using Filezilla. They have a version for both Windows and Mac.

Zip and Unzip Files

Windows: 7-Zip – free

Mac: ? – I don’t have a Mac. If you know of a good one, please post a comment.

Creating a Search Engine Friendly Website

SEO = Search Engine Optimization

seo postsKnowing how to write pages and posts that search engines will index properly is important if you want to rank as high as possible. Luckily there are free tools out there.

As usual, Google offers plenty of free resources to webmasters that will help you learn about SEO. Google’s Keyword Toolbox will help you research and choose keywords to use in your pages and posts that are used most often (choose the Google Keyword Tool), teach you all about SEO (this is a PDF file – first page is (or was) blank – scroll down to the second page) and even allow you to submit your website to Google rather than sit and wait for the Google Bot to crawl your website.

WordPress SEO Plugin and XML Sitemap

While you’re writing your Pages and Posts, you can use a WordPress Plugin to optimize it for search engines. One of the most popular plugins is All in One SEO Pack, which has a free version. Unfortunately, it’s not always compatible with the most recent version of WordPress. Because of this, I’ve been playing around with Yoast, another free plugin for SEO. So far, I’ve liked it even better than All in One SEO Pack. Yoast gives you an analysis tool that checks for keywords in your title, description, etc. It has a Page Analysis tool, creates an XML sitemap (which search engines love) and a whole lot more. You can submit this XML sitemap to Google.

Newsletters

WordPress newsletter pluginAllowing your visitors to sign up for newsletters is a great way to keep them coming back for more. MailChimp is free for up to 2,000 subscribers and 12,000 newsletters a month. Not only that, but there’s a WordPress Plugin called WordChimp for MailChimp that makes creating your newsletters so quick and easy it would be silly not to at least give these two a try.

Constant Contact is another extremely popular newsletter service. You can also conduct surveys!

Emails for Small Business with Constant Contact

What Color is That?

colorsIf you run across a color, or color scheme, somewhere online and you’d like to know what the HEX or RGB values are, you can download a free plugin for Firefox. It appears as a little eye dropper in the bottom corner of your browser and when you click on it, your cursor will turn to a + sign. You then hover over the color that you want, click on it, and go back down to the eyedropper and use the little menu next to it. You can then get the value for that color.

Getting into the Code

inspect codeIf you need to inspect code, change html and css, debug, etc., and you can use the web browser Mozilla Firefox, then your best friend will most definitely be Firefox’s plugin – Firebug. You can inspect any website (not just your own) and even make ‘changes’, like change the color of a background color, font size, etc.. The changes aren’t permanent, they just let you see what things will look like before you actually go ahead and edit your file(s). Firebug will also tell you the location of the css file that you’d need to edit to make the changes. This is just a tip of the ice burg. Visit their website for a full list of features. Truly a lifesaver.