Post by SubDevo on Mar 24, 2010 11:27:10 GMT -8
Any Social Networks in Mini-Profile by SubDevo
Tested in IE, FF, Opera, Safari and Chrome.
Finally! A code that puts as many of and whatever social networks you want into your mini-profile!
This small, fast code replaces all of the many "Add Twitter/Facebook/MySpace etc... to your mini-profile" codes out there...
You can even add your Xbox Gamertag, YouTube and DeviantART profile pages!
Just added: Skype (with online/offline status)!
Read the Bottom of this post for the codes.
It gives a member the option to put their username in the "Modify Profile" page.
EXAMPLE
There are two versions of this code. The only difference is where the code stores the network information.
The first code uses the personal text area for storing the members usernames. So, if you are using other codes that utilize the personal text, you MAY run into the problem of going over the personal text character limit (100). Just keep this in mind.
The second code, uses the signature for storage (400 character limit).
Choose the version best suited for your forum.
Enjoy!!!
SubDevo
Variables:
var soNet=[ // DO NOT TOUCH
["Facebook",
"Your Facebook Profile ID.",
"http://www.facebook.com/profile.php?id=#id#",
"http://i40.tinypic.com/x6mp2b.gif"
],
["Twitter",
"Your Twitter Account Name.",
"http://twitter.com/#id#",
"http://i44.tinypic.com/2cwwscm.png"
] <----- NO COMMA
]; // DO NOT TOUCH
There is really no need to edit these except for choosing which sites you wish to have your members choose from. Remove the ones you don't want from the code. Make SURE the last one does NOT have a comma at the end. You are free to use the icon images I provided in the code. You may also change to your own if you wish. Refer to the bottom of this post for instructions.
IMPORTANT!
Once you have your networks in the list, do NOT remove them or change their order! It will screw up the order in member's profiles and the names they entered will NOT be in the same place anymore. Now, you may add to the list without any consequence. So, to prevent any headaches, choose which networks you wish to use and stick with your decision! lol
Location: Global Footer
"Personal Text" Version:
<script type="text/javascript">
/* Any Social Networks in Mini-Profile by SubDevo */
/* Global Footer - Please leave this header intact. Do not repost. */
/* interoceandesigns.com or lsdp.proboards.com */
var soNet=[
["Facebook",
"Your Facebook Profile ID.",
"http://www.facebook.com/profile.php?id=#id#",
"http://i40.tinypic.com/x6mp2b.gif"
],
["Twitter",
"Your Twitter Account Name.",
"http://twitter.com/#id#",
"http://i44.tinypic.com/2cwwscm.png"
],
["MySpace",
"Your MySpace Page.",
"http://www.myspace.com/#id#",
"http://i42.tinypic.com/illvnb.png"
],
["LiveJournal",
"Your LiveJournal ID.",
"http://#id#.livejournal.com/",
"http://i39.tinypic.com/281tvzm.png"
],
["WordPress",
"Your WordPress Username.",
"http://#id#.wordpress.com/",
"http://i40.tinypic.com/wsjrxv.png"
]
];
// DO NOT TOUCH BELOW
function pG(a,n){return (a.getElementsByTagName(n));}
function g_ID(a){return (document.getElementById(a));} var nR=/\[N4:(.+?)\]/;
if(document.modifyForm){ var dmf=document.modifyForm;
var n=dmf.aim.parentNode.parentNode.parentNode,xU,xI,xF,xU,x=-1;
while(soNet[++x]){ xU=n.cloneNode(true);
xI=pG(xU,"input")[0]; xI.id=soNet[x][0]; xI.name="";xI.maxLength=21;
xF=pG(xU,"font"); xF[0].innerHTML=soNet[x][0]+":";
xF[2].innerHTML=soNet[x][1]; n.parentNode.insertBefore(xU,n);
} var p_txt=dmf.personaltext;
if(nR.test(p_txt.value)){ var pE=RegExp.$1.split("#"),nsn,x=-1;
while(soNet[++x]){ nsn=g_ID(soNet[x][0]); nsn.value=pE[x];}
p_txt.value=p_txt.value.replace(nR,"");
}
function snVal(){ var nx="",nsn,x=-1;
while(soNet[++x]){ nsn=g_ID(soNet[x][0]); nx+=nsn.value+"#";}
if(nx.length>soNet.length){p_txt.value+="[N4:"+nx+"]";}
}
if(document.addEventListener){dmf.addEventListener("submit",snVal,false);
}else{dmf.attachEvent("onsubmit",snVal);}
}
if(/(calendar|pm|pre)view|viewprofile|search2|display/i.test(pb_action)){
var td=document.getElementsByTagName("td"),pE,nC,nS,nTa,nTb,x,i=-1;
while(td[++i]){
if(td.width=="20%"&&nR.test(td.innerHTML)){
pE=RegExp.$1.replace(/\s/g,"").split("#"); nC=pG(td,"center");
for(var x=0;x<pE.length;x++){
if(pE[x]){ nS=document.createElement("span");nTb=soNet[x][2];
nTa=(nTb.match(/skype/i))?"":'target="_blank"';
nTb=nTb.replace(/#id#/i,pE[x]); soNet[x][3]=soNet[x][3].replace (/#id#/i,pE[x]);
nS.innerHTML=' <a href="'+nTb+'" '+nTa+'> <img src="'+ soNet[x][3]+'" border="0" alt="'+soNet[x][0]+'" title="'+soNet[x][0]+'" /></a> ';
nC[(nC.length-1)].appendChild(nS);
}
} td.innerHTML=td.innerHTML.replace(nR,"");
}}}
</script>
"Signature" Version:
<script type="text/javascript">
/* Any Social Networks in Mini-Profile by SubDevo */
/* Global Footer - Please leave this header intact. Do not repost. */
/* interoceandesigns.com or lsdp.proboards.com */
var soNet=[
["Facebook",
"Your Facebook Profile ID.",
"http://www.facebook.com/profile.php?id=#id#",
"http://i40.tinypic.com/x6mp2b.gif"
],
["Twitter",
"Your Twitter Account Name.",
"http://twitter.com/#id#",
"http://i44.tinypic.com/2cwwscm.png"
],
["MySpace",
"Your MySpace Page.",
"http://www.myspace.com/#id#",
"http://i42.tinypic.com/illvnb.png"
],
["LiveJournal",
"Your LiveJournal ID.",
"http://#id#.livejournal.com/",
"http://i39.tinypic.com/281tvzm.png"
],
["WordPress",
"Your WordPress Username.",
"http://#id#.wordpress.com/",
"http://i40.tinypic.com/wsjrxv.png"
]
];
// DO NOT TOUCH BELOW
function pG(a,n){return (a.getElementsByTagName(n));}
function g_ID(a){return (document.getElementById(a));} var nR=/\[N4:(.+?)\]/;
if(document.modifyForm){ var dmf=document.modifyForm;
var n=dmf.aim.parentNode.parentNode.parentNode,xU,xI,xF,xU,x=-1;
while(soNet[++x]){ xU=n.cloneNode(true);
xI=pG(xU,"input")[0]; xI.id=soNet[x][0]; xI.name="";xI.maxLength=21;
xF=pG(xU,"font"); xF[0].innerHTML=soNet[x][0]+":";
xF[2].innerHTML=soNet[x][1]; n.parentNode.insertBefore(xU,n);
} var p_txt=dmf.signature;
if(nR.test(p_txt.value)){ var pE=RegExp.$1.split("#"),nsn,x=-1;
while(soNet[++x]){ nsn=g_ID(soNet[x][0]); nsn.value=pE[x];}
p_txt.value=p_txt.value.replace(nR,"");
}
function snVal(){ var nx="",nsn,x=-1;
while(soNet[++x]){ nsn=g_ID(soNet[x][0]); nx+=nsn.value+"#";}
if(nx.length>soNet.length){p_txt.value+="[N4:"+nx+"]";}
}
if(document.addEventListener){dmf.addEventListener("submit",snVal,false);
}else{dmf.attachEvent("onsubmit",snVal);}
}
if(/(calendar|pm|pre)view|viewprofile|search2|display/i.test(pb_action)){
var td=document.getElementsByTagName("div"),a,pE,nC,nS,nTa,nTb,x,i=-1;
while(td[++i]){
if(td.className=="user_signature"&&nR.test(td.innerHTML)){
pE=RegExp.$1.replace(/\s/g,"").split("#"); a=td;
while(a.width!="80%"){a=a.parentNode;} nC=pG(a.previousSibling,"center");
for(var x=0;x<pE.length;x++){
if(pE[x]){ nS=document.createElement("span");nTb=soNet[x][2];
nTa=(nTb.match(/skype/i))?"":'target="_blank"';
nTb=nTb.replace(/#id#/i,pE[x]); soNet[x][3]=soNet[x][3].replace (/#id#/i,pE[x]);
nS.innerHTML=' <a href="'+nTb+'" '+nTa+'> <img src="'+ soNet[x][3]+'" border="0" alt="'+soNet[x][0]+'" title="'+soNet[x][0]+'" /></a> ';
nC[(nC.length-1)].appendChild(nS);
}
} td.innerHTML=td.innerHTML.replace(nR,"");
}}}
</script>
Advanced:
I have included code for Twitter, Facebook, MySpace, LiveJournal and WordPress.
Of course there are many more!
To add your own or edit your entries, follow the below:
["Facebook", Name of the site. This is your hover text and title on the "Modify Profile" page.
"Your Facebook Profile ID.", Text on the "Modify Profile" page description.
"www.facebook.com/profile.php?id=#id#", The url to the profile of the site.
"i40.tinypic.com/x6mp2b.gif" URL to your icon image.
],
Use #id# in the place where the username should be.
Xbox Gamertag Profile Code:
["Xbox Gamertag",
"Your Xbox Gamertag ID.",
"http://profile.mygamercard.net/#id#",
"http://i39.tinypic.com/t6v2qe.png"
]
If using the Xbox code, make sure you tell your members that if they have a space in their Xbox Id, they need to put a "+" in place of the space.
Example:
If Xbox ID is "Extreme Gamer", you must enter "Extreme+Gamer".
YouTube Profile Code:
["YouTube",
"Your YouTube Profile Name.",
"http://www.youtube.com/#id#",
"http://i39.tinypic.com/opac7.gif"
]
DeviantART Profile Code:
["DeviantART",
"Your DeviantART Profile Name.",
"http://#id#.deviantart.com",
"http://i46.tinypic.com/30jl8c6.png"
]
Skype Codes:
Both codes (when clicked), opens Skype text chat (if installed).
["Skype",
"Your Skype Username.",
"skype:#id#?chat",
"http://i46.tinypic.com/kx361.png"
]
Use this skype code, if you want to show the online/offline status in the mini-profile.
["Skype",
"Your Skype Username.",
"skype:#id#?chat",
"http://mystatus.skype.com/smallicon/#id#"
]
Have fun! ;D
SubDevo
EDIT: 06/17/10
Compatibility code changes and added Skype (online/offline) capability.
EDIT: 03/16/11
Added a second code version that utilizes the signature instead of personal text for storage.
Tested in IE, FF, Opera, Safari and Chrome.
Finally! A code that puts as many of and whatever social networks you want into your mini-profile!
This small, fast code replaces all of the many "Add Twitter/Facebook/MySpace etc... to your mini-profile" codes out there...
You can even add your Xbox Gamertag, YouTube and DeviantART profile pages!
Just added: Skype (with online/offline status)!
Read the Bottom of this post for the codes.
It gives a member the option to put their username in the "Modify Profile" page.
EXAMPLE
There are two versions of this code. The only difference is where the code stores the network information.
The first code uses the personal text area for storing the members usernames. So, if you are using other codes that utilize the personal text, you MAY run into the problem of going over the personal text character limit (100). Just keep this in mind.
The second code, uses the signature for storage (400 character limit).
Choose the version best suited for your forum.
Enjoy!!!
SubDevo
Variables:
var soNet=[ // DO NOT TOUCH
["Facebook",
"Your Facebook Profile ID.",
"http://www.facebook.com/profile.php?id=#id#",
"http://i40.tinypic.com/x6mp2b.gif"
],
["Twitter",
"Your Twitter Account Name.",
"http://twitter.com/#id#",
"http://i44.tinypic.com/2cwwscm.png"
] <----- NO COMMA
]; // DO NOT TOUCH
There is really no need to edit these except for choosing which sites you wish to have your members choose from. Remove the ones you don't want from the code. Make SURE the last one does NOT have a comma at the end. You are free to use the icon images I provided in the code. You may also change to your own if you wish. Refer to the bottom of this post for instructions.
IMPORTANT!
Once you have your networks in the list, do NOT remove them or change their order! It will screw up the order in member's profiles and the names they entered will NOT be in the same place anymore. Now, you may add to the list without any consequence. So, to prevent any headaches, choose which networks you wish to use and stick with your decision! lol
Location: Global Footer
"Personal Text" Version:
<script type="text/javascript">
/* Any Social Networks in Mini-Profile by SubDevo */
/* Global Footer - Please leave this header intact. Do not repost. */
/* interoceandesigns.com or lsdp.proboards.com */
var soNet=[
["Facebook",
"Your Facebook Profile ID.",
"http://www.facebook.com/profile.php?id=#id#",
"http://i40.tinypic.com/x6mp2b.gif"
],
["Twitter",
"Your Twitter Account Name.",
"http://twitter.com/#id#",
"http://i44.tinypic.com/2cwwscm.png"
],
["MySpace",
"Your MySpace Page.",
"http://www.myspace.com/#id#",
"http://i42.tinypic.com/illvnb.png"
],
["LiveJournal",
"Your LiveJournal ID.",
"http://#id#.livejournal.com/",
"http://i39.tinypic.com/281tvzm.png"
],
["WordPress",
"Your WordPress Username.",
"http://#id#.wordpress.com/",
"http://i40.tinypic.com/wsjrxv.png"
]
];
// DO NOT TOUCH BELOW
function pG(a,n){return (a.getElementsByTagName(n));}
function g_ID(a){return (document.getElementById(a));} var nR=/\[N4:(.+?)\]/;
if(document.modifyForm){ var dmf=document.modifyForm;
var n=dmf.aim.parentNode.parentNode.parentNode,xU,xI,xF,xU,x=-1;
while(soNet[++x]){ xU=n.cloneNode(true);
xI=pG(xU,"input")[0]; xI.id=soNet[x][0]; xI.name="";xI.maxLength=21;
xF=pG(xU,"font"); xF[0].innerHTML=soNet[x][0]+":";
xF[2].innerHTML=soNet[x][1]; n.parentNode.insertBefore(xU,n);
} var p_txt=dmf.personaltext;
if(nR.test(p_txt.value)){ var pE=RegExp.$1.split("#"),nsn,x=-1;
while(soNet[++x]){ nsn=g_ID(soNet[x][0]); nsn.value=pE[x];}
p_txt.value=p_txt.value.replace(nR,"");
}
function snVal(){ var nx="",nsn,x=-1;
while(soNet[++x]){ nsn=g_ID(soNet[x][0]); nx+=nsn.value+"#";}
if(nx.length>soNet.length){p_txt.value+="[N4:"+nx+"]";}
}
if(document.addEventListener){dmf.addEventListener("submit",snVal,false);
}else{dmf.attachEvent("onsubmit",snVal);}
}
if(/(calendar|pm|pre)view|viewprofile|search2|display/i.test(pb_action)){
var td=document.getElementsByTagName("td"),pE,nC,nS,nTa,nTb,x,i=-1;
while(td[++i]){
if(td.width=="20%"&&nR.test(td.innerHTML)){
pE=RegExp.$1.replace(/\s/g,"").split("#"); nC=pG(td,"center");
for(var x=0;x<pE.length;x++){
if(pE[x]){ nS=document.createElement("span");nTb=soNet[x][2];
nTa=(nTb.match(/skype/i))?"":'target="_blank"';
nTb=nTb.replace(/#id#/i,pE[x]); soNet[x][3]=soNet[x][3].replace (/#id#/i,pE[x]);
nS.innerHTML=' <a href="'+nTb+'" '+nTa+'> <img src="'+ soNet[x][3]+'" border="0" alt="'+soNet[x][0]+'" title="'+soNet[x][0]+'" /></a> ';
nC[(nC.length-1)].appendChild(nS);
}
} td.innerHTML=td.innerHTML.replace(nR,"");
}}}
</script>
"Signature" Version:
<script type="text/javascript">
/* Any Social Networks in Mini-Profile by SubDevo */
/* Global Footer - Please leave this header intact. Do not repost. */
/* interoceandesigns.com or lsdp.proboards.com */
var soNet=[
["Facebook",
"Your Facebook Profile ID.",
"http://www.facebook.com/profile.php?id=#id#",
"http://i40.tinypic.com/x6mp2b.gif"
],
["Twitter",
"Your Twitter Account Name.",
"http://twitter.com/#id#",
"http://i44.tinypic.com/2cwwscm.png"
],
["MySpace",
"Your MySpace Page.",
"http://www.myspace.com/#id#",
"http://i42.tinypic.com/illvnb.png"
],
["LiveJournal",
"Your LiveJournal ID.",
"http://#id#.livejournal.com/",
"http://i39.tinypic.com/281tvzm.png"
],
["WordPress",
"Your WordPress Username.",
"http://#id#.wordpress.com/",
"http://i40.tinypic.com/wsjrxv.png"
]
];
// DO NOT TOUCH BELOW
function pG(a,n){return (a.getElementsByTagName(n));}
function g_ID(a){return (document.getElementById(a));} var nR=/\[N4:(.+?)\]/;
if(document.modifyForm){ var dmf=document.modifyForm;
var n=dmf.aim.parentNode.parentNode.parentNode,xU,xI,xF,xU,x=-1;
while(soNet[++x]){ xU=n.cloneNode(true);
xI=pG(xU,"input")[0]; xI.id=soNet[x][0]; xI.name="";xI.maxLength=21;
xF=pG(xU,"font"); xF[0].innerHTML=soNet[x][0]+":";
xF[2].innerHTML=soNet[x][1]; n.parentNode.insertBefore(xU,n);
} var p_txt=dmf.signature;
if(nR.test(p_txt.value)){ var pE=RegExp.$1.split("#"),nsn,x=-1;
while(soNet[++x]){ nsn=g_ID(soNet[x][0]); nsn.value=pE[x];}
p_txt.value=p_txt.value.replace(nR,"");
}
function snVal(){ var nx="",nsn,x=-1;
while(soNet[++x]){ nsn=g_ID(soNet[x][0]); nx+=nsn.value+"#";}
if(nx.length>soNet.length){p_txt.value+="[N4:"+nx+"]";}
}
if(document.addEventListener){dmf.addEventListener("submit",snVal,false);
}else{dmf.attachEvent("onsubmit",snVal);}
}
if(/(calendar|pm|pre)view|viewprofile|search2|display/i.test(pb_action)){
var td=document.getElementsByTagName("div"),a,pE,nC,nS,nTa,nTb,x,i=-1;
while(td[++i]){
if(td.className=="user_signature"&&nR.test(td.innerHTML)){
pE=RegExp.$1.replace(/\s/g,"").split("#"); a=td;
while(a.width!="80%"){a=a.parentNode;} nC=pG(a.previousSibling,"center");
for(var x=0;x<pE.length;x++){
if(pE[x]){ nS=document.createElement("span");nTb=soNet[x][2];
nTa=(nTb.match(/skype/i))?"":'target="_blank"';
nTb=nTb.replace(/#id#/i,pE[x]); soNet[x][3]=soNet[x][3].replace (/#id#/i,pE[x]);
nS.innerHTML=' <a href="'+nTb+'" '+nTa+'> <img src="'+ soNet[x][3]+'" border="0" alt="'+soNet[x][0]+'" title="'+soNet[x][0]+'" /></a> ';
nC[(nC.length-1)].appendChild(nS);
}
} td.innerHTML=td.innerHTML.replace(nR,"");
}}}
</script>
Advanced:
I have included code for Twitter, Facebook, MySpace, LiveJournal and WordPress.
Of course there are many more!
To add your own or edit your entries, follow the below:
["Facebook", Name of the site. This is your hover text and title on the "Modify Profile" page.
"Your Facebook Profile ID.", Text on the "Modify Profile" page description.
"www.facebook.com/profile.php?id=#id#", The url to the profile of the site.
"i40.tinypic.com/x6mp2b.gif" URL to your icon image.
],
Use #id# in the place where the username should be.
Xbox Gamertag Profile Code:
["Xbox Gamertag",
"Your Xbox Gamertag ID.",
"http://profile.mygamercard.net/#id#",
"http://i39.tinypic.com/t6v2qe.png"
]
If using the Xbox code, make sure you tell your members that if they have a space in their Xbox Id, they need to put a "+" in place of the space.
Example:
If Xbox ID is "Extreme Gamer", you must enter "Extreme+Gamer".
YouTube Profile Code:
["YouTube",
"Your YouTube Profile Name.",
"http://www.youtube.com/#id#",
"http://i39.tinypic.com/opac7.gif"
]
DeviantART Profile Code:
["DeviantART",
"Your DeviantART Profile Name.",
"http://#id#.deviantart.com",
"http://i46.tinypic.com/30jl8c6.png"
]
Skype Codes:
Both codes (when clicked), opens Skype text chat (if installed).
["Skype",
"Your Skype Username.",
"skype:#id#?chat",
"http://i46.tinypic.com/kx361.png"
]
Use this skype code, if you want to show the online/offline status in the mini-profile.
["Skype",
"Your Skype Username.",
"skype:#id#?chat",
"http://mystatus.skype.com/smallicon/#id#"
]
Have fun! ;D
SubDevo
EDIT: 06/17/10
Compatibility code changes and added Skype (online/offline) capability.
EDIT: 03/16/11
Added a second code version that utilizes the signature instead of personal text for storage.