Smart Contact Pizza Button
Back to Support Page
The Smart Contact Pizza Button (a.k.a. Pizza Button) is part of the Smart Contact Button family. The Overlay Menu is the other member of this familiy.
The Pizza Button is a circle (pizza) divided in 4 quadrants (slices) with in each quadrant one of the possible PushCall contact tools:
- Call Me Now
- Chat
- Mail
- Click-To-Call
Clicking on one of these slices will open a popup window with the requested contact tool
The slices also reflect the availability of each of their contact tool. Outside office hours the Call Me Now and Click-To-Call option slices will be disabled (greyed-out) and clicking on this slice will not open te popup.
The same happens to the Chat slice when no chat operators are available. When you've enabled the mail service for your account, this will allways be available.
Example
An example (using the pushcall target):
Web page integration
It's very easy to integrate into any existing webpage. All you need to do is to insert a <div>-block and some javascript in the body of your HTML document.
<div id="button1"><a href="http://www.pushcall.com"><img src="https://smartcontactbutton.pushcall.com/pcl.gif" alt="Online customer contact" style="border: none"/><br/>Call me Now</a></div>
<script type="text/javascript">
var pcScriptLocation = document.location.protocol+"//smartcontactbutton.pushcall.com/pcscpb.js";
document.write(unescape("%3Cscript src='" + pcScriptLocation + "' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
pizzaButton1 = new PCSCPB( 'button1', 'yourtargetname' );
pizzaButton1.createButton();
</script>
Please note that you should replace
yourtargetname with the name of your target. Also make sure that the id of the <div>-block should be the same as the first argument in the PCSCPB call.
We used 'button1' in this case, but you're free to use any other name.
Optional features
Some optional parameters are available for customization of the Pizza Button.
The language of the text displayed on the button can be customized by setting an optional parameter 'locale' in the constructor of the PCSCPB object:
pizzaButton1 = new PCSCPB( 'button1', 'yourtargetname', {locale: 'en' });
The type of this parameter is a string and represents the 2 character
ISO 639-1 language code. The default value is automatically determined by the browser language.
The following languages are currently supported:
- English (en)
- French (fr)
- Spanish (es)
- German (de)
- Dutch (nl)
The size of the button can be customized by setting an optional parameter 'size' in the call to createButton:
pizzaButton1.createButton( { size: 200 } );
The type of this parameter is an integer and represents the width and height in pixels. The default value is 150.
The color of the available contact tools can be customized by setting an optional parameter 'baseColor' in the call to createButton:
pizzaButton1.createButton( { baseColor:'0xFF0000' } );
The value of this parameter is an hexidecimal RGB value represented as string. The default value is '0xFD6700'.
Some example values:
| Color | Value |
| Red | '0xFF0000' |
| Green | '0x00FF00' |
| Blue | '0x0000FF' |
| PushCall orange | '0xFD6700' |
Specifying multiple optional parameters can be achieved by comma-seperating these parameters:
pizzaButton1.createButton( { baseColor:'0xFF0000', size: 200 } );
It's also possible to change the dimensions of the popup windows.
pizzaButton1.setOnlineCallingSize( width, height );
pizzaButton1.setCallMeNowSize( width, height );
pizzaButton1.setChatSize( width, height );
pizzaButton1.setMailSize( width, height );
Compatibility
This functionality is tested and proven to work in all 5 major browsers:
- Internet Explorer (6, 7 & 8)
- Mozilla FireFox (2 & 3)
- Google Chrome (3)
- Opera (9)
- Safari (3 & 4)
It's also compatible with both the HTTP- and HTTPS-protocol. So you can safely integrate this on a webpage that's served over HTTPS.
Remarks
It's possible to put multiple Smart Contact Pizza Buttons on one page, just make sure to use a different id for the <div>-block (and the PCSCPB call)