Guide utilisateur de HtmlDrag

Bienvenue sur HtmlDrag. Ce guide vous aidera à démarrer de zéro, couvrant la gestion de compte, l'importation de contenu, l'édition visuelle et l'exportation de travaux.

1. Compte et connexion

Avant d'utiliser HtmlDrag, vous devez créer un compte. Nous proposons plusieurs méthodes d'inscription et de connexion pour vous aider à démarrer rapidement.

1.1 Inscription

HtmlDrag utilise l'inscription par e-mail. Remplissez simplement quelques informations de base pour créer votre compte. Après une inscription réussie, vous serez automatiquement connecté et redirigé vers la page d'accueil.

Inscription par e-mail

Sur la page d'inscription, suivez les étapes suivantes pour créer votre compte :

1. Saisir l'e-mail : Fournissez votre adresse e-mail fréquemment utilisée. Elle servira d'identifiant de connexion et de canal de notification. Assurez-vous que le format de l'e-mail est correct, par exemple [email protected].
2. Définir le mot de passe : Le mot de passe doit contenir des lettres et des chiffres, avec une longueur de 8 à 32 caractères. Nous recommandons d'utiliser un mot de passe fort pour sécuriser votre compte.
3. Confirmer le mot de passe : Saisissez à nouveau le mot de passe pour vous assurer que les deux entrées correspondent.
4. Définir un pseudo (optionnel) : Vous pouvez personnaliser votre pseudo. Si laissé vide, le système générera automatiquement un pseudo par défaut pour vous.
5. Accepter les conditions : Cochez « J'ai lu et j'accepte les Conditions d'utilisation et la Politique de confidentialité », puis cliquez sur le bouton « S'inscrire » pour terminer l'inscription.

Page d'inscription : Entrez votre e-mail et informations de base pour créer un compte

Vérification de l'e-mail et récompense de crédits

Après une inscription réussie, le système enverra un e-mail de vérification à votre boîte de réception. Après avoir complété la vérification de l'e-mail, vous recevrez des crédits bonus qui peuvent être utilisés pour les fonctionnalités Générateur IA et Importation URL. Si vous ne recevez pas l'e-mail, vérifiez votre dossier spam ; vous pouvez cliquer sur « Renvoyer » pour demander un autre e-mail de vérification après 3 minutes.

Conseil : Compléter la vérification de l'e-mail vous permet non seulement de gagner des crédits bonus, mais aussi de débloquer l'expérience complète et d'améliorer la sécurité de votre compte.

1.2 Connexion

HtmlDrag prend en charge plusieurs méthodes de connexion. Choisissez l'option la plus pratique selon vos préférences.

Connexion par e-mail et mot de passe

Connectez-vous en utilisant l'e-mail et le mot de passe avec lesquels vous vous êtes inscrit :

