# Google Classroom

{% embed url="<https://www.youtube.com/watch?t=1174s&v=98LKgphFSCY>" %}

**Google Classroom** add-on is an additional feature created specifically to ease the process of structuring classes and your workflow. With a new function, you can connect your Google Classroom account with your website and import the needed classes. Students will get a special code to enter the right class.

<figure><img src="/files/8csKoJx4y8kDWxauq6gY" alt=""><figcaption><p>WP Dashboard > MS LMS > Pro Addons</p></figcaption></figure>

{% hint style="info" %}
To successfully use this feature, you need PHP version 7.2 or higher.
{% endhint %}

## How to get API Credentials <a href="#how-to-get-api-credentials" id="how-to-get-api-credentials"></a>

Firstly, you need to create an app in the **Google Console** to get credentials.&#x20;

{% stepper %}
{% step %}
Follow to <https://console.developers.google.com/apis/credentials> to open the Google Developers Console:

<figure><img src="/files/bZBDrLHHv5Cc7173SzAS" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}
You can use the existing projects or create a new project to keep your console organized.&#x20;

<figure><img src="/files/v92si3WPWgs1QJyi2X6r" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
A new project can easily be created simply by providing its name.
{% endhint %}
{% endstep %}

{% step %}
On the Credentials page,  click on the **Create Credentials** button.&#x20;

<figure><img src="/files/OcYZ2GCddI2AEUc9ZfBH" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}
From the dropdown menu, select the option **OAuth Client ID**.

<figure><img src="/files/FsmqiBddxlGEsJTGxSPY" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}
On the opened page:

* choose  the application type as **Web Application**;
* give a **name** to it (eg, *Google Classroom for MS LMS*)
* click on the **Add URI** button on the **Authorized redirect URIs** section

<figure><img src="/files/tAB3bfXkHt4aXXQGijIH" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}
Now we have to get the Redirect URI from MasterStudy LMS. Go back to the admin panel of your website, and follow **WP Dashboard > MS LMS > Addons > Google Classroom** and click on the :gear: gear icon. It opens the addon settings.

<figure><img src="/files/nHpbaEiZqhgrVY3WY9Gc" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}
At the top of the opened page, you will find the Redirect URI Link. Kindly copy it:

<figure><img src="/files/9tvox4cNzdqolGZKhSqW" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}
Paste this link to the designated area and click on the **Create** button:

<figure><img src="/files/9JlprESqvPwTWfM30JYl" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Usually, it will take several seconds to process. However, it may take 5 minutes to a few hours forthe  settings to take effect
{% endhint %}
{% endstep %}

{% step %}
The following messages confirm that you have created the **OAuth Client** successfully. You can see the **Client ID** and **Secret key** here as well:

<figure><img src="/files/eRftvAeMNhzhvYx2dgWA" alt=""><figcaption></figcaption></figure>

Later you can find this key in the same (Credentials) page by following this:

<figure><img src="/files/2bXBdOQbCoAx9IXuIqx6" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}

### Download the JSON File

Now we have to download the **JSON** file of our **OAuth Client**. Click on the **download** :arrow\_down: button to do it:

<figure><img src="/files/u2AGaD8sOlbz7KlTld2L" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}
Now API for the Google Classroom service should be enabled. Find the Library menu on the **APIs & Services:**.

<figure><img src="/files/8vymNrVas6LXWy0vPSmC" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}
Using the search bar, search for the **Google Classroom** and choose it:

<figure><img src="/files/Bk0DbZ5uPKwwyVto2B0p" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}
Click on the Enable button to enable it:

<figure><img src="/files/mOnbyM9ViFgekTFHIEWo" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
That's it. We have successfully obtained our working credentials to use for **Google Classroom.**
{% endhint %}
{% endstep %}
{% endstepper %}

## Importing Google Classrooms <a href="#importing-google-classrooms" id="importing-google-classrooms"></a>

Importing existing Google Classrooms is also a straightforward action.

{% stepper %}
{% step %}
Follow **WP Dashboard > Classrooms> Import Classrooms** and upload the [**downloaded JSON file**](https://docs.stylemixthemes.com/masterstudy-lms/lms-pro-addons/google-classroom#download-the-json-file)**,** then click on the **Load Credentials** button:

<figure><img src="/files/GakvHNDZMzlaOpXFKf1O" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}
Now, we need to get an access token. Click on the **Get Access Token** button. You will be offered to select the needed profile in the popup window. Sign in to move to your app and you will be redirected back to the **Import Classrooms** page.&#x20;

<figure><img src="/files/OfxFxAU7yk6VsfVOycWT" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}
Now you can see all the classes available in your Google account. You can import all classes or select just several and publish them.

<figure><img src="/files/bUzKuUW7psFilWPV6yvV" alt=""><figcaption></figcaption></figure>
{% endstep %}
{% endstepper %}

Once the classrooms are imported and published, you can see them on the Google Classroom Archive Page:

<figure><img src="/files/KdR7AfUrmqEIRFDzwV5l" alt=""><figcaption></figcaption></figure>

Students can find the course codes to enter the required class.

<figure><img src="/files/oQbe1mbFkznAnmzSuA02" alt=""><figcaption><p>Google Clasroom Page</p></figcaption></figure>

## Addon Settings <a href="#googleclassroom-enablingpopup" id="googleclassroom-enablingpopup"></a>

You can find the addon settings in the [Imported Classrooms ](#user-content-fn-1)[^1]page:

<figure><img src="/files/enRrkvLmwqKS9VYbbdhS" alt=""><figcaption></figcaption></figure>

* **Only signed-in students will see the code** - enable this option so that only students who are signed in will see the Google Classroom code

### Enabling Popup <a href="#googleclassroom-enablingpopup" id="googleclassroom-enablingpopup"></a>

This setting lets you display a modal pop-up notice about the available Google Classrooms on your website when users visit. It occurs only on the first visit.&#x20;

<figure><img src="/files/EdxoadKwkHCe1zv9521F" alt=""><figcaption></figcaption></figure>

Here are the available settings:

* **Popup Title** - provide a title for the pop-up.
* **Popup Editor** - write down the brief description of the classrooms feature and describe why they are necessary. You can write whatever you want and design it using the special text editor.
* **Popup Image** - indicate the image that will be used to display on the pop-up. Once the user clicks on the image, it brings users to the special page that you specified.
* **Google Classrooms page** - indicate the URL of the page that users will be directed to by clicking the Pop-up Image. You can also use the link on the classes page on your Google Classroom account.

## Google Clasroom Elementor Widget

You can customize the Google Classroom page using the special widget for Elementor.&#x20;

{% stepper %}
{% step %}
that Open the page that you want to specify as a Google Classroom page using Elementor:

<figure><img src="/files/9COsBhaXxrRkc8R4TDTo" alt=""><figcaption><p>WP Dashborad > Pages > All Pages > Edit with Elementor</p></figcaption></figure>
{% endstep %}

{% step %}
Search for '**Google Classrooms**' and add the widget to the desired place according to your needs:

<figure><img src="/files/xOayM5kKm5TgFOHCqGAE" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}
You can provide the title for the Grid and indicate the number of the items (classes) need to be displayed:

<figure><img src="/files/ARs8SIRDymflI9cBi4qV" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}
Once you finished, you can publish/update the page:

<figure><img src="/files/Hhs70XZFlvHhsl9m6gkF" alt=""><figcaption></figcaption></figure>
{% endstep %}
{% endstepper %}

[^1]: WP Dashboard > Classrooms > Importeed Classrooms


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.stylemixthemes.com/masterstudy-lms/lms-pro-addons/google-classroom.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
