When you’re designing or developing a WordPress theme it’s important to provide the proper CSS styles for the various elements that the TinyMCE editor can output.

Use this sample WordPress content to quickly test out the way headings, lists, paragraphs, blockquotes, images page or post to test out the typographic styles of a theme.

<a href="https://www.kevinleary.net"><img class="size-full alignright" src="https://wsrv.nl?url=kevinleary.net/wp-content/uploads/wordpress-logo.png&w=940&q=80&output=webp&maxage=356d&dpr=2" alt="WordPress logo on white" width="275" height="275" /></a><em>Lovely italic text</em>, to emphasize something important. <a href="#">An inline link</a> to something else important <strong>and worth bolding text over</strong> for attention.
<blockquote>So valuable someone said something important about it</blockquote>
<p>Let's check out how our headings look when they bump up against one another.</p>
<h1>Level 1 Heading</h1>
<h2>Level 2 Heading</h2>
<h3>Level 3 Heading</h3>
<h4>Level 4 Heading</h4>
<h5>Level 5 Heading</h5>
<h6>Level 6 Heading</h6>
<p>Now let's look at how headings are spaced when preceded or followed with lists and paragraphs.</p>
<h2>Headin 2 followed by a paragraph</h2>
<p>An interesting paragraph you should consider reading a few times over.</p>
<h3>An Unordered List</h3>
<ul>
  <li>Something included in a good list</li>
  <li>Another thing</li>
  <li>A third thing to mention</li>
</ul>
<h4>Heading 4 followed by an ordered list</h4>
<p>An interesting paragraph you should consider reading a few times over.</p>
<h3>Image with no alignment</h3>
<p>An interesting paragraph you should consider reading a few times over.</p>
<h3>An Ordered List</h3>
<ol>
  <li>Something included in a good list</li>
  <li>Another thing</li>
  <li>A third thing to mention</li>
</ol>
<p>An interesting paragraph you should consider reading a few times over. Duis libero orci, pretium a, <a href="#">convallis quis</a>, pellentesque a, dolor. Curabitur vitae nisi non dolor vestibulum consequat.</p>

<h2>Video embed example</h2>
//vimeo.com/71185761

WordPress Sample Content in Action

Lovely italic text, to emphasize something important. An inline link to something else important and worth bolding text over for attention.

So valuable someone said something important about it

Let’s check out how our headings look when they bump up against one another.

Level 1 Heading

Level 2 Heading

Level 3 Heading

Level 4 Heading

Level 5 Heading

Level 6 Heading

Now let’s look at how headings are spaced when preceded or followed with lists and paragraphs.

Headin 2 followed by a paragraph

An interesting paragraph you should consider reading a few times over.

An Unordered List

• Something included in a good list
• Another thing
• A third thing to mention

Heading 4 followed by an ordered list

An interesting paragraph you should consider reading a few times over.

Image with no alignment

An interesting paragraph you should consider reading a few times over.

An Ordered List

1. Something included in a good list
2. Another thing
3. A third thing to mention

An interesting paragraph you should consider reading a few times over. Duis libero orci, pretium a, convallis quis, pellentesque a, dolor. Curabitur vitae nisi non dolor vestibulum consequat.

Video embed example

//vimeo.com/71185761

Summary

If you want a more robust method for testing go checkout the theme unit test on WordPress.org. WPCandy has also published a handy WordPress sample content XML import, which I’ve based this content sample on for my own use.