Hyperflow Google Docs

Embed Google document content directly in your Webflow page, with its original formatting.

PRODUCTION RELEASE.

Learn more about this product on the product page. Part of hf-google-doc.

Features

Embed any public google doc directly into your Webflow-hosted site page
Modify the Google doc at any time
Preserve the exact Google doc styling
Fully part of the page, fully SEO-able
Does well with responsiveness

Use Cases

Include a current specials sheet or securely edited Google
Include content that Webflow cannot format well;
- Tables

Feature Roadmap

Feature	Current	Planned	Possible
Multiple Doc Embeds	No	Yes	Fully independent configs, including caching
Caching	Basic, fixed 5 mins	Configurable length	Global fully configurable part caching, i.e. transformed content only by element, so different docs can have different cache settings
Styling	Matches Google Doc exactly; Headings, paragraphs Font family, color, and highlight color Images Complex layouts Tables Smart embeds Links	Strip-style mode, apply a richtext class and use Webflow richtext elements. Implementation uses a rich text element as the styling base, and then replaces the sub-elements with a translation of Google Docs elements P, H1, H2, etc.	Strips only from Webflow-supported elements, others are still carry original style classes to prevent breakage, e.g. tables


Partial Embeds	No, full doc only		Considering
ToC			Utilize built-in header ID's for ToC purposes Prefix IDs Could auto-apply FS ToC classes?
Google Document Access	Must be shared as "viewable by anyone with the link"		May consider direct API access, for private docs.

Feature

Current

Planned

Possible

Multiple Doc Embeds

Yes

Fully independent configs, including caching

Caching

Basic, fixed 5 mins

Configurable length

Global
fully configurable
part caching, i.e. transformed content only
by element, so different docs can have different cache settings

Styling

Matches Google Doc exactly;

Headings, paragraphs
Font family, color, and highlight color
Images
Complex layouts
Tables
Smart embeds
Links

Strip-style mode, apply a richtext class and use Webflow richtext elements. Implementation uses a rich text element as the styling base, and then replaces the sub-elements with a translation of Google Docs elements P, H1, H2, etc.

Strips only from Webflow-supported elements, others are still carry original style classes to prevent breakage, e.g. tables

Partial Embeds

No, full doc only

Considering

ToC

Utilize built-in header ID's for ToC purposes
Prefix IDs
Could auto-apply FS ToC classes?

Google Document Access

Must be shared as "viewable by anyone with the link"

May consider direct API access, for private docs.

Setup notes

Setup the page with hf-google-doc
In pages with this handler, drop an HTML embed with this content.
- Use your own Google doc ID
  - Make sure your Google doc is accessible to anyone with the link

<script type="hyperflow/google-doc"
  data-google-doc-id="1_t3yiiYHYM6Q5mGbb2piaq3QedOCo3XC12QhHnmd7q8"
  ></script>

Last updated 2 months ago