1. Entrez votre adresse e-mail sur la page de connexion
2. Entrez votre mot de passe (cliquez sur l'icône œil pour afficher/masquer le mot de passe)
3. Cliquez sur le bouton « Continuer » pour terminer la connexion

Après une connexion réussie, vous serez automatiquement redirigé vers la page d'accueil où vous pouvez commencer à créer.

Connexion tierce (Google / GitHub)

Pour un accès plus rapide, vous pouvez vous connecter en utilisant votre compte Google ou GitHub :

1. Se connecter avec Google : Cliquez sur le bouton « Se connecter avec Google ». Dans la fenêtre d'autorisation Google, sélectionnez votre compte et confirmez l'autorisation.
2. Se connecter avec GitHub : Cliquez sur le bouton « Se connecter avec GitHub ». Vous serez redirigé vers la page d'autorisation de GitHub. Après confirmation, vous serez automatiquement renvoyé vers HtmlDrag.

Page de connexion : Prend en charge e-mail/mot de passe et comptes tiers

Conseil : Utiliser la connexion Google ou GitHub crée automatiquement un compte — pas besoin d'inscription séparée. Lors de votre première connexion tierce, le système créera automatiquement un compte lié pour vous.

Lien mot de passe oublié

Si vous avez oublié votre mot de passe, cliquez sur le lien « Mot de passe oublié ? » en bas à droite de la page de connexion pour accéder au processus de réinitialisation du mot de passe (voir Section 1.3).

1.3 Mot de passe oublié

Si vous avez oublié votre mot de passe, vous pouvez le réinitialiser en utilisant un code de vérification par e-mail. L'ensemble du processus est complété sur une seule page sans redirections.

Processus de réinitialisation du mot de passe

Suivez ces étapes pour réinitialiser votre mot de passe :

1. Saisir l'e-mail : Fournissez l'adresse e-mail utilisée lors de l'inscription
2. Obtenir le code de vérification : Cliquez sur le bouton « Envoyer le code ». Le système enverra un e-mail contenant un code de vérification à 6 chiffres
3. Saisir le code de vérification : Entrez le code à 6 chiffres reçu dans le champ de code de vérification
4. Définir un nouveau mot de passe : Entrez votre nouveau mot de passe (doit contenir des lettres et des chiffres, 8-32 caractères)
5. Confirmer le nouveau mot de passe : Saisissez à nouveau le nouveau mot de passe pour vous assurer qu'ils correspondent
6. Cliquez sur « Réinitialiser le mot de passe » : Terminez la réinitialisation du mot de passe. Après avoir vu le message de succès, vous serez automatiquement redirigé vers la page de connexion

Mot de passe oublié : Réinitialisez via code de vérification par e-mail

Validité du code de vérification

Le code de vérification a une période de validité limitée — veuillez l'utiliser rapidement après avoir reçu l'e-mail. Si le code a expiré, vous pouvez cliquer sur le bouton « Renvoyer » pour demander un nouveau code (vous devrez attendre la fin du compte à rebours avant de renvoyer).

Remarque : Si votre e-mail n'est pas enregistré dans le système, le code de vérification ne peut pas être envoyé. Veuillez vous assurer que vous entrez l'adresse e-mail utilisée lors de l'inscription.

2. Profil

Le Profil est le centre de gestion de vos informations de compte, travaux et commandes. Cliquez sur l'avatar en haut à droite pour y accéder.

Profil : Gérez compte, travaux et commandes en un seul endroit

2.1 Paramètres du profil

Le module Paramètres du profil vous permet de gérer les informations de base de votre compte, y compris l'avatar, le pseudo, l'e-mail, la bio et les paramètres de mot de passe.

Changer d'avatar

Cliquez sur le bouton « Changer d'avatar » dans la zone avatar et sélectionnez un fichier image local à télécharger. Le système recadrera et enregistrera automatiquement votre nouvel avatar.

Changer de pseudo

Cliquez sur le bouton d'édition à côté de votre pseudo, entrez un nouveau nom et cliquez sur « Enregistrer ». Votre pseudo sera affiché sur tous vos travaux et commentaires.

Gestion de l'e-mail

La section e-mail affiche votre adresse e-mail actuelle et son statut de vérification :

1. Vérifié : Votre e-mail a été vérifié et toutes les fonctionnalités sont disponibles
2. Non vérifié : Cliquez sur « Envoyer l'e-mail de vérification » pour compléter la vérification et gagner des crédits bonus
3. Changer d'e-mail : Vous devez d'abord vérifier votre e-mail actuel, puis entrer une nouvelle adresse e-mail pour compléter le changement

Bio

Entrez votre présentation dans la zone bio (recommandé : pas plus de 200 caractères), puis cliquez sur « Enregistrer » pour mettre à jour.

Changer de mot de passe / Définir un mot de passe

Cliquez sur le bouton « Changer le mot de passe » pour ouvrir la boîte de dialogue des paramètres de mot de passe :

1. Utilisateurs avec un mot de passe existant : Entrez votre mot de passe actuel, puis définissez un nouveau mot de passe (8-32 caractères, incluant lettres et chiffres)
2. Utilisateurs sans mot de passe : Définissez un nouveau mot de passe directement. Après la configuration, vous pouvez vous connecter avec e-mail et mot de passe

Supprimer le compte

Pour supprimer votre compte, cliquez sur le bouton « Supprimer le compte » en bas de la page. Pour la sécurité, vous devrez vérifier votre identité via un code de vérification par e-mail.

Remarque : Après avoir soumis la demande de suppression, votre compte entrera dans une période de rétention (généralement 30 jours) pendant laquelle vous ne pourrez pas vous connecter. Après cette période, le système supprimera définitivement vos travaux, crédits et historique.

Profil : Gérez avatar, pseudo, e-mail et mot de passe

2.2 Utilisation du stockage

Le module Utilisation du stockage affiche la consommation de stockage de votre compte, vous aidant à comprendre l'espace restant et à planifier vos créations en conséquence.

Aperçu du stockage

La section supérieure affiche votre utilisation globale, incluant :

1. Utilisé : L'espace de stockage actuellement utilisé
2. Total : La limite de stockage de votre compte (les utilisateurs du Pro bénéficient d'une capacité plus grande)
3. Restant : Espace disponible pour créer de nouveaux travaux
4. Travaux stockés : Nombre actuel de travaux enregistrés et la limite

Répartition du stockage

Le système catégorise le stockage en trois types :

1. Contenu HTML : Espace utilisé par le code des pages web de vos travaux
2. Ressources images : Espace utilisé par les fichiers image téléchargés
3. Autres ressources : Espace utilisé par d'autres pièces jointes

Limite du nombre de travaux

Les utilisateurs du Free et du Pro ont des limites différentes pour le nombre de travaux. Lorsque vous atteignez la limite, vous devrez supprimer certains travaux ou mettre à niveau votre plan avant d'en créer de nouveaux.

Actualiser et mettre à niveau le stockage

Cliquez sur le bouton d'actualisation pour mettre à jour les informations de stockage. Pour plus d'espace de stockage, cliquez sur « Mettre à niveau le stockage » pour visiter la page d'abonnement et choisir un plan adapté.

Conseil : Si le stockage de votre compte est plein ou si le nombre de travaux atteint la limite, le système gèlera la création de nouveaux travaux. Veuillez supprimer certains travaux ou mettre à niveau votre plan pour restaurer les permissions de téléchargement.

2.3 Fichiers

Le module Gestion des travaux affiche tous les travaux que vous avez créés, prenant en charge les opérations de visualisation, édition, partage et suppression.

Liste des travaux et filtres

Les travaux sont affichés sous forme de cartes ou en liste. Vous pouvez les filtrer en utilisant :

1. Recherche : Entrez le code ou le titre du travail pour rechercher
2. Filtre par type : Filtrer par Générateur IA, Téléchargement de fichier, Capture URL, Coller du code, etc.
3. Plage de dates : Sélectionnez les dates de début et de fin pour filtrer les travaux d'une période spécifique
4. Trier par : Trier par plus récent, plus ancien, nombre de likes ou nombre de vues

Gestion des travaux : Visualisez, filtrez et gérez tous les travaux

Visualiser et éditer les travaux

Cliquez sur le bouton « Voir » sur une carte de travail pour le prévisualiser. Dans l'interface de prévisualisation, vous pouvez :

1. Modifier le titre du travail (double-cliquez sur le titre pour éditer)
2. Cliquer sur « Éditer » pour entrer dans l'éditeur visuel et continuer l'édition
3. Voir l'historique des sauvegardes du travail et restaurer une version spécifique

Gestion du statut de partage

Les utilisateurs du Pro peuvent partager des travaux, permettant aux autres de les voir via un lien :

1. Activer le partage : Cliquez sur le bouton « Partager » pour générer un lien de partage valide 7 jours
2. Mettre à jour le partage : Les travaux déjà partagés peuvent avoir leurs liens mis à jour, actualisant la période de validité
3. Arrêter le partage : Cliquez sur « Arrêter le partage » pour invalider immédiatement le lien

Supprimer des travaux

Cliquez sur le bouton « Supprimer » sur une carte de travail pour le supprimer. Le système affichera deux boîtes de dialogue de confirmation pour éviter la suppression accidentelle :

1. Première confirmation : Demande si vous voulez supprimer ce travail
2. Deuxième confirmation : Rappelle que la suppression est irréversible

Conseil : Vous pouvez supprimer jusqu'à 3 enregistrements à la fois. Après la suppression d'un travail, son espace de stockage sera libéré.

2.4 Crédits

Le module Historique des crédits affiche l'historique des transactions de crédits de votre compte, incluant les enregistrements de consommation et de gain.

Historique des transactions de crédits

Les enregistrements de crédits sont affichés dans un tableau contenant les informations suivantes :

1. Date : Quand le changement de crédit s'est produit
2. Type : Le type d'opération du changement de crédit
3. Changement de points : Crédits ajoutés (positif) ou déduits (négatif)
4. Description : Explication détaillée du changement

Vous pouvez utiliser les filtres de plage de dates pour voir les enregistrements d'une période spécifique.

Types de crédits

1. Générateur IA : Crédits consommés lors de l'utilisation de la fonctionnalité Générateur IA
2. Importation URL : Crédits consommés lors de l'utilisation de la fonctionnalité Importation URL
3. Récompense d'inscription : Crédits attribués aux nouveaux utilisateurs après l'inscription et la vérification de l'e-mail
4. Bonus plateforme : Crédits offerts par la plateforme
5. Cadeau mensuel : Allocation mensuelle de crédits pour les utilisateurs du Pro
6. Recharge de crédits : Crédits obtenus par l'achat de crédits
7. Ajustement admin : Crédits ajustés manuellement par les administrateurs

Historique des crédits : Consultez les détails des transactions de crédits

Conseil : Les utilisateurs du Pro reçoivent des crédits supplémentaires chaque mois. Les crédits peuvent être utilisés pour des fonctionnalités payantes comme le Générateur IA et l'Importation URL.

2.5 Commandes

Le module Historique des commandes affiche votre historique d'achats et vos enregistrements de paiement, facilitant la consultation et la gestion des commandes.

Gestion des commandes

La liste des commandes affiche vos enregistrements d'achats. Vous pouvez :

1. Voir le statut et les détails des commandes
2. Utiliser des filtres pour trouver rapidement des commandes spécifiques
3. Continuer le paiement pour les commandes en attente
4. Fermer ou supprimer les commandes dont vous n'avez plus besoin

Conseil : Si vous rencontrez des problèmes de paiement, vous pouvez fermer la commande actuelle et en passer une nouvelle.

2.6 Portfolio

La page Portfolio est votre espace dédié pour visualiser et gérer toutes vos créations. Accédez-y rapidement depuis la barre latérale ou le menu utilisateur.

Affichage des travaux

La page affiche tous vos travaux sous forme de cartes, chacune contenant :

1. Aperçu miniature : Aperçu visuel du travail pour une identification rapide
2. Titre du travail : Affiche le nom du travail, cliquez pour modifier
3. Date de création : Enregistre quand le travail a été créé
4. Statut de partage : Indique si le travail est actuellement partagé

Portfolio : Visualisez et gérez toutes vos créations en un seul endroit

Actions rapides

Chaque carte de travail fournit des boutons d'action pratiques :

1. Éditer : Entrer dans l'éditeur visuel pour continuer la création
2. Partager : Générer ou gérer les liens de partage (Pro uniquement)

3. Navigation de la barre latérale

HtmlDrag offre plusieurs façons d'importer du contenu dans l'éditeur, couvrant tous les scénarios de la création à partir de zéro au traitement secondaire. Utilisez la barre latérale gauche pour basculer rapidement entre les points d'entrée.

Navigation de la barre latérale : Accès rapide aux différents points d'entrée de création

3.1 Accueil

L'Accueil est le point d'entrée par défaut de HtmlDrag, présentant le Générateur IA. Entrez votre contenu ici pour générer rapidement des designs web professionnels.

3.2 Importation URL

L'Importation URL vous permet d'entrer n'importe quel lien de page web publique, et le système capturera automatiquement le contenu de la page et générera un travail modifiable. C'est la méthode idéale pour obtenir rapidement des designs web existants pour une édition ultérieure.

Entrer l'URL

Collez l'adresse de la page web que vous souhaitez capturer dans le champ de saisie. Seuls les liens http/https publics sont pris en charge ; les adresses privées ou locales ne sont pas autorisées.

Importation URL : Entrez l'URL, capturez la page web instantanément

Confirmation de déduction de crédits

Après avoir cliqué sur « Démarrer la capture », une boîte de dialogue de confirmation de déduction de crédits apparaîtra, affichant les crédits requis pour cette opération, votre solde de crédits actuel et les crédits bonus mensuels. Les crédits bonus mensuels sont déduits en premier, le reste étant déduit de vos crédits actuels.

Progression et statut de la capture

Une fois confirmé, le système commence à capturer le contenu de la page. Veuillez ne pas quitter la page pendant la capture pour éviter l'interruption. Après une capture réussie, vous serez automatiquement redirigé vers l'éditeur.

Conseils :

Certains sites web ne peuvent pas être capturés : Les sites web nécessitant une authentification ou utilisant des frameworks frontend complexes (comme certaines applications SPA) peuvent ne pas être capturés ou être incomplets.

Sites audio/vidéo : Le contenu dynamique des sites audio et vidéo peut ne pas être capturé correctement.

Page trop volumineuse : Si le contenu de la page dépasse la taille autorisée par le serveur, la capture peut échouer. Essayez une page plus simple à la place.

3.3 Télécharger HTML

La fonctionnalité Télécharger HTML vous permet d'importer des fichiers HTML locaux dans HtmlDrag. Le système effectuera une analyse de sécurité et générera un travail modifiable. C'est idéal pour les modèles HTML existants ou les designs d'e-mails qui nécessitent une édition ultérieure.

Format de fichier et limites de taille

Prend en charge les formats de fichiers .html et .htm. La taille d'un seul fichier ne doit pas dépasser la limite du système (voir l'interface de téléchargement pour les limites spécifiques). Les fichiers téléchargés subissent un traitement avancé, ce qui peut augmenter significativement la taille de stockage réelle par rapport au fichier original. Veuillez vous assurer d'avoir une capacité restante suffisante.

Télécharger HTML : Glissez-déposez ou cliquez pour télécharger des fichiers HTML

Analyse de sécurité

Le système analyse les fichiers téléchargés pour la sécurité, détectant et supprimant les scripts malveillants potentiels, les balises dangereuses et les ressources externes suspectes. Selon le niveau de risque (faible, moyen, élevé, critique), le système fournira des avertissements appropriés ou bloquera l'enregistrement.

Remarque : Ne téléchargez pas de fichiers contenant du code malveillant. Les téléchargements malveillants peuvent entraîner la suspension du compte.

Aperçu et enregistrement

Après l'analyse du fichier, vous pouvez prévisualiser le résultat dans la zone de prévisualisation. Une fois confirmé, cliquez sur « Enregistrer le travail » pour sauvegarder le travail sur votre compte, et vous pouvez entrer dans l'éditeur visuel pour l'édition à tout moment.

3.4 Coller du code

La fonctionnalité Coller du code vous permet de coller directement du code HTML, et le système effectuera une analyse de sécurité et le convertira en design visuel. C'est la méthode d'importation la plus flexible, adaptée aux développeurs ou aux utilisateurs qui ont besoin d'un contrôle précis sur le code.

Coller le code HTML

Collez votre code HTML dans la zone de saisie de code. Vous pouvez optionnellement remplir un titre de travail (si laissé vide, le système utilisera le nom par défaut « Travail sans titre »).

Coller du code : Collez directement du code HTML pour commencer l'édition

Analyse de sécurité

Similaire au téléchargement de fichier, le système effectue une détection de sécurité sur le code collé. Si le niveau de risque du code est trop élevé, la politique de sécurité du système refusera de traiter ce contenu. Veuillez revoir le code et réessayer.

Remarque : Ne collez pas de code ou de scripts malveillants. L'utilisation malveillante peut entraîner la suspension du compte.

Générer l'aperçu et enregistrer

Après avoir entré le code, cliquez sur le bouton « Générer l'aperçu ». Une fois que le code passe la vérification de sécurité, l'aperçu sera automatiquement généré. Après avoir confirmé le résultat, cliquez sur « Enregistrer le travail » pour sauvegarder le travail sur votre compte.

3.5 Générateur IA

Générateur IA fonctionne mieux avec un vrai matériau source : PDF, PPT/PPTX, Excel/XLSX, CSV, Word, Markdown, TXT, JPG/PNG ou consigne libre. Précisez l’objectif : synthèse, produit, événement, cours, note interne, données, suivi commercial, portfolio ou test.

1. Importez le matériau ou écrivez la consigne avec public, but et style.
2. Laissez l’IA organiser titres, paragraphes, listes, cartes et sections.
3. Vérifiez contenu, hiérarchie, images, tableaux et ordre du texte.
4. Affinez dans HtmlDrag : textes, images, blocs, couleurs et mise en page.
5. Enregistrez, partagez ou téléchargez le HTML.

Textes longs, tableaux, PPT, images et PDF se traitent différemment selon leur contenu.

3.6 Tarifs

La page Tarifs est l'endroit où vous gérez votre abonnement et vos recharges de crédits. Choisissez le plan qui vous convient le mieux et débloquez plus de possibilités créatives.

Plans d'abonnement

HtmlDrag propose des abonnements Pro et Pro Max. Après vous être abonné, vous pouvez utiliser les avantages inclus pendant la période d’abonnement active :

Pro : Pour les créateurs réguliers qui ont besoin du flux complet d’édition HTML, de génération IA, de partage et d’export.

Pro Max : Pour une création IA plus intensive, des projets plus volumineux et des limites d’utilisation plus élevées.

Les abonnements se renouvellent selon le cycle de facturation affiché au paiement. Vous pouvez gérer ou annuler le renouvellement depuis votre compte ou le prestataire de paiement.

Tarifs : Choisissez le plan qui vous convient le mieux

Recharger les crédits

Si vous n'avez besoin que d'utiliser temporairement les fonctionnalités de génération IA ou d'Importation URL, vous pouvez choisir de recharger des crédits. Les crédits achetés n'expirent jamais, et vous pouvez recharger à tout moment lorsque vous en manquez — pas d'attente requise.

Comparaison des fonctionnalités

Les principales différences entre le Free et le Pro sont les suivantes :

Guide d'utilisation des crédits

Chaque génération IA consomme un nombre fixe de crédits. Les utilisateurs du Free reçoivent des crédits bonus mensuels de base, tandis que les utilisateurs du Pro en reçoivent davantage. Les crédits achetés n'expirent jamais, et vous pouvez recharger à tout moment lorsque vous en manquez — pas besoin d'attendre la récupération du quota.

3.7 Historique

Dans la barre latérale gauche, « Mes travaux » (Historique) fournit un accès rapide à vos créations passées. Elle liste tous vos enregistrements d'édition par ordre chronologique.

Sélection rapide et édition

Cliquez sur n'importe quel enregistrement dans la liste pour le charger rapidement dans l'éditeur et continuer là où vous vous étiez arrêté, sans ré-importation.

Détails de la fenêtre de prévisualisation

Survolez un enregistrement d'historique pour voir sa fenêtre de prévisualisation. Dans la fenêtre de prévisualisation, vous pouvez :

1. Modifier le titre directement : Cliquez sur le texte du titre pour modifier instantanément le nom du travail.
2. Voir le statut de partage : Les icônes indiquent si le travail est actuellement partagé.
3. Actions rapides : Accédez aux raccourcis d'édition, de suppression et autres.

Historique : Aperçu rapide et gestion des travaux passés

4. Éditeur visuel

Le cœur de HtmlDrag est un puissant éditeur WYSIWYG qui vous permet de travailler directement dans un environnement HTML réel, éliminant le besoin d'édition de code.

4.1 Vue d'ensemble de l'interface de l'éditeur

L'éditeur utilise une disposition classique à trois colonnes : navigation à gauche avec historique des travaux, zone de prévisualisation du canevas au centre, et panneau fonctionnel à droite. Les barres supérieure et inférieure fournissent les actions de travail et les contrôles d'édition.

Interface de l'éditeur : Navigation à gauche, canevas au centre, panneau à droite

Navigation à gauche et historique

La navigation à gauche fournit des points d'accès rapides. Cliquez sur « Mes travaux » pour développer votre liste d'historique de travaux pour une navigation et un changement rapides. Les travaux partagés affichent un badge « Partagé » pour vous aider à gérer le statut de partage.

Zone de canevas centrale

Le canevas est la fenêtre de prévisualisation en direct où vous pouvez directement sélectionner, faire glisser et éditer les éléments de la page. Il prend en charge les opérations de zoom et de panoramique via le contrôleur de zoom en bas. Toutes les modifications sont reflétées en temps réel.

Panneau droit (Édition / Composants / Calques / Bibliothèque)

Le panneau droit contient quatre onglets : Édition (ajustements de style et bascules de mode), Composants (insérer de nouveaux éléments), Calques (liste des calques et opérations par lot), et Bibliothèque (bibliothèque de composants personnels). Cliquez sur n'importe quel onglet pour basculer entre les fonctionnalités.

Barre de titre supérieure et actions

La barre supérieure affiche le titre du travail (double-cliquez pour éditer), avec des boutons d'action à droite pour partager, télécharger en image et télécharger en HTML. Certaines fonctionnalités nécessitent les privilèges du Pro.

Barre d'outils inférieure

La barre d'outils inférieure fournit des boutons Aperçu (s'ouvre dans une nouvelle fenêtre), Annuler, Rétablir, Actualiser l'aperçu, Restaurer le dernier état enregistré, Restaurer le HTML initial et Enregistrer pour les contrôles d'édition principaux.

