helpcenter/Web/Controls/Help/TipsTricks/Documents/ConnectGoogleDrive/ConnectGoogleDrive.ascx

<%@ Control Language="C#" Inherits="BaseContentUserControls" %>
<%@ Register Namespace="TeamLab.Controls" Assembly="__Code" TagPrefix="cc" %>

<script runat="server">
    protected override void Init()
    {
        PageTitle = PageCaption = "How to edit documents from Google Drive in ONLYOFFICE";
        MetaKeyWords = "synchronize files, third-party, connect clouds, Google Drive, Documents";
        MetaDescription = "You have a Google account and want to edit your documents using ONLYOFFICE";             
    }
</script>

<div class="main_buscall_container dataBackup">
    <div class="MainHelpCenter">
        <h1 class="subHeaderFeaturesCaption TipsCaption">How to edit documents from Google Drive in ONLYOFFICE</h1>
        <div class="keyword_block">
            <ul>
                <li><cc:LocalizeContent runat="Server" ControlName="~/Controls/Help/Tags/onlyoffice-documents/onlyoffice-documents.ascx" /></li>
                <li><cc:LocalizeContent runat="Server" ControlName="~/Controls/Help/Tags/integrate-google-account/integrate-google-account.ascx" /></li>
            </ul>
        </div>


        <p>You have a Google account and want to edit your documents using ONLYOFFICE? Follow this step-by-step guide to find out how to edit documents stored in your Google from the Documents portal module.</p>
        <p>This option is available for <b>ONLYOFFICE Workspace</b>/<b>ONLYOFFICE Workspace Enterprise Edition</b> users only.</p>
        <div class="notehelp">
            Cloud users can skip this section and proceed with <b>Connect your Google Drive to ONLYOFFICE</b> step.
        </div>

        <h2>Creating authorization keys</h2>
        <p>You will have to setup authorization keys for Google Drive. Follow these steps:</p>
        <ol class="instructions">
            <li>Go to <a target="_blank" class="links" href="https://console.cloud.google.com/cloud-resource-manager">Google Cloud Platform console</a>.</li>
                        <li>Sign in to your account.</li>
                        <li>Click the <b>Create project</b> button. Enter the <b>Project Name</b> in the corresponding field and click the <b>Create</b> button. Once the project is created, you'll see a notification in the upper right corner of the page. Click on the project name to open it.</li>
                        <li>Enable necessary APIs:
                            <ul>
                                <li>Click the navigation menu in the upper left corner and select the <b>APIs and services</b> -> <b>Dashboard</b> section.</li>
                                <li>Click the <b>Enable APIs and services</b> button on the top.</li>
                                <li>In the <b>Google Workspace</b> section, click the <b>Google Drive API</b> link, then click the <b>Enable</b> button.</li>
                                <%--<li>Return to the <b>Dashboard</b> page, click the <b>Enable APIs and services</b> button. In the <b>Social</b> section, enable the <b>Google People API</b> and <b>Contacts API</b> in the same way.</li>--%>
                            </ul>
                        </li>
                        <li>Configure the OAuth consent screen, add a scope and test users:
                            <ul>
                                <li>Click the navigation menu in the upper left corner and select the <b>APIs and services</b> -> <b>OAuth consent screen</b> section.</li>
                                <li>Choose the <b>User Type</b> and click <b>Create</b>.</li>
                                <li>In the <b>App information</b> section, specify the <b>App name</b> and <b>User support email</b> in the corresponding fields.</li>
                                <li>In the <b>App domain</b> section, go to the <b>Authorized domains</b> subsection. Click the <b>Add domain</b> button and specify the <code>onlyoffice.com</code> domain in the entry field.</li>
                                <li>Specify an email in the <b>Developer contact information</b> section.</li>
                                <li>Click the <b>Save and continue</b> button.</li>
                                <li>Click the <b>Add or remove scopes</b> button. On a new screen that opens, go to the <b>Manually add scopes</b> section, specify <code>https://www.googleapis.com/auth/drive</code> in the entry field and click the <b>Add to table</b> button, then click <b>Update</b>.</li>
                                <li>Click the <b>Save and continue</b> button.</li>
                                <li>In the <b>Test users</b> section, click the <b>Add users</b> button. Specify necessary Google accounts and click the <b>Add</b> button. </li>
                                <li>Click the <b>Save and continue</b> button.</li>
                            </ul>
                        </li>
                        <li>Get <code>Client ID</code> and <code>Client secret</code>:
                            <ul>
                                <li>Click the navigation menu in the upper left corner and select the <b>APIs and services</b> -> <b>Credentials</b> section.</li>
                                <li>Click the <b>Create credentials</b> button and choose the <b>OAuth client ID</b> option in the list.</li>
                                <li>In the <b>Application type</b> list, select the <b>Web application</b> option.</li>
                                <li>In the <b>Authorized JavaScript origins</b> section, click the <b>Add URI</b> button and enter "https://service.onlyoffice.com" in the entry field.</li>
                                <li>In the <b>Authorized redirect URIs</b> section, click the <b>Add URI</b> button and enter "https://service.onlyoffice.com/oauth2.aspx" in the entry field.</li>
                                <li>Click the <b>Create</b> button.</li>
                                <li>Your <code>Client ID</code> and <code>Client secret</code> will be displayed in a new window. Copy or write down them.</li>
                            </ul>
                        </li>
        </ol>

        <h2>Connecting the Google Drive service</h2>
        <ol class="instructions">
            <li>First of all go to the <b>Settings</b> section. To do that click the <img alt="Settings icon" src="<%=VirtualPathUtility.ToAbsolute("~/images/help/tipstricks/settingsicon.png")%>" /> icon in the right upper corner.</li>
            <li>Switch to the <b>Integration</b> tab.</li>
            <li>Open the Third-Party Services page.</li>
            <li>Click the sliding button right of the Google Drive logo.</li>
            <li>Enter your keys and click the <b>Enable</b> button.</li>
        </ol>

        <h2>Connect your Google account to ONLYOFFICE</h2>
        <ol class="instructions">
            <li>In the left sidebar of the <b>Documents</b>, just below the text <b>Connect</b>, click on the <img alt="Google Drive icon" src="<%=VirtualPathUtility.ToAbsolute("~/images/help/tipstricks/googledriveicon.png")%>" /> Google Drive icon.</li>
            <li>Login to your Google account.</li>
            <li>Allow ONLYOFFICE to connect to your Google Drive by clicking the button.
                Your Google Drive documents will be shown in ONLYOFFICE documents as a folder.
            </li>
            <li>Change the folder‘s name, if necessary.</li>
            <li>If you want the Google Drive documents to be visible for anyone, click the <b>Make shared</b> checkbox and put into the <b>Common Documents</b> folder. If not checked, your Google Drive account will only be visible to you.</li>
            <li>Click <b>Save</b>.</li>
        </ol>

        <h2>Edit your Goolge Drive documents</h2>
        <ol class="instructions">
            <li>Locate the Google Drive folder and open it.</li>
            <li>
                Browse to the file you want to edit and click it.<br />
                If necessary, a dialog will tell you that the document will be converted to the OpenOffice XML format for faster viewing and editing.<br />
                You can choose to keep the original file as well, by checking the <b>Save the file copy in the original format as well</b> box.
            </li>
            <li>Click <b>Convert</b>.</li>
            <li>Click <b>Open</b> when the message appears that your document is successfully converted.</li>
        </ol>
           <p>Now you can edit your document (if editable). After editing, you can simply close the document and the changes will be saved.</p>
    </div>
</div>