-
Notifications
You must be signed in to change notification settings - Fork 7
/
index.html
115 lines (86 loc) · 3.46 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
<!DOCTYPE html>
<html>
<head>
<script src="SIPml-api.js" type="text/javascript"> </script>
<script src="rr_clicktocall.js" type="text/javascript"> </script>
<link rel="stylesheet" href="clicktocall.css">
<style>
html{
background:#f5f5f5;
}
body{
font-family:arial;
width:900px;
margin:0 auto;
padding:10px;
border:1px solid #e5e5e5;
background:#fff;
line-height:1.5em;
}
table {
font-family:Arial, Helvetica, sans-serif;
color:#666;
font-size:12px;
text-shadow: 1px 1px 0px #fff;
background:#eaebec;
margin:20px;
border:#ccc 1px solid;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
-moz-box-shadow: 0 1px 2px #d1d1d1;
-webkit-box-shadow: 0 1px 2px #d1d1d1;
box-shadow: 0 1px 2px #d1d1d1;
width:500px;
}
table td {
padding:18px;
border-top: 1px solid #ffffff;
border-bottom:1px solid #e0e0e0;
border-left: 1px solid #e0e0e0;
background: #fafafa;
background: -webkit-gradient(linear, left top, left bottom, from(#fbfbfb), to(#fafafa));
background: -moz-linear-gradient(top, #fbfbfb, #fafafa);
}
</style>
</head>
<h1>RingRoost ClickToCall</h1>
<p>RingRoost ClickToCall is a html button that allows website visitors to call you directly from their browser. The button can be installed on any website, and is currently compatible with all major browsers (Chrome, Firefox, IE, Safari, Opera). </p>
<p>Give it a try:<p>
<div notsupported_text="<a href='tel:17043436748'>Call Us: 704.343.6748 </a>"
text="Talk To Agent Now"
call="17043436748"
id="ringroost_c2c"
class="rr_blue"></div>
<p>You can see another working example at:<a href="http://www.ringroost.com/click2call.php"> http://www.ringroost.com/click2call.php</a></p>
<h1>Installation </h1>
<h2>Step 1. Include JS/CSS Files in page head</h2>
<textarea style="width:400px;height:80px;">
<script src="SIPml-api.js" type="text/javascript"> </script>
<script src="rr_clicktocall.js" type="text/javascript"> </script>
<link rel="stylesheet" href="clicktocall.css">
</textarea>
<h2>Step 2. Add the html div tag with id "ringroost_c2c" </h2>
Add the following div tag in your html wherever you want the button to show up.
<textarea style="width:800px;height:80px;">
<div id="ringroost_c2c" notsupported_text="<a href='tel:17043436748'>Call Us:704.343.6748</a>" text="Call Us" call="17043436748" class="rr_blue"></div>
</textarea>
<h2>Step 3. Set Required Properties </h2>
<strong>Required properties</strong>
<table>
<tr> <td> id </td> <td> Must be set to "ringroost_c2c" </td> </tr>
<tr> <td> call</td> <td> Telephone number that will button will call when pressed. </td> </tr>
<tr> <td> text</td> <td>This is the text that will be shown in your button. </td> </tr>
</table>
<strong>Optional properties</strong>
<table>
<tr> <td> notsupported_text </td> <td> What to display in case that a browser is not compatible with the button. You may embed html in the attribute. </td> </tr>
<tr> <td> class</td> <td> (rr_grey| rr_red|rr_blue|rr_green|rr_black|rr_yellow|rr_purple|rr_gblue|rr_button1)
You can set a class on the div in order to change it’s appearance. Button styles corrispond (roughly) to these buttons: http://www.joepettersson.com/demo/css3-buttons/
</td> </tr>
</table>
<p>
Note: If you have your own SIP server/gateway your welcome to integrate this clicktocall button with that. You will need change the appropriate setting in "rr_clicktocall.js" (this is kinda advanced, so make sure you know what you are doing).
</p>
</body>
</html>