Intégration

Ton casse-tête, sur ta page, à ton nom.

Un iframe permet d'afficher l'activité directement dans ton site, ton CMS ou ton LMS, sans en-tête, pied de page ni logo Puzzel.org.

Créer mon code d'intégration Essayer d'abord l'exemple

Fonctionne dans tout CMS ou LMS Aucune marque Puzzel dans le cadre Le suivi des résultats continue

iframe · 600px × 900px Mots croisés

Rien dans le cadre ne mentionne Puzzel. 600px × 900px

Formule L'intégration fait partie de tout abonnement payant. Voir les formules

Générateur de code d'intégration

Configure ici, colle là-bas.

1 · Quelle activité

2 · Taille du cadre

Largeur Hauteur

Largeur adaptative

Le cadre remplit son conteneur — 100% de largeur au lieu de pixels fixes

Largeur fixe. Active la largeur adaptative si ta page doit fonctionner sur téléphone.

Ton code d'intégration

<div>
<iframe src='https://puzzel.org/fr/crossword/embed?p=-N7G3WdPBEnNh4jW6-Q7' width='600' height='900' frameborder='0'>
</iframe></div>

Ajuste librement la largeur et la hauteur — 100% est aussi une valeur valide.

Modifie l'activité plus tard et chaque page qui l'intègre se met à jour toute seule.

Cet extrait utilise un véritable exemple d'activité, tu peux donc le coller tout de suite.

Étape 1

Crée l'activité

Crée-la comme d'habitude dans l'éditeur. Partager → Intégrer sur un site te donne le code d'intégration — tu ne touches jamais à un fichier.

Étape 2

Copie l'iframe

Choisis la taille qui convient à ta mise en page et colle l'extrait dans le HTML de ta page.

Étape 3

Fais-en la tienne

Mets en forme l'activité dans l'éditeur — ses couleurs et ses polices se retrouvent dans le cadre, pour qu'elle ait l'air de faire partie de ton site.

Essaie avant de t'abonner

Mots croisés d'exemple, à coller gratuitement

Colle cet exemple sur une page de test pour voir comment l'activité s'intègre à ta mise en page. Tu peux jouer à la grille, même sans compte.

<div>
<iframe src='https://puzzel.org/tr/crossword/embed?p=-N7G3WdPBEnNh4jW6-Q7' width='600' height='900' frameborder='0'>
</iframe></div>

Testé dans

Partout où un iframe est autorisé

WordPress custom HTML block

Google Sites embed → code

Moodle HTML editor

Canvas LMS rich content editor

Squarespace / Wix embed element

Bloqué par ton CMS ? Colle l'extrait dans un bloc HTML brut ou un bloc d'intégration plutôt que dans un champ de texte enrichi.

Dialogue avec l'activité depuis ta propre page Une fois qu'elle est intégrée dans ta page, cette page peut recevoir le score et la progression du joueur, être informée dès qu'il termine, et réinitialiser l'activité pour une nouvelle partie.

Idées d'activités

Toutes les idées →

Roue de la fortune Premium

Roue à lots

Un tour par visiteur, des tranches à la taille que tu veux, le résultat affiché en grand, et des confettis réservés au gros lot.

Mots mêlés

Mots mêlés à tirage au sort

Les lettres restantes forment le code d'un tirage au sort. Ajoute un formulaire d'inscription à la fin et le casse-tête devient le ticket d'entrée.

Mots fléchés

Casse-tête de newsletter

Un casse-tête à la suédoise pour la dernière page du mail interne. Les définitions se glissent dans la grille, et les cases numérotées forment le mot que les lecteurs envoient.

Quiz Premium

Quel genre es-tu ?

Pas de bonnes réponses, juste un résultat sur le joueur. Chaque réponse le fait avancer sur une échelle, et l'endroit où il s'arrête devient son résultat.

Avant de le coller en ligne

Les joueurs voient-ils Puzzel quelque part ?

Non. L'activité intégrée s'affiche sans logo, en-tête ni pied de page Puzzel.org et s'insère dans ta propre page.

Et si le casse-tête est coupé ?

Augmente la hauteur, ou utilise 100% de largeur pour que le cadre suive ta colonne au lieu d'une valeur fixe en pixels.

Est-ce que ça marche sur téléphone ?

Oui. Avec la largeur adaptative, l'activité se réagence, et le tactile fonctionne comme sur puzzel.org.