Advanced Search

Add Widgets to Your KickApps Member Profile Pages

/ Published in: JavaScript
Save to your folder(s)
With these two snippets I am creating a new div tags within the profile container element, below the right column element on a KickApps member profile page. Where it says HTML GOES HERE you can past any widget or HTML that you want to add to your profile pages.

I've personally used CSS to re-style my profile pages. I've made the container element wider and floated both columns to the left. My new div tag also floats to the left so that it appears to be a third column on the page. But, you could also use CSS to position the new div tag below the right column.

The second snippet uses Ka.Info.PROFILENAME to put user-specific widgets on the profile page. So, if you want your widget to only include media from that specific member, use the second snippet. Remember to replace the widget code with your own and note the two spots where the memberName variable gets added to the mediaParameters.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <!-- Add Profile Widget -->
  2. <script type="text/javascript">
  3.   function addProfileElement(){
  4.     if($('ka_profilePage')){
  5.       /* add a new <div> to the page */ 
  6.       var newDiv = document.createElement('div'); 
  7.       newDiv.id = 'profile_extraDiv'; 
  8.       $('ka_profileRight').parentNode.appendChild(newDiv); 
  9.       /* add HTML to the new <div> */ 
  10.       $('profile_extraDiv').innerHTML = 'HTML GOES HERE';              
  11.     }          
  12.   }   
  13.   Ka.addDOMLoadEvent(addProfileElement); 
  14. </script>
  15.  
  16.  
  17.  
  18. <!-- Add Member Specific Profile Widget -->
  19. <script type="text/javascript">
  20.   function addProfileElement(){
  21.     if($('ka_profilePage')){
  22.       // add a new <div> to the page 
  23.       var newDiv = document.createElement('div'); 
  24.       newDiv.id = 'profile_extraDiv'; 
  25. 	  var memberName = Ka.Info.PROFILENAME;
  26.       $('ka_profileRight').parentNode.appendChild(newDiv); 
  27.       // add HTML to the new <div>
  28.       $('profile_extraDiv').innerHTML = '<div id="myPhoto_module"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" type="application/x-shockwave-flash" width="270" height="257" id="kickWidget_78592_90524" align="middle"><param name="movie" value="http://serve.a-widget.com/service/getWidgetSwf.kickAction"/><param name="FlashVars" value="affiliateSiteId=78592&widgetId=90524&width=270&height=257&mediaParameters=members%3D' + memberName + '"/><param name="wmode" value="transparent"/><param name="allowFullScreen" value="true"/><param name="menu" value="false"/><param name="allowScriptAccess" value="always"/><embed src="http://serve.a-widget.com/service/getWidgetSwf.kickAction" name="kickWidget_78592_90524" width="270" height="257" menu="false" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent" align="middle" allowScriptAccess="always" alt="KickApps Widget" allowFullScreen="true" FlashVars="affiliateSiteId=78592&widgetId=90524&width=270&height=257&mediaParameters=members%3D' + memberName + '"/></object></div>';              
  29.     }          
  30.   }   
  31.   Ka.addDOMLoadEvent(addProfileElement);
  32. </script>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.