Smart Components inside WordPress

Experiment

My initial goal was to get a one-on-one integration of WordPress Blocks inside Google Docs, unfortunately this is not possible as WordPress Blocks are mostly generated client side via javascript.

Proof of Concept

I’ve created a Proof of Concept that:

1. Retrieves blocks from the BlockRegistry based on an allow list
2. They’re converted to a Smart Components friendly format
3. When a document is published, the components are converted back into HTML

Important Notes

• The WordPress Plugin uses TREE_PANTHEON_V2 and the PCC SDK is converting Google Docs to HTML resulting in without type and id attributes
• In this POC, I’m making extra calls to the API to retrieve the type and ID data so we can generate the correct blocks
• Document preview fails after a few seconds
• Experiments branch is mostly isolated from the rest of the codebase

Let’s add an Embed here:

And we’ll have a Pull Quote:

And then a normal Quote:

Does code block work as well?

<?php $var = "test"; ?>

Introduction

This section provides an overview of the document’s purpose. The Pantheon Publisher Plugin facilitates the seamless transfer of content from Google Docs to a WordPress site. This test document will help us verify the plugin’s capabilities in handling different types of content and formatting.

Headings

The following are examples of different heading levels:

Heading 3

Heading 4

Heading 5

Heading 6

Paragraphs and Text Formatting

This is a standard paragraph of text. It demonstrates the default text styling. We can also include bold text, italicized text, and ~~strikethrough text~~ within a paragraph.

Lists

Here are examples of unordered and ordered lists:

Unordered List

• Item 1
• Item 2
  • Nested Item 2.1
  • Nested Item 2.2
• Item 3

Ordered List

1. First item
2. Second item
   1. Sub-item A
   2. Sub-item B

1. Third item

Tables

This table demonstrates how tabular data is rendered.

Images

This is an example of an image embedded within the document. It is crucial to ensure that images are correctly transferred and displayed in the WordPress post.

Placeholders

This section includes various placeholders to demonstrate their usage within a document intended for the Pantheon Publisher Plugin.

• Date Placeholder: This document was last updated on .
• Person Placeholder: The primary author of this document is .
• File Placeholder: Additional documentation can be found in .
• Calendar Event Placeholder: We have scheduled a review meeting for this post, you can find the event here: .
• Location Placeholder: The next meeting regarding this plugin will be held at .

Conclusion

This test document provides a comprehensive set of elements to evaluate the Pantheon Publisher Plugin’s functionality. By publishing this document, we can verify that all formatting, images, and placeholders are correctly interpreted and displayed on the WordPress site.