Well, itnow appears that Google Friends Connect is still working – not going away. Thatis good.
I had, inmy opinion, cluttered my sidebar with every means I found to allow you to stayconnected. Some efforts were redundant I discovered. I am constantly learning.
I will keepLinky Follow – I am quite impressed with it – I have made so many new friends! Itruly appreciate the efforts put behind to create this widget to keep usconnected.
I did, however, want to create my own set of Social Media Icons. As with each change I have made to my blog, I spent hours attempting to figure this out.
I hopeto make this very easy for you if you wish to do so yourself. You can contractwith a provider to create a wonderful, unique look for your blog, or you can dothis yourself – for free.
(Please read through this post before beginning-
then take this one step at a time)
 |
| source - Webzii |
StepOne
The funpart
Finding SocialMedia Icons that appeal to you. I was looking for icons that to me were girly –I want my blog to be as pretty and user friendly as possible. I found mine at
You canfind more Icons here:
Sweet Simplicity ($4)
You canfind more Icons here by Googling:
Free Social Media Icons, girly Social Media Icons or Shabby Chic Social Media Icons. You will discover a plethora of free icons available.
Once you have chosen your icons
download them to your computer
 |
| when you upload your picture to Tiny Pic you will be directed to this screen |
StepTwo
Uploadyour selected icons to a image hosting site – such as Photobucket, imageshacketc…
since I am trying to make this as easy as possible, I
recommend Tiny Pic Once you upload your picture - copy the link labeled 'direct link for layouts'. The one that looks like this: http://i43.tinypic.com/140gtg0.png in the picture above. Label and save this link to a word document -
(some icons will come in a set -
you will need to copy each image to
your computer in a png file)
Once you upload your picture - copy the link labeled 'direct link for layouts'. Label and save this link to a word document - in the end, you will need two links for each social media icon-
The first to the image and the second to the site.
 |
| this is what the screen for the Feedburner-RSS feed should look like- with the exception of it being for your site. StepThree Find thelink to your social media site. Go toyour sidebar. Click onthe social media button you wish to replace- Facebook,Feedburner(RSS), Twitter, Feedburner-email, Google+, Pinterest, etc… You willbe directed to a sign up screen for your followers. Copy the URL specific tothis page. Pastethis link to the word document beneath the image link for that particularsocial media. For example. Facebookimage link Facebook websitelink Do thisfor each social media site. Test the links you copied from the word document –just click on it – if you copied correctly, the screen should pop up. You’renearly done! Two steps Ihighly recommend when you change anything: 1. copy andsave the original 2. test thelink you are referring to. |
 |
| You can find these cute icons here |
StepFour
 |
You willneed to copy this code to your word document and you will need to repeat this step for each social media icon.
1. copythe code
2. copy and paste the site link to the space between the words in blue between the “ “ marks.Make sure you keep the “ “ marks surrounding your link.
3. copyand paste the link to the image the same way replacing the words in red –keeping the “ “ marks.
4. Remember,dothis for each social media site. For each social media site – paste the codedirectly behind the code you just completed. You can arrange your social mediaicon buttons how you wish.
Special note: the code above is set for each image to be 40 pixels. My sidebar is between 250 and 300 pixels. You can adjust the size of your buttons to 22,33,50,75 etc depending on how big you want your social media icons to appear.
Test one code by applying it to a HTML widget to see the size that works for you.
 |
| I added the text widget below the social media icon gadget to identify the above buttons |
StepFive
Applythe code to your blog.
Go toyour blog’s layout page. Click add a Gadget on your sidebar. Select the HTMLgadget.
Copy thecompleted code from your word document. Paste to the HTML gadget. Label the gadget how you wish. I labeled mine Stay Connected with A Delightsome Life.
Save the gadget.
Placethe gadget where you wish on your sidebar.
Previewand test each Social Media button.
Ifthe correct screen pops up – you’re set!
Laststep. Removing the former gadgets – remove each widget/gadget you’ve justreplaced. I saved each code to a separate document and placed each in a folderlabeled “Blog Social Media HTML codes”. Just in case I needed to refer back tothese particular widgets.
Clear as mud!? Is yourheart in your throat!? Don’t worry. If you saved everything beforehand, anychange you made and are not satisfied with – you can revert back!
This will take yousome time – enjoy a lovely cup of tea or coffee. If you save each link to aword document, this is something that you can begin and return to, as you areable.
Once you’ve made yournew Social Media Icon buttons, let your readers know! Show them off!
Thank you so much forvisiting!
Wishing you a mostDelightsome day!
0 comments:
Post a Comment