How To Create And Restrict Google Maps API Key [2022 Guide]

[Music] in today's video I'll show you how to create a Google Maps API key for your project and I'll also show you how to restrict that API key so that others cannot use it for their own projects so let's begin the first step is to go to Google Cloud so I'll search for it let's click on the first link and now as of October 2022 this is what the page looks like so I'll click on sign up free at the top and on the next page we'll need to provide some personal information so my country is already selected so now I'll go ahead and select a description from this list I'll choose personal project and I'll accept the terms of service and I'll click on continue now on this page we need to choose an account type and enter some payment information so I'll go ahead and change this from business to individual so the next step would be to enter my payment and billing information at the bottom and then I'll click on start my free trial so I'll enter this information off screen I will see you guys on the other side so once we have clicked start my free trial we should land on this page where we can enter some information with regards to this offer from Google for 300 in credit to spend over the next 90 days this is completely optional but if you'd like you can go through with it so I'll just access this drop down menu and I'll select an option let's choose option number two we want to learn about products and services and apis we want to use this for websites I'll click on next and for the final option let's just say that I am a system admin I'll click on done and here we have some more offers which I will skip for now now on this page I'll go to the top where it says my first project this project was created automatically but we are going to create a new project so now we can go ahead and change the name if you're creating an app it could be the name of the app if it's a website you could name it after the website but in my case to keep this simple I'll just type in my website so now we can go ahead and click on the create button at the bottom so now the project is being created once it's done close this notifications menu and click on Google Cloud at the top make sure your project is selected then click on the menu icon and from there we can click on apis and services on the next page we'll need to click on enable apis and services at the top and now we can see a list of multiple items so we just need to click on maps on the left hand side to filter it now you'll need to enable multiple apis and services some people may recommend enabling all of them while Others May recommend enabling just what you need and that would make sense if the application specifies the required apis if you're not sure you can just go ahead and enable all of them you can always go back and disable them later on so let's right click on the first one and open it in a new tab I'll click on the tab and I'll click on enable and we can just wait for the process to finish once it's done we can close the tab so instead of opening these one by one we can open about three or four in separate tabs so I'll start with geolocation then I'll move to Maps as decay then roads API now we can go to each of the tabs to click on enable let's go to the next one I'll click enable and we'll do the same for the next one so once we're done enabling the last one the first one should be ready you'll see the icon change to a location pin we have enabled two of them so far so we can close this tab and we just need to repeat the process for all of the other apis and services so I'll just open each of them in a new tab and I'll go ahead and enable them once they are enabled I'll just close the tabs and I'll just repeat this until I have gone through the entire list and this could be the most tedious part of this process if you do decide to enable all apis and services so once you've got to the last one you should be able to see a list of all of the enabled apis and if you scroll down there won't be any more additional apis so at this point we can go ahead and click on credentials on the left hand side now let's click on create credentials at the top click API key and now we have our API key which we could go ahead and copy but instead we'll click on edit API key since now we are going to restrict it let's rename this API key to something like Google Maps API and under application restrictions we can select the type of application we want to use this key for I'm going to select HTTP refers since I'll use this for a website and on the right hand side we have a guide that explains the format for the referrer so for a specific URL you can simply type in the URL for any URL in a single domain with no subdomain we can type in the domain slash asterisk and for a URL in a single subdomain just type in the subdomain asterisk for any subdomain or path URL in a single domain type in asterisk dot the domain asterisk and the final option is for a URL with a non-standard port let's use the previous option so I'll just highlight and copy this and I'll scroll down and click on add an item and I'll paste it in the referral field which has the same one as a placeholder let's view my website's URL so I'll open a new tab and I'll click on this bookmark so we can see that the URL is product touch.xyz we'll need to use this to replace the domain portion of the placeholder so I'll just highlight the domain then I'll type product.xyz so now we know that this covers any path for this domain and its subdomains since we're finished configuring this we can click on done if you want to configure API restrictions to restrict the apis that your key can call click restrict key then select the API keys that you want to restrict from this menu you can also filter your search and as an example if you want to restrict the maps JavaScript API all you need to do is highlight the API check the box next to it and click on OK so you can restrict apis if you want to but it's not always necessary so for our example I'll skip this step and I'll click on Save on this page next to our Google Maps API I'll click on show key and I'll copy the key let's close this model and I'll close the about test page as well then I'll open up a new tab to go to the back end of my website so here we have a Google Maps blog from order which by the way you should check out if you build your websites using Wordpress I'll leave a link in the description so I'll just go to this field and paste my API key then I'll click on the save button and at this point the block will refresh and we'll see the Google Map so now we can take a look at this on the front end I'll hit preview let's open it in a new tab and we can go ahead and test it out to confirm that it works so you now know how to create and restrict a Google Maps API key if you like this video give it a thumbs up leave a comment and subscribe to see more videos like this one thank you for watching and see you next time foreign

Channel: ThemeIsle: WordPress Tutorials & Reviews

Views: 39,668

Keywords: Google Maps API, How to Create Google Maps API, Google Maps API Key, Create and Restrict Google Maps API, Get Free API Google, Google API, Maps API, Maps Javascript API, Restrict Google Maps API, Google Maps WordPress, Google Maps iOS, Google Maps API Swift, Google Maps API Webflow, Google Maps Block WordPress

Id: O-o8xSacFPY

Length: 7min 23sec (443 seconds)

Published: Fri Oct 14 2022