How can I use skype-uri.js with personalized buttons?

Question

I want to use the skype-ui found in Skype UI Reference but I don't like to use the "image assets" that Skype has available. I have created my personalized Skype button and I want to use it. How can I do this?

I know that there is a code like this:

<a href="skype:echo123?call">Call</a> the Skype Echo / Sound Test Service

and it can easily be use as any kind of button but when using this on a computer that doesn't have any skype installed, the thing won't allow me to redirect in the downloads page of skype. Unlike when using the js script:

<div id="call_32" style="width:20%;background-color:#0094ff">
<script type="text/javascript">
    Skype.ui({
        name: "call",
        element: "call_32",
        participants: ["echo123"],
        imageSize: 32,
        imageColor: "white"
    });
 </script>
</div>

But it won't let me use a personalized button.

Please help.

Thanks,

mark

score 23 · Answer 1 · answered Aug 08 '13 at 08:18

I know this question is a bit old, but as I just faced the same problem I thought I would share my solution.

Include the skypeui.js package as instructed somewhere before the button

<script type="text/javascript" src="http://cdn.dev.skype.com/uri/skype-uri.js"></script>

Then simply use the following markup, replace "myskypename" with the skype name or number you would like to call.

<div id="MyDiv">
   <a onclick="Skype.tryAnalyzeSkypeUri('call', '0');" href="skype:myskypename?call">
      <img role="Button" src="/images/mybutton.gif">
   </a>
</div>

That's the best answer ! Thanks – Sylver Dec 27 '16 at 22:05 — Sylver, Dec 27 '16 at 22:05

score 1 · Answer 2 · answered Sep 14 '15 at 17:16

1) Insert the skype button like explained here : http://www.skype.com/en/features/skype-buttons/create-skype-buttons/

2) Hide the skype button div.

$('#SkypeButton_Call_your_skype_id_1').css('display', 'none');

3) Place your own image / link

<a href="" onclick="skype_contact();">Call me</a>

4) Place this function in your js file. (it's the same code than the one that's triggered when you click on the skype Button)

function skype_contact()
{
    Skype.tryAnalyzeSkypeUri('call', '0');
    Skype.trySkypeUri_Generic('skype:your_skype_id?call', $('#SkypeButton_Call_your_skype_id_1 > iframe').attr('id'), '0');         
}

score 0 · Answer 3 · edited Apr 22 '14 at 18:27

0

Try this, this is working..

<html>
<script type="text/javascript" src="http://www.skypeassets.com/i/scom/js/skype-uri.js"></script>
<div id="SkypeButton_Call_dhruv_1">
  <script type="text/javascript">
    Skype.ui({
      "name": "call",
      "element": "SkypeButton_Call_dhruv_1",
      "participants": ["dhruv"],
      "imageSize": 32
    });
  </script>
</div>
</html>

edited Apr 22 '14 at 18:27

Aminesrine

2,082
6
35
64

answered Feb 12 '14 at 06:19

user3243696

1

score 0 · Answer 4 · answered Apr 07 '18 at 09:26

Based on above answer by François-Xavier De Nys

Supports call and chat links.

Replace echo123 with your skype ID.

Scripts:

<script src="https://secure.skypeassets.com/i/scom/js/skype-uri.js"></script>

<script>
// code for adding and clicking hidden Skype buttons
var
SkypeButtons_ek = {},

// call when doc ready to setup the hidden button
// id = any unique id, user = your skype user id, type = call or chat
SkypeButton_ek_add = function(id, user, type){
  SkypeButtons_ek[id] = {user: user, type: type};
  jQuery("body").append('<div id="SkypeButton_ek_'+id+'"></div>');
  Skype.ui({
    "name": type,
    "element": "SkypeButton_ek_"+id,
    "participants": [user]
  });
  jQuery("#SkypeButton_ek_"+id+", #SkypeButton_ek_"+id+" > iframe").hide();
},

// call from your own link/button/event
// id is the same id you passed to SkypeButton_ek_add
SkypeButton_ek_click = function(id){
  if (SkypeButtons_ek[id].type == 'chat')
    SkypeWebControl.SDK.Chat.startChat({ConversationType: 'person', ConversationId: SkypeButtons_ek[id].user});
  else {
    Skype.tryAnalyzeSkypeUri(SkypeButtons_ek[id].type, '0');
    Skype.trySkypeUri_Generic('skype:'+SkypeButtons_ek[id].user+'?'+SkypeButtons_ek[id].type+'', jQuery('#SkypeButton_ek_'+id+' > iframe').attr('id'), '0');
  }
};

// add Skype buttons hidden
jQuery(document).ready(function($){
  SkypeButton_ek_add(1, 'echo123', 'chat'); 
  SkypeButton_ek_add(2, 'echo123', 'call'); 
});
</script>

Markup

<a href="" onclick="SkypeButton_ek_click(1); return false;">Skype Chat</a>
<a href="" onclick="SkypeButton_ek_click(2); return false;">Skype Call</a>

You can of course add or bind the SkypeButton_ek_click call to any event.

TM Dinesh · Answer 5 · 2014-12-24T10:53:05.127

-2

`<a href="skype:your skype id">`your icon or button here</a>

read more about skype button here http://msdn.microsoft.com/en-us/library/office/dn745878

edited Dec 24 '14 at 10:53

answered Dec 23 '14 at 14:44

TM Dinesh

210
3
13

1

Huh? How is this an answer? – David Makogon Dec 23 '14 at 15:18

How can I use skype-uri.js with personalized buttons?

5 Answers5

Linked