Communitygithub.com

cclank/lanshu-html-ppt-templates

Créez, modifiez et personnalisez des présentations à partir de 30 modèles HTML de Lanshu, adaptés aux présentations professionnelles, gouvernementales, pitchs, conférences, soutenances académiques, supports pédagogiques, narration de données et présentations interactives. Idéal pour les diaporamas HTML ou les PPT web utilisant ces modèles.

Qu'est-ce que lanshu-html-ppt-templates ?

Cette compétence permet de générer, modifier et personnaliser des présentations HTML autonomes à partir de 30 modèles premium de Lanshu (岚叔), optimisés pour divers contextes : business, gouvernance, levée de fonds, conférences, soutenances académiques, formation, récits de données et présentations interactives. Elle repose sur un catalogue structuré de modèles (décrit dans `references/template-catalog.md`) et un pipeline d'outils en ligne de commande (`scripts/deck.py`) pour lister, créer, inspecter et valider les présentations. Ses fonctionnalités incluent la modification ciblée du HTML (remplacement de contenu, ajout/suppression de pages), l'incorporation automatisée de polices optimisées pour le chinois (`scripts/embed_fonts.py`), la validation du JSON des notes et de la syntaxe JavaScript, ainsi qu’un mode présentateur avec télécommande via Wi-Fi (`scripts/present.py`). La compétence préserve l'intégrité des dépendances du noyau de lecture (ID, classes, `data-*`, gestionnaires d'événements, diagrammes) et gère les cas particuliers comme les modèles avec canevas infini, interfaces de terminal ou simulations financières. Elle prend en charge la livraison de fichiers HTML prêts à l'emploi, avec export PDF optionnel, tout en alertant sur les limitations des animations et interactions dans le rendu PDF.

Compatible avec~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/cclank/lanshu-html-ppt-templates/tree/HEAD

Demander à votre IA préférée

Ouvre une nouvelle conversation avec cette compétence d'agent déjà préchargée.

Documentation

Modèles HTML de Lanshu

Utilisez les modèles complets monofichiers dans assets/templates/ pour créer des présentations HTML directement projetables. Catalogue en ligne : https://ppt.lanshuagent.com/ ; Auteur : https://x.com/LufzzLiz.

Choisir un modèle

Consultez d'abord references/template-catalog.md pour sélectionner selon le contenu, le public et le format de livraison. Si l'utilisateur a spécifié un style, suivez-le ; sinon, choisissez en fonction du matériel et expliquez brièvement. Aucune confirmation supplémentaire requise pour les styles courants.

  • Présentations professionnelles, stratégiques et à contenu dense : 07-consulting, 01-swiss.
  • Levée de fonds, lancements produit et techniques : 04-brutalism, 03-aurora, 17-terminal.
  • Marque, culture, curation et style de vie : 02-editorial, 08-oriental, 09-organic, 18-riso, 19-collage.
  • Distribution de données et narration continue : 11-morph ; hypothèses commerciales ajustables : 14-live-model ; réseaux géographiques et mondiaux : 20-globe.
  • Soutenances académiques et rapports de projets : 21-academic ; supports pédagogiques et formations : 23-chalkboard.
  • Présentations de fonctionnalités produits et bilans annuels : 22-bento ; produits IA et témoignages clients : 24-chat ; réunions d'équipe et rétrospectives : 25-pixel.
  • Rapports gouvernementaux, entreprises d'État et administrations : 28-official ; jalons annuels, magazines internes : 26-newspaper.
  • Revues d'ingénierie et solutions matérielles : 27-blueprint ; feuilles de route et planification stratégique : 29-metro ; récits utilisateurs et marque : 30-comic.
  • Pour des PDF multipages, privilégiez les modèles marqués comme ayant un style d'impression multipage dans le catalogue ; vérifiez toujours le résultat d'impression.

Créer et modifier

Les chemins dans les commandes sont relatifs au répertoire de la compétence ; localisez d'abord l'installation réelle de la compétence.

python3 scripts/deck.py list
python3 scripts/deck.py new 07-consulting --output /path/to/outputs/presentation.html --title "Titre de la présentation"
python3 scripts/deck.py source 07-consulting
python3 scripts/deck.py inspect /path/to/outputs/presentation.html

new copie le modèle complet, conserve les polices et les scripts, et refuse d'écraser les fichiers existants. --title modifie uniquement le titre du navigateur ; le contenu de la page doit être réécrit séparément. source masque uniquement le Base64 des polices dans le terminal, en conservant les numéros de ligne d'origine ; ne sauvegardez pas sa sortie comme fichier de présentation.

