If you have never worked with HTML code before, do not let this deter you! If I can do it, then so can you. Hopefully, this exercise will help you avoid the errors I made, and your website will find itself proudly displaying your choice of “social buttons.” You will become intimate with “widgets” in the process. (No, we’re not talking about those nasty little insects you find crawling beneath flowerpots.)

It’s All About Social Connections

By adding social icons to your site, you will create links that allow your readers to find your social profiles and easily share your content with their followers and friends on social networks. Make it easy for your readers to connect with you!

Step 1.  Choose the Icons You Like and Download Them

First, the fun part – you get to pick which social icons you want for your site. Here are some creative options to select from:

http://smileyhelper.com/inspiration/30-most-creative-social-network-icons

http://blog.psprint.com/designing/5-free-icon-sets/

When downloading and saving them to your computer, be sure to check and provide a link back if required, just like with using free photos and providing proper attribution.

Step 2.  Upload the Icons to Your Website or Blog

After logging in to your WordPress site, go to “Media” and “Add New” in the left column. Next click the “Select Files” button under the “Upload New Media.”

You will see a window open with the social icons you just downloaded. Select the ones you want (hold the control key down and click on each one if choosing more than one), then click “Open” to upload them. A confirmation that they’ve uploaded will appear.

Step 3.  Get the URL for Each Icon Image

Now you need to get the URL for each of these images. Click the “Show” link to the right of each image. Find the URL and copy the entire field. For easy retrieval, you’ll need to copy and paste them onto wordpad or notepad. I used Apple’s “stickies.” Repeat for each image.

I used the vintage icons for my own blog, so here’s what my twitter icon URL looks like: http://angelsr4u.com/wp-content/uploads/2012/05/twitter.png.

Step 4.  Make a New Text Widget to Hold Your Social Icons

Click on “Appearance” in the left menu in WordPress and then click “Widgets.” Next, find the “Text” widget and drag it over to the right side bar where you want your social icons to show up on your site. For example, on my personal blog my “Text” widget is above my “Recent Comments” but below my “Recent Posts.” You can drag and move any of these around whenever you want to change their order.

Click on the little arrow to enlarge the “Text” box. Here is where you’ll add your HTML code from your profile links (Facebook, Twitter, Pinterest, etc.), as well as the social icon images you chose. Give your widget a title; I wrote “Connect With Me.” This will show up on your site as a heading over your social buttons.

Now add your code into the “Text” box (copy and paste this):

<a href=”LINK”><img src=”IMAGE URL” border=”0″?></a>

IMPORTANT NOTE: Sometimes when you copy and paste the code, the quotations marks will change from straight quotes into curly (fancy) quotes. There are a total of six quotation marks, so if one changes, they all will. Check and see and make the correction so the code works!

Step 5.  Copy and Paste Your LINK and IMAGE URL

Where the word LINK is, you will paste the link to your profile, like this:

<a href=”http://twitter.com/KaCeeAngels”><img src=”IMAGE URL” border=”0″?></a>

Where the words IMAGE URL are, you will paste the URL to your social icon that you just uploaded, like this:

<a href=”http://twitter.com/KaCeeAngels”><img src=”http://angelsr4u.com/wp-content/uploads/2012/05/twitter.png” border=”0″?></a>

Repeat this for each social icon you want on your site. Your code will run together; just be sure the </a> is at the end of every individual icon image code, just like the example above. It says to end the link after that image.

Now Your Site Has Some Social Charisma

Click the save button and look on your site to see your sidebar widget with your new social icon buttons.

*If for some reason they are not there, here’s a list of things I found to check:

• There are three sets of quotation marks. One set goes around the “LINK,” one around the “URL IMAGE,” and one around the “0” (zero) near the end. Be sure they are all present and uncurled.
• Don’t keep the words “LINK” or “URL IMAGE.” They are to be replaced with the appropriate links which you copied and pasted.
• Each social icon code begins with <a href=. Each ends with border=”0″?></a>.
• Go to your social networking website to copy and paste the correct code for the “LINK.”
• Your Facebook URL “LINK” will look like this: http://facebook.com/YourName. (Insert your name)
• There is a space before the word border in the code.
• There are no spaces after the end of each image icon code and the start of the next.
• The only other space in the code is at the beginning, between the <a and the href.

