Rich Tabor

<h3>Comments that only render in the block editor</h3>
<p>I honestly enjoy drafting articles either locally in Ulysses, or on <a href="https://richtabor.com" rel="nofollow ugc">my blog</a> using the <a href="https://useiceberg.com/?utm_source=wp-org&utm_medium=markdown-comment-block&utm_campaign=readme-description" rel="nofollow ugc">Iceberg Editor</a>. While I do love Iceberg, once I publish an article I typically bring back the default Gutenberg experience — thus removing any comments I previously added.</p>
<p>Having the ability to add, and keep, any relevant editing comments within my posts, without rendering them on the front-end, means that I am freed up to mentally jot any idea down without thinking about it. It is simply natural and convenient.</p>
<p><a href="https://richtabor.com/markdown-comments/?utm_source=wp-org&utm_medium=markdown-comment-block&utm_campaign=readme-learnmore" rel="nofollow ugc">Learn more about Markdown Comment →</a></p>
<h3>What’s interesting about Markdown Comment:</h3>
<h4>1. Editor only</h4>
<p>The block only renders within the editor. For developers reading this, that means there’s no save function. I don’t want my unfinished ideas, reminders, and notes rendered within my post – even if they’re hidden by CSS.</p>
<h4>2. Helpful block transforms</h4>
<p>I added a couple transforms, to and from headings and paragraphs, and a raw shortcut when you type <code>%%</code> and hit the [space] key. This lets me quickly add comments, and even convert whole paragraphs or headings to a comment.</p>
<h4>3. Easily resolve comments</h4>
<p>To support that path towards simplicity, I wanted a method to quickly resolve — i.e. banish — a comment entirely. So, I added a toolbar control to quickly resolve the comment, removing the block entirely.</p>
<h4>4. No rich text support</h4>
<p>Comments need to have minimal impact on editing, and feel as natural as possible. That’s why there are no typical RichText controls (although you can still bold, italicize and add hyperlinks). And while you <em>can</em> change the color of the comment — there are no other typographic controls.</p>
<h4>5. Entirely CSS Variable ready</h4>
<p>Global styles and full site editing are opening the door for themes to be heavily powered by CSS variables. Blocks should be designed with that same mentality, which is exactly what I did here. I added simple CSS variables with fallbacks that are the default values. To further theme the comment, there’s no need to override any styles with classes, just write a few CSS variables.</p>


Markdown Comment Block

Add markdown inspired comments to posts that render only within the block editor.

mitchmac

<p>The plugin creates zip files containing posts converted to Markdown. A WP-CLI command exists to handle exporting sites with a large amount of content.</p>
<ul>
<li>Move WordPress content to Gatsby-friendly Markdown.</li>
<li>Customize the export! Remap and restructure exported fields.</li>
<li>CLI: Avoid PHP timeouts by using the command line with WP-CLI.</li>
<li>CLI: Export progress bar (great for large sites)!</li>
</ul>
<blockquote>
<p>Reminder: always keep a backup of the WordPress database and files in case your export doesn’t work as expected!</p>
</blockquote>
<h3>Working with Gatsby</h3>
<p>If you’re just getting started with Gatsby, we recommend experimenting with a Markdown based Gatsby starter like <a href="https://github.com/tinacms/tina-starter-grande" rel="nofollow ugc">Tina Grande</a>. Installation is as easy as:</p>
<pre><code>git clone https://github.com/tinacms/tina-starter-grande.git

cd tina-starter-grande

yarn install && gatsby develop
</code></pre>
<p>Then copy your exported WordPress Markdown into the <code>content</code> directory or point the wp gatsby-markdown-export command at the content directory.</p>
<p>Want to port your WordPress or HTML theme to Gatsby? Checkout <a href="https://www.gatsbyjs.org/docs/porting-an-html-site-to-gatsby/" rel="nofollow ugc">Porting an HTML Site to Gatsby</a> for tips.</p>
<h3>Command Line Usage</h3>
<p>The command line functionality uses WP-CLI to interact with WordPress. <a href="https://wp-cli.org/#installing" rel="nofollow ugc">WP-CLI is easy to install</a> if you haven’t already.</p>
<p>Once it’s installed, you can export content to a directory like this:</p>
<pre><code>wp gatsby-markdown-export --directory=/example/gatsby-starter/src/content
</code></pre>
<p>All CLI arguments are optional.</p>
<p>  Option<br />
  Description<br />
  Default value</p>
<p>  <code>--help</code><br />
  get help</p>
<p>  <code>--directory=</code><br />
  export output directory<br />
  random temp directory</p>
<p>  <code>--post_types=</code><br />
  post types to export, see: https://developer.wordpress.org/reference/classes/wp_query/#post-type-parameters<br />
  page,post</p>
<p>  <code>--post_status=</code><br />
  post status to export, see: https://developer.wordpress.org/reference/classes/wp_query/#status-parameters<br />
  any</p>
<p>  <code>--fields_to_markdown=</code><br />
  fields to convert to Markdown<br />
  excerpt</p>
<p>  <code>--excluded_front_matter=</code><br />
  fields to exclude from front matter</p>
<p>  <code>--post_date_format=</code><br />
  format for post publish date, see: https://www.php.net/manual/en/function.date.php<br />
  c</p>
<p>  <code>--upload_dir=</code><br />
  directory in the export to copy WordPress uploads<br />
  uploads</p>
<p>  <code>--remap_fields=</code><br />
  remap front matter field names, example: find1,replace1;find2,replace2</p>
<p>  <code>--fields_to_array=</code><br />
  convert single value front matter fields to arrays</p>
<p>  <code>--include_private_fields=</code><br />
  private post meta fields to include (they start with _)</p>
<p>  <code>--skip_copy_uploads</code><br />
  flag, skips copying WordPress uploads to the export</p>
<p>  <code>--skip_original_images</code><br />
  flag, skips the use of original dimension images</p>
<p>  <code>--skip_enforce_charset</code><br />
  flag, skips use of blog_charset for the XML charset</p>
<p>  <code>--create_type_directory</code><br />
  flag, creates directories based on post type</p>


WP Gatsby Markdown Exporter

Export WordPress content to Markdown for GatsbyJS.

Markdown Comment Block vs WP Gatsby Markdown Exporter