Intégration

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

Un simple iframe place l'activité directement dans ton site, ton CMS ou ton LMS. En marque blanche — pas d'en-tête, pas de pied de page, aucune marque Puzzel dans le cadre.

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.

3 · Aperçu du rendu

Les couleurs viennent des paramètres de style de l'activité, pour que le casse-tête ait l'air de faire partie de ton site.

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. Le bouton 'Utiliser mon activité' 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 ça dans une page de test pour voir comment le cadre se comporte dans ta mise en page. C'est une vraie grille jouable — sans compte.

<div>
<iframe src='https://puzzel.org/cs/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.

Avant de le coller en ligne

Les joueurs voient-ils Puzzel quelque part ?

Non. L'activité intégrée est en marque blanche — pas de logo, pas d'en-tête, pas de pied de page. Ta page, c'est toute l'expérience.

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.