Aller au contenu
← Toutes les plateformes

Tutoriel Squarespace

Votre voix dans votre blog Squarespace

L'injection de code une fois pour tout le site, un bloc Code sous le paragraphe : c'est tout.

Ce qu'il vous faut≈ 5 min d'installation

  • Une offre Squarespace qui inclut l'injection de code
  • Un compte administrateur du site
  • Un compte Vokyt, offre Gratuit comprise

Étape 1 sur 4 · Copier le script

vokyt.cc/tableau-de-bord

Pas à pas

  1. 01

    Préparez Vokyt

    Compte, site, clé publique

    Créez votre compte Vokyt (gratuit), puis ouvrez Tableau de bord → Sites et intégration → Ajouter un site.

    Déclarez tous les domaines où le lecteur s'affichera : votre domaine, avec et sans www, et monblog.squarespace.com. Le lecteur refuse de s'afficher sur un domaine non déclaré : c'est ce qui empêche quelqu'un d'utiliser vos vocaux ailleurs.

    Copiez la ligne de script affichée : elle contient déjà votre clé publique (pk_live_…). Cette clé peut apparaître dans vos pages sans risque.

    html
    <script src="https://vokyt.cc/player.js" data-key="pk_live_…" defer></script>
  2. 02

    Collez le script dans l'injection de code

    Injection de code › En-tête

    Selon la version de l'interface : Paramètres → Avancé → Injection de code, ou Site web → Outils du site → Injection de code.

    Collez la ligne de script dans « En-tête » (Header), puis Enregistrer.

    html
    <script src="https://vokyt.cc/player.js" data-key="pk_live_…" defer></script>
  3. 03

    Enregistrez un vocal

    30 s à 1 min 30

    Tableau de bord → Nouveau vocal : enregistrez depuis le navigateur ou envoyez un fichier. Vokyt harmonise le son et transcrit en quelques secondes.

    Relisez la transcription, puis copiez la balise du vocal dans l'encadré « Intégration ».

    html
    <vokyt-player note="note_…"></vokyt-player>
  4. 04

    Ajoutez un bloc Code

    + › Code

    Modifiez le billet, cliquez sur le point d'insertion sous le paragraphe, puis + → Code.

    Gardez le mode HTML, collez la balise du vocal et décochez « Afficher la source » si l'option existe.

    html
    <vokyt-player note="note_…"></vokyt-player>
  5. 05

    Enregistrez et vérifiez

    Le lecteur apparaît

    Enregistrez le billet et ouvrez-le hors de l'éditeur : le lecteur s'affiche avec la transcription.

Questions fréquentes

Le lecteur ne s'affiche pas, pourquoi ?

Dans 9 cas sur 10, le domaine exact de la page n'est pas déclaré dans Sites et intégration (avec ou sans www, domaine de prévisualisation). Vérifiez aussi que la ligne de script est présente une seule fois et que le vocal est prêt.

Le lecteur n'apparaît pas dans l'éditeur

Squarespace désactive souvent les scripts personnalisés pendant l'édition. Vérifiez sur le site publié, dans une fenêtre où vous n'êtes pas connecté.

Est-ce que ça ralentit mon site ?

Le lecteur pèse moins de 15 Ko, se charge en différé (defer) et n'utilise aucun cookie. L'audio n'est téléchargé que lorsque le lecteur appuie sur lecture.

Autres plateformes

Prêt à faire entendre votre voix ?

Créez votre compte, enregistrez un premier vocal et suivez les étapes : c'est gratuit pour commencer.