🚀 Quick Start
Welcome to WordPreview! Getting started is incredibly simple - just paste your Markdown and share instantly.
Basic Workflow
- Write or paste your Markdown in the editor
- Preview renders automatically in real-time
- Click "Share Note" to generate a shareable link
- Copy and share the URL with anyone
💡 Pro Tip
WordPreview works perfectly with content copied directly from Obsidian or Logseq. No conversion needed!
🔮 Obsidian Integration
WordPreview is designed to work seamlessly with your Obsidian workflow. Here's how to get the most out of it:
Sharing Obsidian Notes
- Open your note in Obsidian
- Switch to Source mode (Ctrl/Cmd + E)
- Select all content (Ctrl/Cmd + A) and copy
- Paste into WordPreview editor
- Your formatting, links, and images will be preserved!
Obsidian Features Supported
- ✅ Internal links:
[[Note Title]] - ✅ Block references:
[[Note#^block-id]] - ✅ Tags:
#important #project - ✅ Callouts:
> [!note] Title - ✅ Mermaid diagrams
- ✅ Math expressions
- ✅ Tables and code blocks
📦 Logseq Integration
Logseq's block-based structure translates beautifully to WordPreview's formatted output.
Sharing Logseq Pages
- Open your page in Logseq
- Use Export as Markdown feature
- Copy the exported content
- Paste into WordPreview
Logseq Features Supported
- ✅ Block hierarchy and nesting
- ✅ Block references:
((block-id)) - ✅ Page links:
[[Page Name]] - ✅ Block properties
- ✅ TODO states and priorities
- ✅ Queries (rendered as code blocks)
📝 Headers
Create document structure with headers from H1 to H6:
Markdown
# Header 1 ## Header 2 ### Header 3 #### Header 4 ##### Header 5 ###### Header 6
Output
Header 1
Header 2
Header 3
Header 4
Header 5
Header 6
✨ Text Formatting
Make your text stand out with various formatting options:
| Formatting | Markdown | Result |
|---|---|---|
| Bold | **bold text** |
bold text |
| Italic | *italic text* |
italic text |
| Strikethrough | ~~strikethrough~~ |
|
| Inline Code | `code` |
code |
| Highlight | ==highlighted== |
highlighted |
📋 Lists
Organize information with bullet points, numbers, and task lists:
Unordered Lists
Markdown
- First item - Second item - Nested item - Another nested - Third item
Output
- First item
- Second item
- Nested item
- Another nested
- Third item
Task Lists
Markdown
- [x] Completed task - [ ] Pending task - [ ] Another task
Output
- ☑️ Completed task
- ☐ Pending task
- ☐ Another task
📊 Mermaid Diagrams
Create beautiful diagrams using Mermaid.js syntax. Perfect for flowcharts, sequence diagrams, and more:
Flowchart Example
```mermaid
graph TD
A[Start] --> B{Decision}
B -->|Yes| C[Process A]
B -->|No| D[Process B]
C --> E[End]
D --> E
```
Sequence Diagram
```mermaid
sequenceDiagram
participant User
participant WordPreview
participant Server
User->>WordPreview: Paste Markdown
WordPreview->>WordPreview: Render Preview
User->>WordPreview: Click Share
WordPreview->>Server: Save Content
Server-->>WordPreview: Return URL
WordPreview-->>User: Display Share Link
```
🎨 Diagram Types Supported
- Flowcharts and graphs
- Sequence diagrams
- Gantt charts
- Class diagrams
- State diagrams
- User journey maps
💡 Best Practices
Get the most out of WordPreview with these proven tips:
For Obsidian Users
- Use Source mode when copying content
- Convert internal links to external ones for sharing
- Include context for linked references
- Test complex notes with embedded content
For Logseq Users
- Export pages rather than individual blocks
- Include referenced blocks for context
- Convert queries to regular content before sharing
- Use hierarchical structure for better readability
General Tips
- 📝 Clear headers: Use descriptive section titles
- 📊 Visual elements: Include diagrams and tables
- 🔗 Working links: Ensure external links are accessible
- 📱 Mobile test: Preview on mobile devices
- 🎯 Audience focus: Write for your readers' knowledge level