Markdown Syntax
Detailed explanation of Markdown syntax available in AutoSlideIdea.
Basic Syntax
Headings
# Heading 1 (Slide Title)
## Heading 2 (Subtitle)
### Heading 3
#### Heading 4
Text Formatting
**Bold**
*Italic*
***Bold Italic***
~~Strikethrough~~
`Inline code`
Lists
Bullet Lists
- Item 1
- Item 2
- Sub-item 2.1
- Sub-item 2.2
- Item 3
* Alternative syntax
+ Also works
Numbered Lists
1. First item
2. Next item
1. Sub-item
2. Sub-item
3. Last item
Links and Images
# Links
[AutoSlideIdea](https://github.com/dobachi/AutoSlideIdea)
# Images

# Image sizing



Code Blocks
Basic Code Blocks
```javascript
function fibonacci(n) {
if (n <= 1) return n;
return fibonacci(n - 1) + fibonacci(n - 2);
}
```
```python
def fibonacci(n):
if n <= 1:
return n
return fibonacci(n - 1) + fibonacci(n - 2)
```
Supported Languages for Syntax Highlighting
- JavaScript/TypeScript
- Python
- Java
- C/C++
- Go
- Rust
- Ruby
- PHP
- Shell/Bash
- And many more
Tables
| Header 1 | Header 2 | Header 3 |
|----------|----------|----------|
| Cell 1 | Cell 2 | Cell 3 |
| Cell 4 | Cell 5 | Cell 6 |
# Alignment
| Left | Center | Right |
|:-----|:------:|------:|
| Left | Center | Right |
Blockquotes
> This is a blockquote
> Multi-line quotes are supported
>
> > Nested quotes
> > Work like this
Math Formulas (LaTeX)
# Inline math
$E = mc^2$
# Block math
$$
\frac{-b \pm \sqrt{b^2 - 4ac}}{2a}
$$
Marp Directives
Slide Settings
---
marp: true
theme: default
paginate: true
size: 16:9
header: 'AutoSlideIdea Demo'
footer: '© 2024'
---
Background Images
<!-- _backgroundImage: url('assets/background.jpg') -->
<!-- _backgroundColor: #f0f0f0 -->
Slide-specific Classes
<!-- _class: lead -->
# Large Title
<!-- _class: invert -->
# Inverted Color Slide
Advanced Layouts
Two-Column Layout
<div class="columns">
<div>
## Left Content
- Point 1
- Point 2
- Point 3
</div>
<div>
## Right Content

</div>
</div>
Centering
<!-- _class: center -->
# Centered Slide
All content is centered
Best Practices
1. Information Per Slide
- One message per slide
- 3-5 bullet points maximum
- Maintain adequate white space
2. Visual Hierarchy
# Main Message
## Sub-point 1
Detailed explanation...
## Sub-point 2
Detailed explanation...
3. Code Display
- Show only essential parts
- Keep to 10-15 lines
- Use syntax highlighting
4. Image Usage
- Use high-resolution images
- Compress file sizes appropriately
- Always include alt text
Troubleshooting
Escaping Special Characters
\# This is not a heading
\* This is not a list
\\ Backslash itself
Direct HTML
<span style="color: red;">Red text</span>
<div style="text-align: center;">Centered</div>