*Yes, I admit, I had to correct all of these. My son would happily inform you that I am a true computer noob.

Note: The easiest option is to install a plugin like Cute Profiles or Follow Me.  You can install this from the “Plugins” then “Add New” link in WordPress. However, you won’t be able to choose from the plethora of nifty icons available online.

 

Photo credit: Mr. Think Tank, Flickr Creative Commons

 

 

 

If you are a devout Photoshop fan, then stop reading here. For those of you who are interested in obtaining free photo editing “alternatives,” – I use this term loosely as the general claim maintains no on-par substitute exists – then, by all means, read on and get your photo-mojo editing groove on.

Download for Free

1. Gimp

Stands for “GNU image manipulation program” and heralds as the most-like-Photoshop program, with similar features that range from simple photo enhancement and digital retouching to complex image manipulation procedures, augmented by plugins and extensions. The tutorial page offers many levels and variations of instruction. Download required.

2. Paint.net

A replacement for MSPaint, this requires Windows to run. Browse through the vast tutorial section under forum and discover how to create fire, make a before and after image, or cut out part of an image. Be sure to click on the download button on the top, otherwise you will be misled into downloading Gimp.

3. Picasa

A basic program that also serves as a free photo management system. Most digital camera users will find the selection of tools easy to use for cropping, color correction, and editing effects. The collage tool is one of its best attributes. For Google+ fans, there’s also instant sharing and tagging.

4. Fatpaint

In addition to photo editing, this software is known for graphic design, vector drawing, and logo/text making. In less than five minutes you can create an image for display on a t-shirt or other product.

For Home or On-the-Go

5. Aviary

A quick web demo will win you over with ease of use. As Flickr’s new photo editor,  its Facebook app boasts instant usability, and it’s embeddable into your website or mobile app. Smartphone users, don’t miss this! Ten stylistic effects, such as aqua and indiglo, enhance your photos into beautiful art. Check out their advanced image editor Phoenix if you want to expand your horizons. For the musically inclined, there’s even an online audio editor and music creator.

6. BeFunky

Facebook friendly and fun, this online editing application will help you to create cards with your photos, inspire you with a BeFunky community of ideas, and you can use it while on the go with either your Android or Apple devices.

7. Splashup

Like the now-defunct Picnik, this web-based application integrates easily with photo sharing sites, has an image editing layers tool, and is perfect for editing your photos when online and in a hurry.

8. Pixlr

Another user-friendly online photo editor with the addition of a fun vintage retro look using Pixlr-o-matic. This is definitely worth playing around with!

9. PicMonkey

Some former Picnik engineers got together with a few other folks, including the ostensible monkey, and PicMonkey was born. Super simple yet filled with plenty of useful and entertaining editing tools, so be sure to share this program with any young people in your life.

10. FotoFlexer

Yet another online photo editor with a host of interesting tools. View a demo and learn how to cut someone out of a background with smart scissors, play with animation, or turn a normal face into an alien in space.

Your Photo-Editing Debut

Long gone are the days when you have to spend a sizable sum to go from drab to fab with your digital photos. Unless you’re a professional, these free photo editing programs will keep you satisfied for countless hours. Start uploading your photos, begin experimenting, and post and share your creations!

 

 

 

What Does “Free” Mean, Anyway?

First, let’s distinguish between “free” and “royalty-free.” A free image is free to download and use, with only a credit and perhaps a link back to the owner. This is what we are looking for here. A royalty-free image is an image that you pay for once and then use however you like without spending an extra dime. Copyrighted images normally require a royalty every single time it is displayed.