4.2 Opérations de base

HtmlDrag fournit des opérations visuelles intuitives — survol, simple clic, double-clic et clic droit couvrent la plupart des tâches d'édition.

Reconnaissance d'éléments

Survolez n'importe quel élément sur le canevas avec votre souris, et le système le détecte automatiquement et affiche une bordure en pointillés pour vous aider à identifier rapidement les éléments actionnables. La reconnaissance couvre le texte, les images, les boutons, les conteneurs et autres éléments HTML.

Reconnaissance d'élément : Une bordure en pointillés apparaît au survol

Mode glisser

Un simple clic sur n'importe quel élément pour entrer en mode glisser, qui affiche une bordure de sélection avec huit poignées de redimensionnement. Vous pouvez : faire glisser l'élément pour le repositionner ; faire glisser les poignées d'angle pour redimensionner proportionnellement ; faire glisser les poignées de bord pour redimensionner dans une direction. Lorsqu'il est sélectionné, le panneau « Édition » à droite affiche les propriétés de style de l'élément pour ajustement.

Mode glisser : Cliquez pour sélectionner, déplacer et redimensionner librement

Mode édition

Double-cliquez sur un élément de texte pour entrer en mode édition — le curseur se positionnera à l'intérieur du texte pour une édition directe. En mode édition, le panneau droit affiche les outils de style de texte pour la police, la taille, la couleur, le gras, l'italique et plus encore. Cliquez en dehors de l'élément ou appuyez sur Échap pour quitter le mode édition.

