There's so many different ways to make social media icons and so many different and fun ways for them to look. I've found that my personal favorite style for my social media icons is just to have them in a nice rectangular shape, with a fun/soft color palette, and a nice font. Doing them that way takes a little more work, though, so today we're just going to be sticking with whats popular right now, the little circular icons!
The first step in creating our clickable social media icons is to pick the images for them. Icons DB is the best place I've found to get social media icons. They have all sorts of adorable little sets like weathered wood, sandstone, vintage paper, etc. If you just want to do a nice solid color you can do that too! There's a nice little option on the top left for you to enter in the hex color code of the color you're wanting and Icons DB will generate your icons in that exact color. Don't know the hex color code of the color you want? Easy solution! Head over to Encycolorpedia, and you can get the hex color code for virtually any color! All you need to do is select the tab bar at the center of their homepage and a color bar will show up for you to select the color that you want. Once you're in the general area of the color you're looking for a new page will open up for you with the color's hex code and further details about the color and similar colors.
All right, now that we've got our image of our icons uploaded to photobucket, we need to make them clickable. To do that we're going to be using Image Maps. To begin, open up your icon's image file from your computer and select "start mapping". Now, the VERY first thing you'll want to do is change the image source. The reason you'll want to do this is because Image Maps doesn't host images so if you don't change this your image will be taken down within 24 hours and if you install it on your blog the only thing that will show up will be the Image Maps logo. Alright, to change the image source just right click anywhere on your Image Maps screen and a dialogue box will open up, you'll want to choose the "options" tab. That will open up another dialogue box for you that has three different fields listed below the "Image Map" tab. The fields should be, Image Source, Base URL, and Image Map Name. We're going to be changing the image source and base URL. For the Image Source you'll want to enter in the direct link for your photo from photobucket (this is found on photobucket next your image under "Links to Share Your Photo"). Next, change the Base URL to http://photobucket.com Hit save and Image Maps will tell you that to you need to create an account with them to save a map. Just ignore it, the message will disappear and your changes will be saved.
Now you'll want to right click over your first icon. Click on "create rect" and then click and drag your arrow to create a square over your icon. Next, in the dialogue box that opened up you're going to want to enter in the link you want your icon to go to under "Map URL". For instance, if I were doing my instagram icon, under the Map URL I would enter in the link to my insta account, instagram.com/lifeofacoyfish. Repeat this step for each of your icons to make them clickable.