---
title: How to Add Google Drive Files with the Block Editor (Gutenberg)
description: "If you're looking for a simple way to **show your Google Drive files on a page built with the WordPress block editor**, you're in the right place. You can easily do this with **DriveHub**. DriveHub adds its own **DriveHub Module**…"
url: "https://sovlix.com/docs/how-to-add-google-drive-files-with-the-block-editor-gutenberg/"
updated: "2026-10-07"
category: DriveHub / Page Builder Integration
---

# How to Add Google Drive Files with the Block Editor (Gutenberg)

If you're looking for a simple way to **show your Google Drive files on a page built with the WordPress block editor**, you're in the right place. You can easily do this with **DriveHub**.

DriveHub adds its own **DriveHub Module** block, so you can drop a gallery, a file list or an embedded document into any page or post without copying shortcodes around.

Here is an easy, step-by-step guide to help you set it all up!

## Step 1: Install DriveHub and Connect Google Drive

First, make sure DriveHub is installed and your Google account is connected:

- From your WordPress admin, click on **Plugins** > **Add New**.
- Search for **DriveHub**.
- Click **Install** and then **Activate**.
- Follow the setup screen to add your Google account.

[![Search for DriveHub in Add Plugins, then click Install Now and Activate](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-00-install-drivehub.webp)](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-00-install-drivehub.webp)

Read our [step by step setup guide](https://sovlix.com/docs/drivehub-manual-google-drive-connection-setup-guide/) to avoid any confusion.

## Step 2: Check That the Block Editor Integration Is On

The DriveHub block only shows up when the block editor integration is turned on. It is on by default, but it is worth checking:

- Go to **DriveHub** > **Integrations**.
- Find the **Block editor** card under **Editors and page builders**.
- Make sure the switch is on and the card says **Active**.
- If you turned it on just now, click **Save changes** in the bar at the bottom of the screen.

[![The Block editor card on the DriveHub Integrations page](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-01-enable-block-editor.webp)](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-01-enable-block-editor.webp)

## Step 3: Create a Page and Open the Block Inserter

Now open the page where you want to show your Google Drive files:

- Go to **Pages** > **Add Page**, or open an existing page or post.
- Give your page a title (for example, **Client Gallery**).
- Click the **+** button at the top left to open the block inserter.

[![Opening the block inserter in the WordPress block editor](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-02-open-block-inserter.webp)](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-02-open-block-inserter.webp)

## Step 4: Add the DriveHub Module Block

Next, find the DriveHub block and add it to your page:

- In the search box, type **DriveHub**.
- Click on the **DriveHub Module** block.

[![Searching for the DriveHub Module block in the inserter](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-03-search-drivehub-block.webp)](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-03-search-drivehub-block.webp)

**Tip:** You can also find the block under its own **DriveHub** category in the inserter, or type `/drivehub` in an empty paragraph.

## Step 5: Choose a Module

The block now shows two choices: **Insert Existing Module** or **Create New Module**.

- To use a module you have already built, click on **Select Module**.
- To build a new one, click on **+ Add New Module** instead, then click **Add module** in the window that opens.

[![The DriveHub Module block with the Select Module button](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-04-select-module.webp)](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-04-select-module.webp)

The **Insert DriveHub Module** window opens with a list of your modules:

- Find the module you want (we'll use the **Studio Photo Gallery** gallery module).
- Click on **Insert module** next to it.

[![Choosing the Studio Photo Gallery module in the Insert DriveHub Module window](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-05-insert-module.webp)](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-05-insert-module.webp)

**Note:** The free version of DriveHub lets you insert **Gallery**, **List** and **Embed Documents** modules with this block.

## Step 6: Check the Module in the Editor

The block now shows the module type and name, so you always know what is on the page:

- The block card shows a **Gallery** badge and the module name, **Studio Photo Gallery**.
- To pick a different module, click on **Change**.
- In the right sidebar, under **DriveHub Module**, you can also switch modules from the **Module** field, or click **Configure / Add New** to open the module window again.

[![The DriveHub Module block showing the selected gallery module](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-06-module-in-editor.webp)](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-06-module-in-editor.webp)

The editor shows a short summary of the module instead of the full gallery. Your visitors see the real gallery on the live page.

## Step 7: Publish Your Page

Once you're happy with the page, it's time to make it live:

- Click on **Publish** at the top right.
- Click **Publish** again in the panel that opens to confirm.

[![The Publish button in the block editor](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-07-publish-page.webp)](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-07-publish-page.webp)

And that's it. Your Google Drive files are now live on your page. Visitors now see the photos straight from your Google Drive, shown with the layout and options you set in the module.

[![The Studio Photo Gallery module on the live Client Gallery page](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-08-front-end-gallery.webp)](https://sovlix.com/wp-content/uploads/2026/10/drivehub-block-editor-08-front-end-gallery.webp)

## Benefits of Using DriveHub with the Block Editor

- **No shortcodes to copy:** Pick your module from a list right inside the editor.
- **Clear labels:** Each block shows the module type and name, so pages are easy to edit later.
- **Build on the spot:** Create a new module without leaving the page you are working on.
- **Save WordPress storage:** Your files stay in Google Drive instead of your Media Library.
- **Always up to date:** Change files in Google Drive and your page follows.

With **DriveHub** and the block editor, adding Google Drive files to a page takes just a few clicks.
