Presnly logoPresnly

Slidev Integration

5 minutes · Easy

Add Presnly remote control to your Slidev presentations. The PPP adapter hooks into Slidev's navigation system for seamless integration.

Step 1: Install

Terminalbash
npm install presnly

Step 2: Initialize PPP

Option A: In a setup script or Vite plugin:

Setup scripttypescript
// slides.md: Add to your Slidev setup script
// In your vite.config.ts or a setup file:

import { Presnly } from 'presnly'

// Initialize after Slidev is ready
if (typeof window !== 'undefined') {
  const ppp = new Presnly({
    adapter: 'slidev',
    capabilities: [
      'navigation.jump',
      'navigation.sections',
      'content.notes',
      'display',
    ],
  })
  ppp.connect()
}

Option B: Using a Vue component in your first slide:

slides.mdvue
<!-- In your slides.md, add a global setup component -->
---
# First slide
---

<script setup>
import { onMounted } from 'vue'

onMounted(async () => {
  const { Presnly } = await import('presnly')
  new Presnly({ adapter: 'slidev' }).connect()
})
</script>

Step 3: Present with Presnly

Run your Slidev presentation and open the URL in Presnly's built-in browser on Mac. PPP will be detected automatically, enabling jump-to-slide, section navigation, and more.

Next Steps