Mode édition : Double-cliquez pour entrer, éditez le texte directement

Menu contextuel

Faites un clic droit sur un élément sélectionné pour ouvrir le menu contextuel, offrant un accès rapide à Copier, Coller, Ajouter à la bibliothèque, édition de lien, opérations de calque, Verrouiller, Masquer, Supprimer et plus encore. Voir 4.9 Menu contextuel pour plus de détails.

Sélection multiple

Maintenez Maj et cliquez sur plusieurs éléments pour les sélectionner ensemble pour des opérations par lot. En mode sélection multiple, le panneau droit affiche des outils d'alignement (aligner les bords gauche/droit/haut/bas, centrer horizontalement/verticalement, distribuer horizontalement/verticalement) pour un arrangement rapide de la mise en page.

Sélection multiple : Maintenez Maj et cliquez pour sélectionner plusieurs éléments

4.3 Barre de raccourcis Mes travaux

La barre de raccourcis « Mes travaux » à gauche vous permet de développer/réduire la liste des travaux et de basculer entre les travaux rapidement, facilitant les transitions fluides entre plusieurs créations.

Développer et réduire

Cliquez sur le bouton « Mes travaux » en haut à gauche pour développer la liste de travaux de la barre latérale. Cliquez à nouveau ou cliquez en dehors de la barre latérale pour la réduire. Lorsqu'elle est développée, vous pouvez parcourir visuellement les miniatures et les titres de vos travaux d'historique.

