MDX Full Demo: Text, Images, Headings & YouTube

11/26/2025

A complete MDX example showing images, headings, YouTube embeds, and styling.

Welcome to a full MDX test post!
This file demonstrates paragraphs, headings, emphasis, images, and embedded YouTube video content.
Use it to confirm your blog styling and rendering are correct.


🌟 Section One: Text & Formatting

This is a normal paragraph. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Fusce viverra urna at tortor varius, sed dignissim elit tempor. Suspendisse potenti.

Another paragraph for spacing.
Donec accumsan velit vitae augue eleifend, at congue nulla volutpat.

🔹 Subheading Example (H3)

This H3 heading should render visually smaller than the H2 above it.
If both look identical, your typography or Tailwind prose styles need adjusting.

  • Bullet list item
  • Another point
  • Final item

🖼️ Section Two: Images

Below you’ll find two images referenced from the /public/images/ folder.

Make sure you create these files:
public/images/art1.png
public/images/art2.png

Image 1 (Markdown)

Classroom Example

Image 2 (HTML + Caption)

Whiteboard Notes

A whiteboard snapshot showing ideas for the next lesson plan.


🎬 Section Three: YouTube Video Embed

Here is a real YouTube embed using safe MDX-friendly <iframe> HTML:

Feel free to swap the video URL with any other video you want to feature.


✅ Final Notes

If you can see:

  • Properly styled H2 and H3 headings
  • Two images displayed correctly
  • A YouTube player
  • Clean paragraph spacing
  • No MDX errors

…then your MDX blog is fully functional! 🎉

You can now use this as a template for all future posts.