Jump to: navigation, search

Setup Google Drive

Revision as of 12:57, 27 March 2020 by Arpita (talk | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

Setup Google Drive

Admin > Store Configuration > External Service Settings > Cloud Storage TAB > Google Drive

Get business and IT benefits with Google Drive. Google drive reduces infrastructure cost and management and allows your end-customers to easily upload large files directly in the drive. It is highly recommended for businesses to integrate the best storage solution offered by Google.

Read below a systematic guide to integrate Google Drive into your website.

Step – 1 Create New Project

  • Visit https://console.developers.google.com/
  • Login with your Google Account.
  • After successful login, create a New Project from a ‘NEW PROJECT’ Button.
  • Enter your project name and location to create a project

Setup Google Drive1.png

  • After creating a project Google Developers page will lead you to your project dashboard. Click on Go To APIs Overview.

Step – 2 Enable APIs and create credentials

  • The APIs Overview button will redirect you to your project dashboard.
  • Click on the ‘ENABLE APIS AND SERVICES’ button.

    Setup Google Drive2.png

  • Search ‘Google Drive’
  • Enable the API.
  • To use Google Drive API in your store, you may need credentials. Click 'Create credentials' to get started.

    Setup Google Drive3.png

Step – 3 Add Credentials to your project

  • Select which API you are using, as different APIs use different auth platforms, and some credentials can be restricted for certain APIs. In this case, choose the Google Drive API.
  • Choose from where you will call the API i.e. ‘Web Server’.
  • Select the type of data you are willing to access i.e. ‘User Data’.
  • Now click on ‘What Credentials Do I Need?’ button and set up an OAuth consent Screen.

    Setup Google Drive4.png

Step – 4 Set up OAuth Consent Screen

  • In the next pop-up click on ‘Set Up Consent Screen’

    Setup Google Drive5.png

  • Next, choose the user type for your API i.e. External and click on create.

    Setup Google Drive6.png

  • Fill up the consent screen, enter your Application Name and Application Logo.

    Setup Google Drive7.png

  • Enter the links for domain authorization such as the website domain, homepage link, privacy policy page link, and terms of services link.

    Setup Google Drive8.png

  • When finished click on the Submit.

Step – 5 Get Credentials

  • For the credentials click on ‘Credentials’ at the left bar.
  • Click ‘+CREATE CREDENTIALS’ then OAuth Client ID.

    Setup Google Drive9.png

Step – 6 Create OAuth Client ID

  • Select application type as – ‘Web Application’
  • Enter your store domain in Authorized JavaScript Origin.
  • In Authorized redirect URIs enter the URL in the following manner –http://www.<yourdomainname>.com/admin/configuration_external_service_action.php
  • Note – You can also configure Google Login and Google Photos on the same screen i.e. under the same project, all you have to do is enter the redirect URIs for both APIs and enable Google Photos API them from the APIs Dashboard. There is noneed to create a new project every time, you can configure all APIs in one project only.

    Redirect URI for Google Login - http://www. <yourdomainname>.com/user_registration.php

    Redirect URI for Google Photos - http://www. <yourdomainname>.com/studio/Services/images.php

  • Click on create

    Setup Google Drive16.png

Step – 7 Copy the credentials

  • Copy the Client ID and Client Secret key to configure into Admin Panel.

Setup Google Drive10.png

Step – 8 Apply for verification

  • Go to, OAuth consent screen >> Edit App

    Setup Google LoginPhotos7.png

  • Check the Application details and Submit for verification. In the next pop-up enter your application details, and provide a contact email address. Next, click on Submit.

    Setup Google LoginPhotos8.png

  • Google will verify your business and application details, thus allowing you to use Google Apps on your website without any hassle or verification error. Your application verification status will change to ‘Being Verified’.

    Setup Google LoginPhotos9.png

    If your application isn’t verified then google displays a safety error to your customers, as shown below –

    Setup Google Drive12.png

    With this error, your application may work for a few days but it is advisable to get the application verified to avoid any further inconveniences.

Step – 9 Admin Panel Configuration

  • In Admin Panel go to, Admin >> Store Configuration >> External Service Settings >> Cloud Storage Tab >> Enable Google Drive >> Action menu >> Edit option
  • Enter the Client ID and Client Secret key and click on the Generate link.

    Setup Google Drive11.png

  • In the next screen click on ‘Connect Me’ and give required permissions to google drive.
  • This will generate the Access Token.
  • Next, enter the folder name where all the files uploaded by a customer while placing an order will be saved.
  • Click on ‘Save and back’.

    Setup Google Drive13.png

Note: If you have entered the redirect URIs for Google Login and Photos as shown in Step 6, then you can enter these Client ID and Client secret key in External Service Settings >> Social Sharing >> Google to enable Google Login at your website, and enable Google Photos in Designer Studio.

How to enable Cloud File Upload?

To enable customers to upload files directly into your Google Drive storage you will have to Allow Cloud File Upload for a product from the Product section.

Enable this from-

Admin > Products > Products > ‘Action’ dropdown of a particular product > Settings > 'Upload' Tab > Allow Cloud File Upload > Select 'Both' Option

Setup Google Drive14.png

Front Store – The above setting will show a button on the Upload Design page which will allow your customers to upload Cloud File.

Setup Google Drive15.png