Examples

Deep links

Google Contacts
Yahoo
Outlook.com
iCloud
AOL
LinkedIn
macOS Contacts
Outlook

 

<!-- replace 'localhost-only' with your key if you want to run this outside of your localhost environment -->
<script src="https://api.cloudsponge.com/widget/localhost-only.js"></script>

<!-- customize widget behavior here -->
<script type="text/javascript">
  // this is where you can configure the behavior and style of the widget
  // https://www.cloudsponge.com/developer/contact-picker/
  cloudsponge.init({
    sources: ['gmail','yahoo','windowslive','icloud','aol','linkedin',"addressbook","outlook"],
    skipSourceMenu: true
  });
</script>

<!-- Any link with a class="cs_import" will start the import process -->
<a href="#" class="cloudsponge-launch" data-cloudsponge-source="gmail">Google Contacts</a><br />
<a href="#" class="cloudsponge-launch" data-cloudsponge-source="yahoo">Yahoo</a><br />
<a href="#" class="cloudsponge-launch" data-cloudsponge-source="windowslive">Outlook.com</a><br />
<a href="#" class="cloudsponge-launch" data-cloudsponge-source="icloud">iCloud</a><br />
<a href="#" class="cloudsponge-launch" data-cloudsponge-source="aol">AOL</a><br />
<a href="#" class="cloudsponge-launch" data-cloudsponge-source="linkedin">LinkedIn</a><br />
<a href="#" class="cloudsponge-launch" data-cloudsponge-source="addressbook">macOS Contacts</a><br />
<a href="#" class="cloudsponge-launch" data-cloudsponge-source="outlook">Outlook</a><br />

<!-- This textarea will be populated with the contacts returned by CloudSponge -->
<textarea class="cloudsponge-contacts"
  placeholder="This textarea has class='cloudsponge-contacts' to tell our widget that this is where we want the contact to be inserted. It doesn't have to be a textarea, it can be any type of HTML element."
  style="width:100%; height:200px;"></textarea>