Blog Formatting Guide

This post demonstrates all the formatting options available when writing blog posts for Cheer Data. You can use standard Markdown syntax as well as custom MDX components.

Typography

Headings

You can use headings from h1 to h6:

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Text Formatting

You can make text bold, italic, bold and italic, strikethrough, or inline code.

You can also create links to other pages and automatically format URLs: https://cheerdata.com

Lists

Unordered Lists

• Item 1
• Item 2
  • Nested item 2.1
  • Nested item 2.2
• Item 3

Ordered Lists

1. First item
2. Second item
   1. Nested item 2.1
   2. Nested item 2.2
3. Third item

Task Lists

• Completed task
• Incomplete task
• Another incomplete task

Code Blocks

You can include inline code or create code blocks with syntax highlighting:

// JavaScript example
function calculateScore(rawScore, deductions) {
  return Math.max(0, rawScore - deductions);
}

const finalScore = calculateScore(95.5, 2.0);
console.log(`Final Score: ${finalScore}`);

// TypeScript example
interface Performance {
  teamId: string;
  score: number;
  placement: number;
}

const performance: Performance = {
  teamId: "123",
  score: 93.5,
  placement: 1
};

# Python example
def calculate_score(raw_score, deductions):
    return max(0, raw_score - deductions)

final_score = calculate_score(95.5, 2.0)
print(f"Final Score: {final_score}")

Blockquotes

This is a blockquote. You can use it to highlight important information or quote text from other sources.

Blockquotes can span multiple lines and paragraphs.

Tables

Team Name	Division	Score	Placement
Cheer Athletics Panthers	L6	98.5	1st
Top Gun TGLC	L6	97.8	2nd
Prodigy Black Ops	L6	96.2	3rd

Horizontal Rules

You can create horizontal dividers with three or more hyphens:

---

Images

You can embed images with alt text:

Custom MDX Components

In addition to standard Markdown, you can use custom React components:

Alert Component

Card Component

Badge Component

You can use badges for labels and tags: Featured Tutorial Advanced

Button Component

Click Me Secondary Action

Combining Components

You can combine multiple components together:

Best Practices

1. Use headings hierarchically - Start with h2 (##) for main sections, h3 (###) for subsections
2. Add alt text to images - Improves accessibility and SEO
3. Use code blocks for code - Enables syntax highlighting and better readability
4. Choose the right component - Use alerts for important notes, cards for grouping related content
5. Keep paragraphs concise - Break up long text into smaller, digestible chunks

Conclusion

This guide covers all the formatting options available in Cheer Data blog posts. Mix and match these elements to create engaging, well-formatted content that's easy to read and understand.

Happy writing! 🎉