Changer de travail

Cliquez sur n'importe quelle carte de travail dans la liste pour charger immédiatement son contenu dans l'éditeur. Cela vous permet de comparer et modifier rapidement différents brouillons de design sans retourner à la page d'accueil ou au profil.

4.4 Raccourcis du canevas

Maîtriser les raccourcis clavier peut considérablement améliorer votre efficacité d'édition. Voici les principaux raccourcis pris en charge dans la zone du canevas :

4.5 Panneau droit - Onglet Édition

L'onglet « Édition » est la zone la plus fréquemment utilisée, fournissant des bascules de mode et des outils d'ajustement de style riches. Après avoir sélectionné un élément, le panneau affiche intelligemment les options d'édition en fonction du type d'élément.

Onglet Édition : Bascules de mode et outils de style

Bascules de mode

Le haut du panneau fournit quatre interrupteurs de mode pour contrôler le comportement d'interaction de l'éditeur. Chaque bascule peut être activée ou désactivée indépendamment, avec une notification de message indiquant l'état actuel.

Conseil : La navigation des liens est désactivée par défaut lors de l'édition pour permettre l'édition des composants. Pour suivre les liens, activez l'interrupteur « Navigation des liens » dans le panneau Édition. La soumission de formulaire est également bloquée en mode édition pour protéger votre contenu.

Style de texte

Après avoir sélectionné un élément de texte ou entré en mode édition, le panneau affiche des outils de style de texte complets avec les options de formatage suivantes :

Style de texte : Paramètres de police, taille, couleur

Style d'élément

Après avoir sélectionné n'importe quel élément, utilisez les outils de style d'élément pour ajuster son apparence :

Style d'image

Après avoir sélectionné un élément image, ajustez les options d'affichage et remplacez l'image :

Style de tableau

Lorsqu'un tableau ou une cellule de tableau est sélectionné, des outils d'édition de tableau dédiés deviennent disponibles. Pour des instructions détaillées, voir 4.10 Édition de tableau.

Style de tableau : Opérations de lignes/colonnes, bordures et paramètres de cellule

Édition de lien

Ajoutez des liens cliquables de navigation à n'importe quel élément, ou éditez les liens existants :

Outils d'alignement (Sélection multiple)

Lorsque plusieurs éléments sont sélectionnés, le panneau affiche des outils d'alignement et de distribution pour vous aider à organiser rapidement les mises en page d'éléments :

4.6 Panneau droit - Onglet Composants

L'onglet « Composants » fournit des options d'insertion rapide pour différents types d'éléments, vous aidant à ajouter rapidement du nouveau contenu au canevas. Cliquez sur un bouton pour insérer le composant correspondant.

Onglet Composants : Insérer divers éléments en un clic

4.7 Panneau droit - Onglet Calques

L'onglet « Calques » fournit une vue en liste de tous les éléments modifiables sur le canevas, prenant en charge le filtrage, les opérations par lot et le positionnement précis — un outil puissant pour gérer les éléments de page complexes.

Onglet Calques : Gestion des calques et opérations par lot

Liste de cartes d'éléments

Le panneau affiche tous les éléments gérables sous forme de cartes. Chaque carte montre le type de balise de l'élément (par ex., DIV, IMG, SPAN) et le niveau de calque, avec un aperçu du contenu pour les éléments de texte. Les éléments de calque décoratif sont marqués d'un badge « Décoratif ». Des icônes rapides de verrouillage/déverrouillage et masquer/afficher apparaissent sur le côté droit de chaque carte.

Options de filtre

Cliquez sur le bouton de filtre pour filtrer la liste par état d'élément, avec les options suivantes :

Opérations par lot

Après avoir sélectionné plusieurs éléments dans la liste de cartes, utilisez les boutons d'opération par lot pour un traitement unifié :

