Follow these steps to add the Domains widget to your site:
1. Set up your account
Contact Google Domains to apply to be a partner. Once approved, we set up a new account that you need to configure. When you configure your account, you set a template which determines the behavior of domains registered through your widget. This template includes the following:
- Resource records that you'd like automatically added to new domains. For example, you can set A, AAAA, CNAME, and MX, records to have your web service automatically configured by default.
- The domain you want to use the widget on. You may also choose to include subdomains.
- Any relevant fields you want to pass to Domains.
2. Import the API source
Add the following script source to the head element of your website document:
<script src="https://apis.google.com/js/api.js"></script>
3. Invoke the widget API
Add the following JavaScript skeleton to the head element of your website document:
<script type="javascript">
gapi.load('domains', function() {
gapi.domains.searchAndBuy(
{
partnerId: /*RQ*/,
successUrl: /*RQ*/,
cancelUrl: /*RQ*/,
defaultQuery: /*Opt*/,
defaultTlds: /*Opt*/,
template: { /*RQ if using multiple templates*/
templateId: /*RQ*/,
vars: {
/*Opt*/
},
},
hints: { /*Opt*/
additionalServices: ["email"], /*Opt*/
}
});
});
</script>
4. Create a wrapper function
Add the following JavaScript to the head element of your page:
function showGoogleDomainsFlow() { /*Defined function*/
gapi.load('domains', function() {
gapi.domains.searchAndBuy({
....
});
});
}
5. Invoke the function
Add this button to invoke the function that you created:
<button onclick="showGoogleDomainsFlow()">Buy a domain </button>
The end result should look like the following:
<head>
<script src="https://apis.google.com/js/api.js"></script>
<script type="javscript">
function showGoogleDomainsFlow() {
gapi.load('domains', function() {
gapi.domains.searchAndBuy({
....
});
});
}
</script>
....
</head>
<body>
....
<button onclick="showGoogleDomainsFlow()">Buy a domain</button>
....
</body>