Customizing Linkedin Login Button

Question

I'm implementing LinkedIn Login into my web app.. I'm using following script as :

<script type="in/Login"> </script> 

to load the LinkedIn Sign In button. This script automatically loads a LinkedIn Sign in button with fix design or image..

but I want to Customize a button with my custom Image of LinkedIn and this button should generate the LinkedIn login event after clicking on it.. that is it should serve above script's purpose

Plz Help

Answer 1

Other way to do this:

1. Place an image that you like:

   <a href=""><img onclick="liAuth()" src="./img/widget_signin.png"></a>
   

2. Create JS function like this:

   function liAuth(){
      IN.User.authorize(function(){
          callback();
      });
   }
   

3. Use LinkedIn user data:

   IN.API.Profile("me")
      .fields("firstName", "lastName", "headline")
      .result(resultFunction);
   

Answer 2

Yes, it's possible. We're using jQuery, so here is our solution:

<script type="text/javascript" src="http://platform.linkedin.com/in.js">    
  api_key: apikey    
  onLoad: onLinkedInLoad    authorize: true
</script>

<script type="text/javascript">    
  function onLinkedInLoad() {        // Use a larger login icon. 
     $('a[id*=li_ui_li_gen_]').css({marginBottom:'20px'}) 
       .html('<img src="/images/shared/linkedin-register-large.png" height="31" width="200" border="0" />');    
  }
</script>