Avant d'exécuter, lisez references/authoring.md. Effectuez des modifications ciblées sur le HTML sélectionné :

  1. Établissez une narration page par page en fonction du matériel de l'utilisateur, puis remplacez les titres, le corps, les données des graphiques, les en-têtes/pieds de page et la marque. Réutilisez de préférence les mises en page existantes, ajoutez ou supprimez des pages selon le contenu.
  2. Conservez les ID, classes, data-*, liaisons d'événements et interfaces des graphiques dépendants du noyau de lecture, ainsi que les blocs de code TOOLKIT (kit de présentation) et PRESENTER (fenêtre de l'orateur) ; synchronisez les numéros de page, les tableaux de génération et le nombre de notes lors de la modification du nombre de pages.
  3. Mettez à jour le tableau JSON dans script#deck-notes pour que l'ordre des notes corresponde à l'ordre réel de la présentation. Les exemples de sociétés, chiffres, sources et coordonnées dans les modèles doivent être remplacés ou supprimés.
  4. Générez un HTML autonome. Utilisez de préférence SVG/CSS pour les graphiques statiques, conservez Canvas existant pour les graphiques en temps réel ; les nouvelles ressources doivent être intégrées ou livrées avec la présentation.

Les polices chinoises des modèles sont rognées selon les caractères d'origine ; les nouveaux caractères utiliseront d'abord les polices système comme fallback. Après avoir modifié le texte, exécutez en ligne python3 scripts/embed_fonts.py <fichier de présentation> pour rogner à nouveau les polices intégrées selon les caractères réellement utilisés dans chaque page ; hors ligne, privilégiez la pile de polices existante et vérifiez la mise en page. Conservez les mentions de licence de police d'origine.

Limites de l'interaction et de l'export

  • Les modèles normaux utilisent .slide ; les canvas infinis, films, interfaces spatiales, terminaux et collages ont leurs propres structures de données, spécifiées dans le guide de l'auteur.
  • Les paramètres du modèle, les flux de trésorerie et les éléments liés de 14-live-model doivent être modifiés ensemble ; l'aperçu de l'orateur est une instance indépendante, ne synchronisant pas par défaut les paramètres modifiés temporairement sur l'écran principal.
  • Les 30 modèles intègrent un kit de présentation : panneau de touches ?, vue d'ensemble O, saut de page avec numéro + Entrée, écran noir/blanc avec B/W, pointeur laser L, annotation avec D, et E pour modifier le texte, le script, remplacer en bloc et ajuster les couleurs du thème, puis enregistrer comme nouveau fichier. Ouvrez avec python3 scripts/present.py <fichier de présentation>, puis appuyez sur M pour télécommander depuis un téléphone sur le même Wi-Fi.
  • 17-terminal est une présentation web avec l'apparence d'un terminal ; les commandes affichées font partie du contenu de la page.
  • 12-generative peut produire des visuels différents à chaque exécution ; fixez la graine pour des résultats reproductibles.
  • Actuellement, le HTML et l'impression PDF via navigateur sont disponibles pour certains modèles ; les interactions et animations sont lues par le navigateur. Si un .pptx modifiable est requis, expliquez clairement les différences de format, puis effectuez une conversion distincte selon le choix de l'utilisateur.
  • Le déploiement public s'effectue uniquement à la demande de l'utilisateur. La modification du domaine dans la configuration n'acquiert pas automatiquement un nouveau domaine ou des droits de publication.

Validation et livraison

python3 scripts/deck.py validate /path/to/outputs/presentation.html

Cette commande vérifie le JSON des notes et la syntaxe JavaScript inline ; nécessite Node.js pour la vérification JavaScript. Elle n'exécute pas les scripts de la page.

Vérifiez avec un navigateur disponible : première/dernière page, graphiques clés, texte le plus long, navigation, plein écran, notes de l'orateur et interactions ; en cas de demande PDF, vérifiez le résultat d'impression réel. Si aucun navigateur n'est disponible, décrivez les vérifications statiques effectuées et les parties non vérifiées.

Livrez le HTML avec les chemins disponibles, le nombre de pages et les instructions de lecture nécessaires ; suggérez d'appuyer sur ? pour voir tous les raccourcis. Pour la télécommande mobile, utilisez scripts/present.py. Si un PDF est demandé, livrez également un PDF validé ; expliquez les limitations des interactions et animations dans l'export PDF.

Skills associés