Utilisation du code HTML et du code personnalisé

Présentation

L'éditeur est flexible dans le sens où il vous permet de modifier le code existant ou d'ajouter le vôtre. Ainsi, vous pouvez à la fois élargir le champ de fonctionnalité de la plateforme et bénéficier de fonctionnalités supplémentaires. Vous pouvez par exemple ajouter un widget calendrier personnalisé, ou même un formulaire de contact personnalisé tiers qui vous permettra d'accepter les paiements sur votre site.

Cet article aborde 3 méthodes différentes pour l'ajout de code à votre site.

Le widget HTML

Le widget HTML est la méthode la plus simple pour ajouter du code à votre site. Faites simplement glisser le widget HTML dans une colonne ou une ligne de votre site et collez-y votre code.

Étapes du processus

  1. Vous pouvez taper HTML dans la barre de recherche de la section Widget pour trouver le widget HTMLd1_html_css_editor_1_1-1.png

  2. Faites glisser le widget HTML dans une colonne.d1_html_css_editor_1_1-2.png
  3. Insérez votre code dans le menu qui apparaît
    d1_html_css_editor_1_1-3.png

Modification de votre code personnalisé

Après avoir déposé votre code personnalisé via le widget HTML, vous devriez pouvoir simplement cliquer sur le widget dans votre éditeur pour modifier votre code.

Il arrive cependant qu'en raison de la nature du code, il soit impossible de le faire aussi facilement. Dans ce cas, vous pouvez essayer de sélectionner le conteneur pour voir si vous pouvez le modifier en entier (code inclus).

d1_html_css_editor_1_1-4.png

Modification du code incorporé

Vous pouvez modifier le code de n'importe quel élément incorporé à votre site en faisant un clic droit pour faire apparaître le menu contextuel. Vous pouvez ensuite cliquer sur Modifier HTML/CSS pour entrer dans le code brut de n'importe quel élément dans votre éditeur.

d1_html_css_editor_1_1-5.png

Ceci fera apparaître un éditeur de code contenant le code que vous souhaitez modifier. Notez qu'il est conseillé de lire la documentation avant de modifier quoi que ce soit.

d1_html_css_editor_1_1-6.png

Remarque sur l'édition des CSS

Bien que vous puissiez modifier les CSS dans le mode développeur, il est déconseillé d'ajouter de nouveaux sélecteurs dans ce menu. Vous pouvez sans problème ajouter ici de nouvelles règles aux sélecteurs.

Si vous voulez créer de nouveaux sélecteurs CSS, veuillez le faire en mode développeur.

Mode développeur

Pour afficher le code de l'ensemble de votre site dans l'éditeur, cliquez sur l'icône </> en haut à droite de votre écran.

d1_html_css_editor_1_1-7.png

Le code de votre site est divisé en sections pour permettre des ajustements précis.

d1_html_css_editor_1_1-8.png

Pour en savoir plus sur le mode développeur, veuillez lire notre documentation complète sur le mode développeur ici.

Quels sont les conseils à suivre pour un codage personnalisé ?

 

Dans cet article, vous trouverez des recommandations et des solutions concernant le codage personnalisé.