Welcome back!
I’m so glad you decided to learn how to make your own social media icons! It’s so simple, and it can be a LOT of fun! Also addictive, so this is your warning. 🙂
As promised, in the videos below, you’ll learn how to create custom social media icons. The videos are simple and just give the basics. Your imagination will allow you to take it to the next level and create simply stunning social media icons for yourself or your customers.
Video #1 includes the basic directions for making single social media icons. Video #2 adds on how you can create one image with all the social media icons on it, and then link the icons to the proper social media sites.
Below Video #1 is the link to the website where you can grab the social media icon silhouettes and instructions on what to do when you get there.
Video #1
Go here to grab the social media icon silhouettes.
Follow these steps once you get there:
- Click on one of the social media icons that you want.
- Scroll down, and under the Download PNG: heading, click 128X128. That’s going to save an image that is 128px by 128 px, which should be big enough for any social media icon you’ll be creating, in a .png format. That format allows the transparent background to be saved so there’s not white behind the icon.
- Save it to a place on your computer where you can easily find the file again.
- Go back and rinse and repeat until you have all the icons you want.
- Start creating social media icons like a fool!
- If you find that you don’t have a specific social media icon that you want and it’s not in the resource linked above, just do a Google search for it, but call it a silhouette. (E.g. email icon silhouette free)
- Save any additional icons that you download into the same folder as the silhouettes previously downloaded.
Here is the link to Picmonkey so you can start creating.
Remember that you don’t have to have a paid account to create these. You will have more options if you pay for an account, but you definitely don’t have to! Also keep in mind that you can start with images that are outside of Picmonkey by starting with your own overlay to begin with. Just open it in Picmonkey and put social media silhouettes over it! Easy as pie!
If you DO decide to pay for an account (it’s $4.99 a month or $33 a year – a FANTASTIC deal for a year of awesome photo editing and image creating capabilities), I’d love for you to purchase through my affiliate link here! It doesn’t cost you a penny extra, but throws a few pennies my way if you do. Totes up to you, though. 🙂
Keep in mind that you’re not limited to the shapes that are in Picmonkey. You can get an image from anywhere (as long as you do your homework and know you’re not breaking any copyright rules) and then open it in Picmonkey to use that. You could put social media icons on top of pictures of you. Or other images you create with another program. The sky is seriously the limit here!
Want to see how to link social media icons from one image? Here we go!
So, you decided to create one image for all of your social media icons and link them separately? Well, that, my friend, is also free!
Take a look at the video below to see how it’s done. There are detailed instructions below the video to help you out once you’ve got the image “mapped,” too!
Video #2
Here is the link to the image mapper.
Remember, you DON’T have to create an account to use this free tool. But there are a few steps that you’ll have to take once you’ve got the code you need. See those steps below.
- Upload the same image you’ll be using in image-maps.com to your website.
- Go to image-maps.com (using the link above).
- Browse for and upload the file of the social media icons that you want to map.
- Right click to create linking areas around each social media icon and link appropriately.
- When you have mapped all social media icons, right click again and select “Get Code.”
- Once you have copied the code from the image map that you’ve created, paste it into the editor on your website, whether that’s a widget, a custom code area, or whatever.
- **Important: Change the image source within the code to the image that you uploaded to your own website. (Change the url listed between the quotation marks right after src= to the url of the image hosted on your website.)
- Go through the image map code and change the target of each social media link to “_blank” so each social media site will open in a new tab or window instead of in place of your website.
- Save and test. And you’re done!!
- Drop me a line and show me what kind of awesomeness you’ve created!