Bascule de précision

L'onglet Calques fournit une bascule de précision pour contrôler la précision de reconnaissance des éléments :

Cliquer sur une carte pour localiser

Cliquez sur n'importe quelle carte d'élément pour faire défiler automatiquement le canevas et mettre en évidence l'élément correspondant, facilitant la localisation rapide de composants spécifiques sur la page. C'est particulièrement utile lorsque vous travaillez avec des mises en page complexes ou en couches.

4.8 Panneau droit - Onglet Bibliothèque

L'onglet « Bibliothèque » est votre bibliothèque de composants personnels où vous pouvez enregistrer des éléments ou composants fréquemment utilisés pour les réutiliser dans différents travaux, augmentant votre efficacité créative.

Onglet Bibliothèque : Bibliothèque de composants personnels

Liste des composants favoris

Le panneau affiche tous vos composants enregistrés sous forme de cartes, chacune montrant une miniature et un nom. Les miniatures sont générées automatiquement lors de l'enregistrement ; les composants non nommés s'affichent comme « Sans titre ».

Rechercher dans les favoris

Utilisez la zone de recherche pour trouver rapidement des composants enregistrés par nom. La liste se filtre en temps réel pendant que vous tapez.

Insérer un composant favori

Cliquez sur le bouton « Insérer » sur une carte de bibliothèque pour ajouter ce composant au canevas actuel. Les composants insérés peuvent être édités et ajustés normalement.

Renommer / Supprimer les favoris

Chaque carte de bibliothèque offre des options « Renommer » et « Supprimer ». Renommer rend les composants plus faciles à trouver plus tard ; la suppression retire définitivement le composant enregistré — utilisez avec précaution.

Comment ajouter à la bibliothèque

Sélectionnez n'importe quel élément sur le canevas, puis choisissez « Ajouter à la bibliothèque » dans le menu contextuel pour enregistrer cet élément et ses enfants comme un composant. Une confirmation « Ajouté à la bibliothèque » apparaît en cas de succès.

4.9 Menu contextuel

Un clic droit sur un élément sélectionné ouvre le menu contextuel, offrant un accès rapide aux actions courantes. Le contenu du menu s'ajuste dynamiquement en fonction du type d'élément sélectionné.

Menu contextuel : Accès rapide aux actions courantes

Menu spécifique aux tableaux

Lors d'un clic droit sur une cellule de tableau, le menu affiche des opérations supplémentaires spécifiques aux tableaux :

4.10 Édition de tableau

Lorsqu'un tableau ou une cellule de tableau est sélectionné, le panneau droit affiche des outils d'édition de tableau dédiés avec des fonctionnalités complètes de style et d'ajustement de structure de tableau.

Édition de tableau : Opérations de lignes/colonnes et paramètres de style

Opérations de lignes et colonnes

La section « Lignes et colonnes » du panneau d'édition de tableau fournit :

Fusionner / Diviser les cellules

Après avoir sélectionné plusieurs cellules adjacentes, utilisez « Fusionner les cellules » pour les combiner en une seule. Pour les cellules fusionnées, utilisez « Diviser la cellule » pour les restaurer aux multiples cellules originales.

Alignement de cellule

Définissez l'alignement du contenu de la cellule dans deux dimensions :

Style de bordure

Personnalisez l'apparence de la bordure du tableau incluant :

Cliquez sur « Appliquer » pour enregistrer les modifications.

Arrière-plan de cellule

Définissez la couleur d'arrière-plan de la cellule en utilisant le sélecteur de couleur — idéal pour mettre en évidence les en-têtes ou les lignes de données importantes.

4.11 Contrôle du zoom et fenêtre d'affichage

Le contrôleur de zoom en bas du canevas permet le réglage du zoom et de la taille de la fenêtre d'affichage, vous aidant à prévisualiser votre travail à différentes tailles d'appareil.

Contrôle du zoom : Ajustez le zoom du canevas et la taille de la fenêtre d'affichage

Zoom avant / Zoom arrière / Réinitialiser

Utilisez les boutons « + » et « − » pour zoomer en avant ou en arrière sur la vue du canevas, ou maintenez Ctrl/Cmd + molette de souris pour zoomer rapidement. Cliquez sur le pourcentage pour réinitialiser le zoom par défaut. Maintenez Espace + glisser pour panoramiquer le canevas.

Préréglages de taille de fenêtre d'affichage

Cliquez sur le sélecteur de fenêtre d'affichage pour basculer entre les tailles de prévisualisation, simulant l'affichage sur différents appareils :

Correctifs de prévisualisation

Pour les pages HTML avec des structures spéciales, trois correctifs de prévisualisation sont disponibles pour optimiser l'affichage. Activer ou désactiver les correctifs enregistrera automatiquement et actualisera la prévisualisation :

Conseil : Si les correctifs ne montrent pas d'effet notable, essayez d'abord « Restaurer le HTML initial », puis réactivez le correctif.

4.12 Éditeur HTML

L'Éditeur HTML vous permet de voir et d'éditer directement le code source HTML complet de votre travail — idéal pour les utilisateurs avancés nécessitant des ajustements fins ou des ajouts de code personnalisé. Cette fonctionnalité est réservée au Pro.

Éditeur HTML : Éditez le code source directement (Pro)

Voir / Éditer le HTML complet

Lorsque vous ouvrez l'Éditeur HTML, le code source HTML complet (y compris <!DOCTYPE html>) s'affiche. Vous pouvez éditer le code directement ; l'enregistrement applique vos modifications.

Rechercher et remplacer

Utilisez Ctrl+F pour ouvrir la recherche, en entrant des mots-clés pour localiser rapidement le code. Utilisez Ctrl+H pour ouvrir le remplacement pour le remplacement de texte par lot. La barre d'outils affiche le nombre de correspondances (par ex., « 3 / 15 »), avec des options pour individuel ou tout remplacer.

Aller à la ligne

Utilisez Ctrl+G ou la fonctionnalité de saut de la barre d'outils pour entrer un numéro de ligne et naviguer rapidement vers cette ligne — utile pour les grands fichiers HTML.

Respecter la casse

Activez l'option « Respecter la casse » pendant la recherche pour correspondre précisément au contenu sensible à la casse.

Retour à la ligne

Lorsque le retour à la ligne est activé, les longues lignes de code s'ajustent automatiquement pour la visualisation sans défilement horizontal.

Copier / Enregistrer

