Introduction
A comprehensive guide to using typography styles and Markdown formatting in Mockline.
Overview
Mockline provides a rich set of typography styles that automatically enhance your Markdown content. These styles ensure consistent and beautiful text formatting across your documentation and content pages.
Basic Text Formatting
Headings
Headings help structure your content hierarchically:
# Heading 1
## Heading 2
### Heading 3
#### Heading 4
Renders as:
Heading 1
Heading 2
Heading 3
Heading 4
Text Emphasis
Various ways to emphasize your text:
Regular paragraph text.
**Bold text** for strong emphasis.
*Italic text* for subtle emphasis.
~~Strikethrough~~ for outdated content.
`inline code` for technical terms.
Renders as:
Regular paragraph text.
Bold text for strong emphasis.
Italic text for subtle emphasis.
Strikethrough for outdated content.
inline code
for technical terms.
Links
Create internal and external links:
[External link](https://mockline.dev)
[Internal link](/getting-started)
Link with [reference][ref] style
[ref]: https://mockline.dev
Renders as:
Link with [reference]ref style ref: https://mockline.dev
Lists
Unordered Lists
- First item
- Second item
- Nested item
- Another nested item
- Third item
Renders as:
- First item
- Second item
- Nested item
- Another nested item
- Third item
Ordered Lists
1. First step
2. Second step
1. Sub-step one
2. Sub-step two
3. Third step
Renders as:
- First step
- Second step
- Sub-step one
- Sub-step two
- Third step
Code
Inline Code
Use backticks for inline code: `const example = true`
Renders as: const example = true
Code Blocks
For multi-line code, use triple backticks with optional language specification:
```js
const greeting = 'Hello'
const target = 'World'
console.log(`${greeting}, ${target}!`)
```
Renders as:
const greeting = 'Hello'
const target = 'World'
console.log(`${greeting}, ${target}!`)
Quotes
Use blockquotes to highlight important information:
> This is a blockquote
> It can span multiple lines
>
> And contain multiple paragraphs
Renders as:
This is a blockquote It can span multiple lines
And contain multiple paragraphs
Best Practices
- Document Structure:
- Start each page with a single H1 heading
- Follow a logical heading hierarchy
- Keep content well-organized with appropriate sections
- Text Formatting:
- Use emphasis sparingly to maintain impact
- Choose appropriate heading levels for content hierarchy
- Keep paragraphs concise and focused
- Links and References:
- Use descriptive link text
- Prefer relative paths for internal links
- Add appropriate attributes for external links
- Code Formatting:
- Use inline code for short references
- Include language hints in code blocks
- Format code consistently
- Content Organization:
- Group related content under appropriate headings
- Use lists for better readability
- Include examples where helpful
Tips
- Preview your content while writing to ensure proper formatting
- Use frontmatter to add metadata to your pages
- Keep your markdown files organized in a logical structure
- Maintain consistent formatting across your documentation
- Use appropriate heading levels to create a clear content hierarchy