Pay close attention to the licensing. Each site will have its own requirements, and in many cases, each photographer will have individual image credit requests. Giving credit shows respect to their work, proves you to be an ethical publisher, and offers visibility and exposure to the image’s producer.

Checking carefully what you can and cannot do – and this is not always straightforward – will tell you whether you can use the image commercially, make edits, or redistribute the image. Never assume an image is up for grabs!

Here’s ten of the best sites for free stock photos and images, and depending on what you are looking for, there are oh so many more.

10 First-Rate, Free-Photo Sites

1. Stock.XCHNG

With close to 400,000 photos, they offer a pull-down category search option that includes love, peace, and urban decay, among many others.

2. Free digital photos

Their most popular images are business and people pictures, and there’s no registration required.

3. dotgovwatch.com

The best photos taken by U.S. government employees as part of their official duty. These include photos from NASA, disaster and recovery photos, and public health images, among others.

4. Freerange stock

Their collection meets strict criteria of quality and claim to be either artistically or photographically interesting. Requires a quick free registration and log-in.

5. 123RF

The only difficulty, once registered, is where to find the free photos. Click on download, then free stock photos, and, voila! Over 37,000 free images are at your disposal. (This handy link will bring you directly to the free images.)

This List Gets Better and Better…

6. Flickr/Creative Commons

Because Flickr also serves as an online photo album, it can be a rather personal walk through someone’s life. The Creative Commons are photos shared by its users in varying degrees of attribution. There is a wide variety of photos, and it will rarely disappoint.

7. RGB Stock

A simple registration will open the door to nearly 70,000 photos and images. There is a general and category search option, as well as interesting backgrounds and graphics under the random search tab.

8. Morguefile

In addition to the vast collection of photos, they offer links to lessons in photography under the classroom tab. There are also ongoing photo contests with cash rewards for the winners. They’ve kindly supplied a human-friendly version of their full photo-use license. This site is worth a visit.

9. Photl.com

With 7,000 to 10,000 new photos a month, there’s a lot to choose from, but not necessarily a wide variety. The download limit is 10 Mb daily, which won’t be an issue for the average individual.

10. Freeimages.co.uk

Check out the 83 image categories to find the photo you want, but don’t attempt to search more specifically, it won’t prove as fruitful. There are over 6,000 stock photos with unique subjects. You will enjoy the search if you’re flexible in your choices.

Final note: Each site was diligently tested with a search for “cats.”  This provided an interesting method of comparison. RGB Stock photo won for downright cuteness.

RGB Stock photo credit.

Why use images on your website? Does it help your readers or distract them? Here’s five solid reasons to include pictures. Information on where to find those invaluable free images and photos will follow next week.

1. Make your website memorable.

Do you recall infographics and its rightful claim to fame, namely, keeping the reader reading with interesting graphics? Pictures and images do the same thing, adding an element of visual appeal that mere text alone cannot do. Besides this, we remember pictures easier than we do words. Research on visual mnemonics shows us that we are capable of tremendous memory storage using images.

“Every picture tells a story, don’t it?”

2. Give your website personality.

Using pictures will help evoke an emotional response from readers. It allows people to remember you and want to build a relationship with you. Content alone is a strong tool in relationship building, but adding images, particularly personal ones, will make for happier browsers. Where possible use photos of your staff, your facility, your product, and your customers.

3. Boost your Search Engine Results

Using pictures will improve your search results in Google image searches. Not only should you pay attention to using the right keywords, be sure to use relevant images to increase your search rankings.

Is Your Website “Sticky”?

4. Keep your readers longer.

The first thing your reader will see is the image. A photo of a pygmy giraffe, for example, will make them curious and compel them to remain on your site longer. The last thing they see, if your content continues to appeal, will be the bottom of the page.  Give your readers what they want so they’ll stick around longer.

Remember, always be sure to check the permissions for terms of use for every image. There may be exceptions or limitations.

Photo credit: http://www.flickr.com/photos/familymwr/5548053540/