Kevinleary.net, LLC.

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="https://wsrv.nl/?url=www.kevinleary.net/wp-content/uploads/wordpress-logo.png&w=900&q=80&output=webp&maxage=356d&dpr=2" alt="WordPress logo on white" width="275" height="275" /></a><em>Lorem ipsum dolor sit amet</em>, consectetuer adipiscing elit. Curabitur quam augue, vehicula quis, tincidunt vel, varius vitae, nulla. Sed convallis orci. Duis libero orci, pretium a, <a href="#">convallis quis</a>, pellentesque a, dolor. Curabitur vitae <strong>nisi non dolor vestibulum</strong> consequat.
<blockquote>Proin vestibulum. Ut ligula. Nullam sed dolor id odio volutpat pulvinar. Integer a leo. In et eros at neque pretium sagittis. Sed sodales lorem a ipsum suscipit gravida. Ut fringilla placerat arcu. Phasellus imperdiet. Mauris ac justo et turpis pharetra vulputate.</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>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur quam augue, vehicula quis, tincidunt vel, varius vitae, nulla. Sed convallis orci.</p>
<h3>An Unordered List</h3>
<ul>
  <li>Vestibulum in mauris semper tortor interdum ultrices.</li>
  <li>Sed vel lorem et justo laoreet bibendum. Donec dictum.</li>
  <li>Etiam massa libero, lacinia at, commodo in, tincidunt a, purus.</li>
  <li>Praesent volutpat eros quis enim blandit tincidunt.</li>
  <li>Aenean eu libero nec lectus ultricies laoreet. Donec rutrum, nisi vel egestas ultrices, ipsum urna sagittis libero, vitae vestibulum dui dolor vel velit.</li>
</ul>
<h4>Heading 4 followed by an ordered list</h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur quam augue, vehicula quis, tincidunt vel, varius vitae, nulla. Sed convallis orci.</p>
<h3>Image with no alignment</h3>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur quam augue, vehicula quis, tincidunt vel, varius vitae, nulla. Sed convallis orci.</p>
<a href="https://www.kevinleary.net" title="WordPress Theme Development"><img class="size-full alignnone" src="https://wsrv.nl/?url=www.kevinleary.net/wp-content/uploads/wordpress-logo.png&w=900&q=80&output=webp&maxage=356d&dpr=2" alt="WordPress logo on white" width="275" height="275" /></a>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur quam augue, vehicula quis, tincidunt vel, varius vitae, nulla. Sed convallis orci.</p>
<a href="https://www.kevinleary.net" title="WordPress Theme Development"><img class="size-full alignleft" src="https://wsrv.nl/?url=www.kevinleary.net/wp-content/uploads/wordpress-logo.png&w=900&q=80&output=webp&maxage=356d&dpr=2" alt="WordPress logo on white" width="275" height="275" /></a>Nulla sagittis convallis arcu. Sed sed nunc. Curabitur consequat. Quisque metus enim, venenatis fermentum, mollis in, porta et, nibh. Duis vulputate elit in elit. Mauris dictum libero id justo. Fusce in est. Sed nec diam. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Quisque semper nibh eget nibh. Sed tempor. Fusce erat.
<h3>An Ordered List</h3>
<ol>
  <li>Vestibulum in mauris semper tortor interdum ultrices.</li>
  <li>Sed vel lorem et justo laoreet bibendum. Donec dictum.</li>
  <li>Etiam massa libero, lacinia at, commodo in, tincidunt a, purus.</li>
  <li>Praesent volutpat eros quis enim blandit tincidunt.</li>
  <li>Aenean eu libero nec lectus ultricies laoreet. Donec rutrum, nisi vel egestas ultrices, ipsum urna sagittis libero, vitae vestibulum dui dolor vel velit.</li>
</ol>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur quam augue, vehicula quis, tincidunt vel, varius vitae, nulla. Sed convallis orci. 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 whiteLorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur quam augue, vehicula quis, tincidunt vel, varius vitae, nulla. Sed convallis orci. Duis libero orci, pretium a, convallis quis, pellentesque a, dolor. Curabitur vitae nisi non dolor vestibulum consequat.

Proin vestibulum. Ut ligula. Nullam sed dolor id odio volutpat pulvinar. Integer a leo. In et eros at neque pretium sagittis. Sed sodales lorem a ipsum suscipit gravida. Ut fringilla placerat arcu. Phasellus imperdiet. Mauris ac justo et turpis pharetra vulputate.

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

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur quam augue, vehicula quis, tincidunt vel, varius vitae, nulla. Sed convallis orci.

An Unordered List

  • Vestibulum in mauris semper tortor interdum ultrices.
  • Sed vel lorem et justo laoreet bibendum. Donec dictum.
  • Etiam massa libero, lacinia at, commodo in, tincidunt a, purus.
  • Praesent volutpat eros quis enim blandit tincidunt.
  • Aenean eu libero nec lectus ultricies laoreet. Donec rutrum, nisi vel egestas ultrices, ipsum urna sagittis libero, vitae vestibulum dui dolor vel velit.

Heading 4 followed by an ordered list

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur quam augue, vehicula quis, tincidunt vel, varius vitae, nulla. Sed convallis orci.

Image with no alignment

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur quam augue, vehicula quis, tincidunt vel, varius vitae, nulla. Sed convallis orci.

WordPress logo on white

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur quam augue, vehicula quis, tincidunt vel, varius vitae, nulla. Sed convallis orci.

WordPress logo on whiteNulla sagittis convallis arcu. Sed sed nunc. Curabitur consequat. Quisque metus enim, venenatis fermentum, mollis in, porta et, nibh. Duis vulputate elit in elit. Mauris dictum libero id justo. Fusce in est. Sed nec diam. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Quisque semper nibh eget nibh. Sed tempor. Fusce erat.

An Ordered List

  1. Vestibulum in mauris semper tortor interdum ultrices.
  2. Sed vel lorem et justo laoreet bibendum. Donec dictum.
  3. Etiam massa libero, lacinia at, commodo in, tincidunt a, purus.
  4. Praesent volutpat eros quis enim blandit tincidunt.
  5. Aenean eu libero nec lectus ultricies laoreet. Donec rutrum, nisi vel egestas ultrices, ipsum urna sagittis libero, vitae vestibulum dui dolor vel velit.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur quam augue, vehicula quis, tincidunt vel, varius vitae, nulla. Sed convallis orci. Duis libero orci, pretium a, convallis quis, pellentesque a, dolor. Curabitur vitae nisi non dolor vestibulum consequat.

Video embed example

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, WordPress Consultant

I'm a freelance web developer and WordPress consultant in Boston, MA with 16 years of experience building websites and applications. View a portfolio of my work or request an estimate for your next project.