Cliquez sur « Copier HTML » pour copier le code source complet dans le presse-papiers. Après l'édition, cliquez sur Enregistrer pour appliquer les modifications. Si le contenu est vide ou contient des erreurs de syntaxe, des messages appropriés apparaîtront.

Remarque : Si le contenu HTML dépasse les limites de stockage, l'enregistrement affichera « Stockage insuffisant, impossible d'enregistrer cette modification. » Supprimez le contenu inutile ou mettez à niveau votre plan pour augmenter la capacité.

4.13 Barre d'outils inférieure

La barre d'outils inférieure fournit les boutons d'action principaux de l'éditeur, y compris les fonctions de prévisualisation, annuler/rétablir, restaurer et enregistrer.

Barre d'outils inférieure : Prévisualiser, enregistrer et restaurer

Aperçu (S'ouvre dans une nouvelle fenêtre)

Cliquez sur le bouton de prévisualisation pour ouvrir un aperçu complet de votre travail dans une nouvelle fenêtre, montrant le résultat d'affichage réel. La page d'aperçu affiche un avis d'aperçu temporaire rappelant aux utilisateurs qu'il s'agit d'un aperçu de phase d'édition avec un lien non réutilisable.

Annuler / Rétablir

Annuler revient sur la dernière opération ; Rétablir restaure une opération annulée. Prend en charge plusieurs étapes d'annulation/rétablissement. Également disponible via Ctrl+Z (annuler) et Ctrl+Y (rétablir).

Actualiser l'aperçu

Cliquer sur actualiser recharge la zone d'aperçu. Le système enregistre d'abord le contenu actuel, puis actualise le canevas pour afficher le dernier état. Utile après des éditions extensives pour synchroniser l'affichage.

Restaurer le dernier état enregistré

Restaure le travail au dernier état enregistré manuellement. Toutes les éditions non enregistrées seront perdues — utilisez avec précaution. Le système demande une confirmation avant l'exécution.

Restaurer le HTML initial

Restaure le HTML du travail à son état original lors de sa création. Tout l'historique d'édition sera effacé. Cette action est irréversible — assurez-vous d'avoir sauvegardé le contenu important.

Enregistrer

Enregistre manuellement toutes les modifications actuelles. Le système prend également en charge l'enregistrement automatique, mais l'enregistrement manuel après des éditions importantes est recommandé pour assurer la sécurité des données. « Enregistrement réussi » apparaît à la fin.

4.14 Barre d'outils supérieure

La barre d'outils supérieure affiche les informations du travail et les boutons d'action rapide, offrant un accès rapide aux fonctionnalités de partage et de téléchargement.

Barre d'outils supérieure : Titre, partager et télécharger

Titre du travail (Double-cliquez pour éditer)

Le haut affiche le titre du travail actuel ; double-cliquez sur la zone du titre pour entrer en mode édition et changer le nom. Le titre ne peut pas être vide ; « Titre mis à jour avec succès » apparaît en cas de succès. Les travaux non nommés s'affichent comme « Travail sans titre ».

Bouton Partager

Cliquez sur le bouton partager pour activer le partage du travail et générer un lien accessible. Voir 4.16 Fonctionnalité de partage pour les détails. Cette fonctionnalité est réservée au Pro.

Boutons de téléchargement

Le côté droit fournit des boutons « Télécharger en image » et « Télécharger en HTML ». Voir 4.15 Télécharger le travail pour les détails.

4.15 Télécharger le travail

HtmlDrag offre des options d'exportation flexibles, vous permettant de télécharger votre travail en tant qu'image ou fichier HTML standard pour le partage, l'archivage ou le développement ultérieur.

Cliquez sur le bouton « Télécharger en image » dans la barre supérieure pour générer et télécharger une image PNG de haute qualité de tout le contenu du canevas. C'est parfait pour les présentations de design, le partage sur les réseaux sociaux ou les aperçus.

Télécharger en HTML

Les utilisateurs du Pro peuvent exporter les travaux en tant que fichiers source HTML standard. Cliquer sur le bouton « Télécharger en HTML » offre deux options :

1. Télécharger le HTML actuel : Inclut toutes les modifications et ajustements que vous avez effectués dans l'éditeur — ce que vous voyez est ce que vous obtenez.
2. Télécharger le HTML original : Exporte le code original du moment où le travail a été créé, sans les éditions ultérieures.

Options de téléchargement : Choisissez entre la version éditée actuelle ou la version originale

4.16 Fonctionnalité de partage

La fonctionnalité de Partage vous permet de générer un lien accessible publiquement pour votre travail, facilitant le partage de créations. La page de partage fournit également des statistiques d'accès. Cette fonctionnalité est réservée au Pro.

Paramètres de partage : Gérez le lien et le statut

Paramètres et gestion

1. Activer le partage : Cliquez sur le bouton partager pour générer un lien de partage unique. À la première activation, « Partage activé, lien copié dans le presse-papiers » apparaît.
2. Validité : Les liens de partage sont valides 7 jours par défaut. Vous pouvez voir l'heure d'expiration spécifique dans la boîte de dialogue de partage.
3. Mettre à jour le temps : Si le lien est sur le point d'expirer ou si vous voulez l'étendre, cliquez sur « Mettre à jour le lien » pour réinitialiser la période de validité.
4. Arrêter le partage : Cliquez sur « Arrêter le partage » pour invalider immédiatement le lien actuel, empêchant tout accès ultérieur.
5. Copier le lien : Cliquez sur le bouton copier pour copier le lien de partage dans votre presse-papiers.

Page de partage et statistiques

Les visiteurs ouvrant le lien de partage verront une page de présentation autonome. La barre latérale droite affiche les informations du travail, incluant :

1. Titre et auteur : Affiche votre pseudo et le titre du travail.
2. Statistiques : Consultez les Vues et les J'aime pour suivre la popularité.
3. Expiration : Affiche quand le lien de partage expirera.

Page de partage : Vue visiteur et statistiques

Remarque : Si un travail est signalé et vérifié pour des violations de politique, le système peut désactiver le partage pour ce travail avec le message « Ce travail a été signalé et vérifié, le partage a été désactivé par le système. »

5. Autres fonctionnalités

En plus des fonctionnalités d'édition principales, HtmlDrag fournit également des fonctionnalités de messages et de retours d'information pour vous aider à rester informé et à communiquer avec nous.

5.1 Messages

Le module Messages reçoit les notifications système importantes, y compris l'état du compte, les rappels de paiement, les alertes d'expiration d'abonnement et les mises à jour de fonctionnalités.

Messages : Recevez les notifications et alertes système

Liste des messages système

La liste des messages est triée chronologiquement, affichant le titre, le résumé, l'heure de création et l'heure d'expiration. Cliquez sur un message pour voir les détails ou effectuer des actions (par ex., « Continuer le paiement », « Renouveler maintenant »).

Filtre non lus

Cochez la case « Non lus uniquement » en haut à droite pour filtrer rapidement les messages non lus, vous aidant à vous concentrer sur les notifications importantes.

Tout marquer comme lu

Cliquez sur le bouton « Tout marquer comme lu » pour marquer instantanément tous les messages de la liste actuelle comme lus, effaçant les indicateurs de point rouge.

Détails du message

Cliquez sur une carte de message pour voir le contenu complet de la notification. Pour les messages de commande ou d'abonnement, les détails incluent souvent des boutons d'action rapide pour votre commodité.

5.2 Retours d'information

Si vous rencontrez des problèmes ou avez des suggestions, soumettez-les via le module Retours d'information. Vous pouvez télécharger des images pour mieux décrire votre problème.

Retours d'information : Soumettez des problèmes ou des suggestions

Liste des retours et statut

La liste affiche votre historique de soumissions et le statut actuel :

1. En cours : Retour soumis, en attente de révision par l'administrateur.
2. Répondu : L'administrateur a répondu ; cliquez pour voir.
3. Fermé : Retour archivé ou résolu ; aucune autre réponse autorisée.

Soumettre un nouveau retour

Cliquez sur « Nouveau retour », entrez votre contenu (requis, min 10 caractères). Vous pouvez « Télécharger des images » (max 2 Mo chacune) pour fournir des captures d'écran. Cliquez sur « Soumettre le retour » lorsque vous avez terminé.

Détails du retour et conversation

Cliquez sur un élément de la liste pour voir l'historique complet de la conversation, y compris vos messages et les réponses de l'administrateur. Le haut affiche l'ID du retour et les pièces jointes.

Continuer la réponse

Pour les retours « En cours » ou « Répondu », utilisez la zone de saisie en bas pour fournir plus d'informations ou répondre à l'administrateur jusqu'à ce que le problème soit résolu.

6. Conseils système

Pendant l'utilisation, vous pouvez rencontrer des alertes ou des limites système. Voici des explications et des suggestions pour les conseils système courants.

6.1 Alertes de détection HTML

Pour garantir la qualité d'importation et la stabilité de l'éditeur, le système analyse automatiquement les URLs et les fichiers, vous alertant des problèmes potentiels.

Détection de ressources locales

Si une page contient des chemins locaux (par ex., file:// ou C:/), les ressources ne se chargeront pas. Suggestion : Assurez-vous que toutes les ressources utilisent des liens HTTP/HTTPS publics.

Protection anti-hotlink d'images

Certains sites bloquent l'accès externe aux images. Suggestion : Utilisez « Remplacer l'image » pour télécharger des fichiers locaux ou les héberger sur un service public.

Pages à rendu dynamique (SPA)

Les pages reposant entièrement sur JavaScript (SPA) peuvent s'importer vides ou incomplètes car le DOM dynamique n'est pas capturé directement. Suggestion : Utilisez « Coller du code » en copiant le HTML rendu depuis votre navigateur.

Polices externes / Bibliothèques d'icônes

Les polices ou icônes avec des en-têtes CORS manquants peuvent s'afficher incorrectement. Suggestion : Remplacez-les par des polices système ou des icônes de bibliothèque dans l'éditeur.

Contenu intégré (iframe)

Pour la sécurité, certains contenus iframe peuvent être bloqués ou non interactifs. Le système préserve les espaces réservés lorsque possible.

6.2 Stockage et limites

HtmlDrag applique des quotas de ressources basés sur votre plan. Vous pouvez voir des alertes « Limite de stockage atteinte » ou « Limite de travaux atteinte ».

Limite de stockage atteinte

Vous ne pouvez pas enregistrer d'éditions ni télécharger de fichiers lorsque vous n'avez plus d'espace. Solution :

1. Supprimez les anciens éléments dans « Portfolio » pour libérer de l'espace.
2. Cliquez sur « Mettre à niveau maintenant » dans la boîte de dialogue pour obtenir plus de capacité avec un Pro.

Limite du nombre de travaux

Les utilisateurs du Free ont une limite sur le nombre de travaux enregistrés. Supprimez les anciens travaux ou mettez à niveau pour augmenter cette limite.

Limites de téléchargement d'images

Le système vérifie la taille de fichier unique et les limites par lot. Si vous voyez « La taille du fichier dépasse la limite » ou « Taille du lot dépassée », compressez les images ou téléchargez en plus petits lots. Les utilisateurs du Pro bénéficient de limites plus élevées.

6.3 Analyse de sécurité

L'Analyse de sécurité intégrée évalue automatiquement le risque du contenu lors de l'importation d'URLs, du téléchargement de fichiers ou du collage de code pour protéger votre compte.

Niveau de risque

Basé sur des menaces comme XSS, scripts malveillants ou balises dangereuses, les risques sont classés comme :

1. Risque faible : Avertissements mineurs ; généralement sûr de continuer.
2. Risque moyen : Problèmes potentiels ; procédez avec prudence.
3. Risque élevé : Risques sévères ; procédez uniquement si la source est de confiance.
4. Risque critique : Contient des malwares ou du contenu de phishing ; bloqué immédiatement.

Mode sécurisé

Pour les fichiers avec un certain risque, le système offre des « Mesures de sécurité » comme la Sanitisation automatique. Vous pouvez choisir de « Continuer en mode sécurisé », où le système supprime le code dangereux tout en préservant la mise en page et la capacité d'édition.

Commencez avec HtmlDrag

HtmlDrag offre un niveau gratuit généreux. Les nouveaux utilisateurs reçoivent des crédits bonus à l'inscription

pour essayer le Générateur IA et l'Importation URL. L'édition visuelle est entièrement gratuite sans limites.

Commencez à créer maintenant

Le Guide utilisateur de HtmlDrag couvre l'inscription et la connexion au compte, la gestion du profil, le Générateur IA, l'Importation URL, le Téléchargement HTML, le Collage de code, l'Abonnement et les opérations complètes de l'éditeur visuel incluant la reconnaissance d'éléments, le glisser-déposer et le redimensionnement, l'édition de texte, le remplacement d'images, les ajustements de style, la gestion des calques, l'édition de tableaux, l'édition du code source HTML et le partage/exportation. Parfait pour les développeurs indépendants, les marketeurs et les designers pour démarrer rapidement.