WordPress Sample  Content

Sample page content for testing CSS against the HTML output of the WordPress TinyMCE editor.

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="/wp-content/uploads/wordpress-logo.png" 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

WordPress logo on whiteLovely 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.

Meet the Author

Kevin Leary, Custom WordPress Developer & BigQuery Consultant

I'm a custom WordPress developer and BigQuery consultant based in Boston, MA. I've been an independent freelance contractor for the last 16 years, helping business build, grow and maintain product websites, web applications and analytics systems. See real-world examples of my work, or contact me about your next project if you're in need of a good freelance developer.

Related Articles