Foodie Style Sample Post: Explore Flavor, Photos & Tips

Above this paragraph should be the H1 heading for your web page. Do not use H1 within your blog post area.

In this sample content you’ll find common HTML, XHTML and CSS elements typically used in a WordPress theme.

This is the H2 Heading

Use H2 headings to divide major sections of your post. They help readers and search engines scan your content and identify keyword-rich sections. Start with H2, and if you need to subdivide further, use H3 headings.

This is the H3 Heading

H3 headings are useful for breaking content into smaller subsections. Readers and search engines often scan headings first, then read the paragraphs that interest them. For guidance on writing SEO-friendly copy, consult reputable resources on SEO copywriting techniques.

Links in your content can be styled distinctively. You can set the default link color and adjust typography and other color options through your theme customizer.

This is the H4 Heading

Below the H4 heading we’ll show how post content typically looks. Posts are composed of multiple paragraphs, lists, images and other elements. Adjust spacing between paragraphs to achieve the visual rhythm you want.

Paragraphs can hold text and other inline elements to reinforce your message. A few common list types are:

  • Unordered lists using the
      tag
  • Ordered lists using the
      tag
  • Definition lists using the
    tag

    • Definition lists use two other tags:
      • declares the term or phrase to be defined, often styled in bold
      • provides the definition, usually indented and in a normal or slightly smaller font
  • And that’s the end of the lists

This demonstrates a paragraph before and after a nested list so you can see how three levels of list nesting render. Style each level to match your design—use default bullets, circles, or custom graphic bullets as needed.

This is the H5 Heading

H5 headings are less common but useful if you need additional subheading levels beneath H3 or H4. They provide flexibility when you require one or two deeper levels of structure.

Next we’ll show ordered lists and how images and other styles integrate in a post.

  1. Do this first.
  2. Do this second.
    • You could do something in between.
    • Or try this alternative.
  3. Finally, do this third.

Another paragraph demonstrates relationships between different content blocks and helps visualize spacing and flow.

This is another H3 Heading

img 1266 2Images in a post can be aligned to the right, left, or centered. Food bloggers often prefer full-width centered images, but left and right alignments are useful for flowing text around images. This example uses a medium-sized image aligned to the right. To prevent layout issues below floated images, you can clear the float so subsequent content aligns properly.

img 1266 3This image uses the medium size and is aligned to the left. Notice the padding around the image—your theme stylesheet should provide appropriate spacing so text doesn’t crowd the image.

img 1266 4

Centered images are placed between text blocks and typically push text above and below. For food and lifestyle blogs, full-width centered images often create the most visual impact.

Instructions for adding CSS styles for images are available in WordPress documentation about using images.

Testing Font Looks – H3 Heading

Test how different font styles render in your theme. For example, bold, italic, and bold-italic should display distinctly. Use the code tag for inline code snippets. Below is an example of the preformatted tag that preserves spacing and line breaks:

This is the pre tag.
It should be formatted as written
     so if you add spaces to the front of the line
  it will show the spaces and the  as written

Return to normal paragraph styling to verify margins and padding around each element so the layout remains consistent and readable.

Your CSS Here – H3 Heading

Blockquotes are commonly used to highlight quoted text from another source. They should be visually distinct but not overpowering. Here is a simple example:

This is a simple quote. It is either preceded or followed by a link to the credited source. A blockquote should be styled to separate it from the main text so readers know it’s a quotation.

Each site will have its own look and feel for content elements. If your design includes callout boxes, side notes, or other components, add them to your sample content to confirm how they appear within the overall page layout.

Some theme elements are controlled by the stylesheet, while others rely on template files. Start by implementing as much as possible in the stylesheet, and only modify template files if necessary.

Keep in mind that changes to a theme’s stylesheet and template files won’t carry over if you switch themes. To preserve customizations, copy them into the new theme folder when you change themes.