Rich Text Editor (TipTap)

​

Overview

• Familiar formatting controls (bold, italic, headings, lists)
• Advanced features (tables, highlights, colors)
• Context menus for quick actions
• Keyboard shortcuts for power users
• Real-time autosave

​

Editor Locations

1. Transcript tab - Edit uploaded transcripts
2. PRF tab - Refine AI-generated PRF content
3. Hooks tab - Edit viral hook variations
4. Posts tab - Format LinkedIn and Instagram posts

​

Toolbar Features

​

History

​

Text Formatting

The **most important** insight from this episode...

As Mark says, *"Tech debt is not a technical problem."*

~~Ignore tech debt~~ → Address it systematically

Run `kubectl get pods` to check status.

​

Headings

​

Lists

Mark's framework includes:
• Phase 1: Visibility
• Phase 2: Prioritization  
• Phase 3: Transformation

Follow these steps:
1. Audit your current state
2. Get executive buy-in
3. Start with quick wins

> "The biggest mistake IT leaders make is treating 
> tech debt as a technical problem. It's an 
> organizational problem."
> — Mark Baker, CIO at Acme Corp

​

Tables

• Comparison matrices
• Data organization
• Feature breakdowns

​

Clear Formatting

• Pasting from external sources (Word, Google Docs)
• Resetting overformatted content
• Starting fresh on a section

​

Special Features

​

Transcript Formatting

• Speaker detection (Doug, Guest)
• Paragraph breaks
• Timestamp preservation
• Cleanup of filler words (um, uh, like)

So like you know tech debt is um it's not really a technical problem 
right it's more of an organizational issue and um what I've seen is 
that you know companies try to solve it with governance which actually 
makes it worse because...

Guest: Tech debt is not really a technical problem. It's more of an 
organizational issue.

What I've seen is that companies try to solve it with governance, 
which actually makes it worse because...

​

Spell Check

1. AI Spell Check - Click the spell check button (ABC with checkmark)
   • Context-aware corrections
   • Won’t flag industry jargon
   • Batch fix all issues
2. Browser Spell Check - Red underlines appear automatically
   • Right-click for suggestions
   • Native to your browser
   • Instant corrections

​

Line Spacing

• Extra space between paragraphs
• Breathing room for long-form content
• Matches LinkedIn’s native post style

• Transcripts (dense content)
• PRF documents (analysis format)
• Hooks (compact list format)

​

Keyboard Shortcuts

​

Essential Shortcuts

​

Advanced Shortcuts

​

Context Menu (Right-Click)

​

“Create Visual” Menu

• Create Infographic - Opens Design page with text pre-filled
• Create Quote Card - Opens Design page with quote card specs

1. Select compelling text (quote, framework, data point)
2. Right-click → “Create Infographic” or “Create Quote Card”
3. Design page opens with:
   • Selected text in context
   • AI-generated visual spec
   • Source reference (which tab/section)
4. Generate image directly from there

​

Copy/Paste Behavior

​

Pasting from External Sources

1. HTML is preserved - Bold, italic, lists carry over
2. Colors are stripped - Dark theme compatibility
3. Fonts are normalized - Consistent with Pulse design
4. Backgrounds removed - No white boxes on dark UI

• Windows/Linux: Ctrl+Shift+V
• Mac: Cmd+Shift+V

​

Copying for External Use

• Strips HTML formatting
• Converts to plain text
• Copies to clipboard
• Ready to paste anywhere

1. Select text
2. Ctrl+C (or Cmd+C)
3. HTML is copied (preserves formatting if destination supports it)

​

Autosave

• Save frequency: Every 2 seconds after you stop typing
• Save indicator: Subtle “Saving…” → “Saved” in UI
• No manual save required - Changes persist immediately

​

Editor States

​

Editable (Default)

• Toolbar visible
• Content is editable
• Autosave enabled
• Keyboard shortcuts active

​

Read-Only

• Toolbar hidden
• Content not editable
• Copy still works
• Used for approved/locked content

​

Loading

• Skeleton placeholder visible
• Editor disabled
• Typically 1-2 seconds

​

Best Practices

​

Formatting Guidelines

• Use headings to organize long content
• Bold key takeaways and action items
• Bullet lists for 3+ related points
• Line breaks between distinct thoughts
• Blockquotes for guest quotes

• Overuse bold (loses impact)
• Use ALL CAPS (hard to read)
• Highlight entire paragraphs (defeats purpose)
• Mix heading levels randomly (breaks hierarchy)
• Use tables for non-tabular data

​

Transcript Editing

1. Clean up speaker labels - Ensure Doug vs. Guest is accurate
2. Fix names - Correct spelling of guest name, companies, products
3. Remove filler - Delete excessive “um,” “uh,” “you know”
4. Add paragraphs - Break up long speaker turns
5. Keep timestamps - Preserve [00:00] format if present

​

PRF Editing

1. Strengthen headings - Make section titles descriptive
2. Bold frameworks - Highlight key methodologies
3. Bullet key points - Extract actionable insights
4. Remove fluff - AI sometimes over-explains
5. Verify facts - Double-check statistics against transcript

​

Social Post Editing

1. Front-load hooks - Most compelling content first
2. Line breaks - Visual breathing room (especially LinkedIn)
3. Bold sparingly - 1-2 key phrases maximum
4. Remove AI tells - Edit out phrases like “In this episode…” if awkward
5. Character count - LinkedIn truncates at 1,300 chars in feed

​

Troubleshooting

​

Content not saving

• Is “Saving…” stuck? (Refresh the page)
• Network connection active? (Check your internet)
• Browser console errors? (Report to team)

1. Copy your content (Ctrl+A, Ctrl+C)
2. Refresh the page
3. Paste content back if lost

​

Toolbar buttons disabled

​

Pasted content looks broken

1. Select all pasted content
2. Click “Clear Formatting” button (eraser icon)
3. Reapply formatting manually

​

Keyboard shortcuts not working

1. Check for conflicting extensions (Grammarly, etc.)
2. Disable extensions temporarily
3. Use toolbar buttons as fallback

​

Related Features

• Episode Metadata - Edit generated descriptions
• Social Posts - Format LinkedIn and Instagram posts