It might be worth noting that I have this problem almost solved. With the help of
Cathal Connolly of the core team he has pointed out that I should've copied the SocialMedia.png image over to the relevant skin folder and then made the following modifications to the skin CSS file.
/* Content */this is
.Social-Links
{text-align:right;padding:15px 0 0 0;}
.Social-Links .fb-like{top: -8px;}
.Social-Links a{margin:0 0 0 10px;}
.icoIN{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -192px 0;}
.icoFacebook{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat 0 0;}
.icoTwitter{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -32px 0;}
.icoTwitter2{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -576px 0;}
.icoMySpace{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -64px 0;}
.icoStumbleUpon{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -96px 0;}
.icoDigg{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -128px 0;}
.icoFlickr{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -160px 0;}
.icoLinkedIn{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -192px 0;}
.icoYouTube{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -224px 0;}
.icoDelicious{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -256px 0;}
.icoBlogger{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -288px 0;}
.icoRSS{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -320px 0;}
.icoEmail{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -352px 0;}
.icoTumblr{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -384px 0;}
.icoFourSquare{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -416px 0;}
.icoReddit{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -448px 0;}
.icoVimeo{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -480px 0;}
.icoWordPress{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -512px 0;}
.icoBebo{width:32px;height:32px;background:url(images/SocialMedia.png) no-repeat -544px 0;}
after making these modifications the community links show up on any page that I now apply my skin to. I am left with one small problem is and that is each image shows up with a small cross in the middle. Each image however when clicked upon works by taking me to the relevant site.
So at this stage the problem is 90% solved.
Thank you to you Cathal for your help!
Regards
Trevor