Dans le monde du développement WordPress, disposer des bons outils peut faire toute la différence. C'est pourquoi nous sommes ravis d'annoncer le lancement de la nouvelle application Code d'Assistant, un outil polyvalent et puissant conçu pour rationaliser votre flux de travail de codage et faciliter la gestion des extraits de code dans WordPress.

L'application Code est située dans le plugin Assistant et vous permet de créer, modifier et gérer des extraits de code CSS et JavaScript pour votre site Web. Avec l'application Code, vous pouvez facilement ajouter de nouveaux extraits, les attribuer à des sections spécifiques et contrôler leur statut d'activation. Les fonctionnalités incluent la duplication, l'exportation et l'enregistrement d'extraits dans une bibliothèque (avec Assistant Pro). L'interface intuitive garantit un basculement rapide entre les extraits activés et désactivés, rationalisant ainsi le processus de personnalisation de votre site Web.

Plongeons-nous et explorons certaines de ses fonctionnalités et capacités innovantes :

Qu'est-ce que l'application Assistant Code ?

Vous savez peut-être déjà que vous pouvez enregistrer des extraits de code dans les bibliothèques Assistant Pro. Désormais, avec l'ajout de l'application Code, vous pouvez facilement ajouter, modifier et gérer les extraits de code de votre site WordPress, le tout dans le plugin Assistant :

L'application Code remplace le besoin de plusieurs plugins et améliore votre productivité en enregistrant tous les extraits de code de vos sites Web dans un emplacement facile d'accès.

• Gestion facile des extraits de code : gérez le code CSS et JavaScript de votre site Web directement dans l'application Code. Plus besoin de jongler avec plusieurs outils et plateformes, tout ce dont vous avez besoin est à portée de main.
• Enregistrez des extraits de code dans Assistant Pro Cloud : l'application Assistant Code s'intègre de manière transparente à votre compte Assistant Pro, vous permettant d'enregistrer et d'organiser vos extraits de code dans les bibliothèques cloud. Rationalisez votre flux de travail en réutilisant facilement des extraits de code sur plusieurs projets de sites Web, ce qui vous fait gagner un temps précieux.
• Collaborez avec votre équipe : la collaboration est essentielle et notre application Code facilite plus que jamais le travail avec votre équipe. Avec l'édition en temps réel, vous pouvez collaborer sur votre site WordPress en temps réel et rester synchronisé avec votre équipe, où que vous soyez.

En plus de ces fonctionnalités, Assistant's Code App offre également une interface élégante et intuitive conçue pour les développeurs. Que vous soyez un professionnel chevronné ou un débutant, nous pensons que vous trouverez notre application Code facile à naviguer et à utiliser.

Comment ajouter un extrait de code dans WordPress

L'application Assistant Code offre un moyen transparent d'améliorer votre site Web avec des extraits CSS et JavaScript personnalisés. Pour commencer, c'est simple :

Étape 1 : Ouvrez l'application Code dans l'Assistant

Si vous ne l'avez pas déjà fait, installez et activez le plugin Assistant. Une fois installé, cliquez sur l'icône en forme de crayon pour ouvrir la barre latérale de l'Assistant. Accédez à Applications et paramètres, puis cliquez sur Code dans la liste des applications :

Notez que si vous souhaitez que l'icône de l'application Code s'affiche dans la barre latérale, vous pouvez réorganiser les applications en faisant glisser l'application Code vers le haut de la liste :

Étape 2 : créez un extrait de code à l'aide de l'application Code

Nous sommes maintenant prêts à créer notre premier extrait de code. Dans cet exemple, créons un fichier CSS en nous assurant d'abord que l'onglet CSS est sélectionné, puis en saisissant un titre et en cliquant sur le bouton Retour :

Sur l'écran suivant, vous verrez que l'application Code accepte les éléments suivants :

• Titre : il s'agit du nom unique de votre extrait de code.
• Description : Expliquez à quoi sert le code ou toute autre information importante dont vous ou votre équipe devez vous souvenir :

• Extrait de code : saisissez votre extrait de code dans le bloc de code :

Faites défiler jusqu'à la section Emplacement et attribuez le statut et les règles à votre extrait :

• Statut : basculez sur Activer ou Désactiver le statut de l'extrait de code.
• Règles : Choisissez où vous souhaitez que cet extrait soit chargé. Cela ressemble aux règles de localisation Themer. Cliquez sur Ajouter une règle pour activer des règles supplémentaires.

Étape 3 : Cliquez sur Mettre à jour pour enregistrer vos modifications

Une fois que vous avez fini d'ajouter votre extrait de code dans l'application Assistant Code, cliquez sur le bouton Mettre à jour situé dans le coin supérieur droit pour enregistrer vos modifications :

Ensuite, actualisez votre page pour que vos modifications prennent effet.

Dupliquer, enregistrer dans la bibliothèque, exporter ou supprimer des extraits de code

Après avoir ajouté votre premier extrait de code à l'aide de l'application Code, explorons quelques fonctionnalités supplémentaires. Faites défiler la page au-delà de la section Emplacement pour trouver les options dans la section Actions :

Ici, vous pouvez gérer les paramètres des extraits de code tels que l'activation, la duplication, l'exportation ou l'enregistrement dans votre bibliothèque avec Assistant Pro, vous offrant ainsi un plus grand contrôle et une plus grande flexibilité sur les personnalisations de votre site Web.

• Dupliquer : créez une copie exacte de l'extrait de code actuel. Vous pouvez également cliquer sur l'icône en double lors de l'affichage de la vue Liste d'un type de code dans l'application Code.
• Enregistrer dans la bibliothèque : une connexion Assistant Pro est requise pour enregistrer dans une bibliothèque cloud. Lorsque vous enregistrez un extrait de code dans une bibliothèque, l'emplacement que vous avez attribué à l'extrait de code n'est pas enregistré. Lorsque vous importez un extrait d'une bibliothèque, vous devrez ensuite attribuer l'extrait à un emplacement.
• Exporter : exportez le fichier d’extrait de code sous forme de fichier .txt.
• Supprimer : cela supprimera définitivement l'extrait de code de l'Assistant. Vous verrez un message de confirmation pour vous assurer que vous souhaitez supprimer l'extrait. Cette action ne peut pas être annulée.

Désormais, lorsque vous cliquez sur l'icône Code App, vous verrez tous vos extraits de code sous forme de liste et le tout au même endroit :

Notez que lorsque vous êtes en mode liste, vous avez la possibilité d'activer et de désactiver des extraits individuels sans avoir besoin de les modifier séparément, ce qui vous fait gagner du temps et des efforts. Si un extrait est désactivé, vous verrez Désactivé et s'il est activé, vous verrez Activé avec un point vert. Vous pouvez le basculer rapidement en cliquant sur cet indicateur.

Exemples d'extraits de code WordPress

Il existe de nombreux extraits de code CSS et JavaScript pour WordPress qui sont couramment utilisés pour améliorer les fonctionnalités, styliser les éléments ou ajouter de l’interactivité aux sites Web. Voici quelques exemples populaires :

Extraits de code CSS

• Polices personnalisées : implémentez des polices personnalisées à l'aide de CSS, à partir de Google Fonts ou d'autres sources.
• Formulaires de style : personnalisez l’apparence des formulaires sur votre site WordPress.
• Masquer les éléments : code CSS pour masquer des éléments ou des sections spécifiques de votre site.
• Animations : animations CSS ou transitions pour ajouter des effets visuels aux éléments.
• Effets de survol : ajoutez des effets de survol aux boutons, liens, images, etc.
• Personnalisation des menus de navigation : personnalisez les menus de navigation en fonction de la conception et de la mise en page de votre site.
• En-têtes/pieds de page collants : faites en sorte que les en-têtes ou les pieds de page collent en haut ou en bas de la page lorsque les utilisateurs font défiler.
• Mode sombre : implémentez un thème en mode sombre pour votre site à l'aide de CSS.

Extraits de code JavaScript

• Défilement fluide : code JavaScript pour permettre un défilement fluide lorsque les utilisateurs cliquent sur des liens internes.
• Chargement paresseux des images : implémentez le chargement paresseux pour améliorer les temps de chargement des pages en chargeant les images uniquement lorsqu'elles sont nécessaires.
• Fenêtres modales : créez des fenêtres modales ou des fenêtres contextuelles pour afficher du contenu ou des messages supplémentaires.
• Sections accordéon/réductibles : code JavaScript pour créer des sections de style accordéon qui se développent ou se réduisent lorsque vous cliquez dessus.
• Basculer la visibilité : code JavaScript pour basculer la visibilité des éléments sur la page.
• Défilement infini : chargez plus de contenu à mesure que les utilisateurs font défiler la page, sans avoir à cliquer sur les liens de pagination.
• Menus déroulants : améliorez les menus de navigation avec une fonctionnalité déroulante à l'aide de JavaScript.
• Curseur/Carrousel : créez des curseurs d'images ou des carrousels pour présenter le contenu de manière visuellement attrayante.
• Ajax Load More : chargez du contenu supplémentaire de manière dynamique sans recharger la page entière, utile pour les blogs ou les portfolios.

Ce ne sont là que quelques exemples, et il existe d’innombrables autres extraits CSS et JavaScript que vous pouvez utiliser pour personnaliser et améliorer votre site WordPress. Comme toujours, assurez-vous de faire une sauvegarde de votre site avant de commencer et assurez-vous que tout code que vous ajoutez est correctement testé et n'entre pas en conflit avec votre thème ou vos plugins existants.

Conclusion

Prêt à faire passer votre flux de travail de conception Web au niveau supérieur ? Ne cherchez pas plus loin que le dernier ajout de notre plugin Assistant, l' application Code . Que vous travailliez sur votre prochain projet WordPress ou que vous résolviez un problème de codage, cet outil est conçu pour rationaliser votre flux de travail et améliorer votre productivité.

Mais ce n'est pas tout : avec un compte Assistant Pro gratuit, vous débloquerez encore plus de fonctionnalités pour dynamiser votre processus de développement. Rejoignez d'autres développeurs Web pour récupérer un temps précieux et organiser vos projets sans effort. N'attendez plus, inscrivez-vous dès aujourd'hui et découvrez par vous-même la différence !