25 outils gratuits en ligne pour gagner du temps pour les développeurs WordPress • WPShout

Comme Fred l'a écrit dans un article précédent, l'apprentissage du développement WordPress est difficile. Il ne s'agit pas seulement de pouvoir écrire du code. Il existe un tas de compétences associées: analyse, conception, référencement, rédaction, expérience utilisateur, maintenance, etc.

Les développeurs WordPress doivent porter un certain nombre de chapeaux et ne peuvent pas être des experts en tout. Il est donc utile d'avoir des outils pour effectuer certains des travaux lourds et accélérer votre flux de travail.

Cet article présente 25 outils en ligne utiles au développement de WordPress.

Cet article présente 25 outils en ligne très utiles pour le développement de WordPress. Ma définition des «outils en ligne» ici ne fait pas inclure des plugins WordPress. Au lieu de cela, la plupart de ces outils sont des sites autonomes qui vous permettent de saisir des éléments et de produire quelque chose d'utile, que ce soit un extrait de code, un téléchargement, un morceau de texte reformaté ou simplement des informations utiles.

Beaucoup de ces outils ont été créés par d'autres développeurs qui avaient besoin de la chose X pour effectuer la tâche Y, et ils partagent leur travail avec la communauté des développeurs.

Le meilleur de tous, c'est que tous ces outils en ligne sont gratuits! Certains ont des versions de mise à niveau payantes si vous voulez plus de fonctionnalités.

Outils de développement WordPress: analyse

Étant donné que de nombreux projets de sites Web sont des remaniements, ces outils aident à examiner les sites Web existants.

Si vous rédigez une proposition et que vous n'avez pas encore accès à l'arrière-plan d'un site Web, vous pouvez regarder «sous le capot» d'un site, peut-être pour planifier la conception et la construction, ou pour étudier un concurrent.

1. Détecteur de thème WordPress

Il existe quelques sites qui effectuent une déduction de style Sherlock Holmes sur le thème d'un site Web WordPress. Mon préféré est le détecteur de thème WordPress.

Si le thème est accessible au public, il existe un lien de téléchargement.

Le détecteur peut également dire si un thème enfant est utilisé sur le site et identifier certains plugins.

2. BuiltWith

Un autre détective en ligne, BuiltWith, approfondit la technologie derrière un site.

Il peut détecter plus de plugins utilisés que WP Theme Detector et révéler des informations sur l'analyse, l'hébergement, le CDN utilisé, le type de serveur et plus encore. Vous pouvez également voir quels autres sites utilisent une technologie particulière.

Il existe des extensions pour Firefox et Chrome pour effectuer des recherches rapidement.

3. Unminify

Bien que le code minifié soit idéal pour un site rapide, il n'est pas facile à lire.

Vous pouvez inverser le processus avec Unminify.

Copiez et collez simplement le code dans la boîte, appuyez sur le bouton Unminify et hé hop! Code lisible clairement formaté.

Outils de développement WordPress: conception et développement

Ces outils aident avec les éléments frontaux et principaux du processus de création de site Web.

4. FontPair

Si vous (re) concevez un site Web, la typographie est un ingrédient clé. La plupart des développeurs connaissent les polices Google gratuites, mais rassembler les bonnes polices peut prendre un peu de réflexion.

FontPair offre le match parfait.

Sélectionnez simplement les types de polices Google que vous souhaitez associer (par exemple Serif + Sans Serif) et FontPair vous proposera quelques combinaisons agréables.

Il existe également un lien vers des ressources typographiques utiles sur le site Web si vous souhaitez approfondir le sujet.

5. GlyphSearch

Vous recherchez l'icône parfaite pour votre projet? GlyphSearch a une super recherche pour huit jeux d'icônes populaires, y compris Font Awesome, Ionicons et Foundation.

Selon votre cas d'utilisation, vous pouvez copier l'intégralité du balisage, de l'entité HTML, de l'hex et plus encore.

Les bibliothèques d'icônes sont tenues à jour afin que vous n'ayez à vous soucier de rien manquer.

6. Photos redimensionnées en masse

Que vous envisagiez d'utiliser un plugin de compression d'image ou non, Bulk Resize Photos est un site astucieux. Vous pouvez redimensionner une collection de photos à la même taille en quelques secondes – utile si vous créez une galerie de photos.

Le redimensionnement a lieu sur votre ordinateur local, il n'y a donc aucun problème de confidentialité et vous pouvez enregistrer vos paramètres en tant que préréglage pour les réutiliser.

7. Souligne

Underscores est un thème de démarrage bien codé qui constitue la base des thèmes par défaut de WordPress. Il est gratuit à utiliser pour vos propres projets.

Remplissez simplement quelques détails (Sass est facultatif) et vous serez récompensé avec un fichier zip de votre propre thème basé sur Underscores. Ajoutez simplement du code.

8. Plugin Boilerplate

Créé par Tom McFarlin et Devin Vinson, Plugin Boilerplate est un véritable gain de temps lorsque vous commencez à développer un nouveau plugin.

Remplissez les détails de votre plugin, cliquez sur le bouton Build Plugin et vous obtiendrez un fichier zip avec une structure de fichiers et de dossiers logique prête à l'emploi pour que vous puissiez commencer le développement. Bon codage!

9. GenerateWP

GenerateWP propose un ensemble complet d'outils pour générer rapidement des extraits de code WordPress.

Les générateurs comprennent ceux pour créer ou enregistrer:

• Plusieurs types de requêtes, y compris WP_Query et les classes associées
• Types de publication personnalisés et taxonomies personnalisées
• Action personnalisée et crochets de filtre
• Barres latérales personnalisées
• Scripts et styles

Une fonctionnalité particulièrement utile est que vous pouvez parcourir les extraits de code créés par d'autres développeurs dans l'archive des extraits. Clonez, téléchargez ou modifiez les extraits – à vous de choisir!

Si vous préférez que vos extraits générés restent privés, vous pouvez rejoindre en tant que membre premium pour aussi peu que 10 $ / mois (payé annuellement). Cela vous donne également accès à des générateurs premium qui ne sont pas disponibles pour les utilisateurs gratuits, au support et au stockage illimité d'extraits de code.

10. WP Hasty

Similaire à GenerateWP est WP Hasty. Il a quelques générateurs gratuits qui manquent à GenerateWP: un générateur d'élément Visual Composer et un générateur de messagerie WP.

Le plan Premium de WP Hasty offre 10 autres générateurs et d'autres avantages. Son prix est de 4 $ / mois.

11. Extension développeur Web

L'extension Web Developer de Chris Pederick est un couteau d'outils de l'armée suisse. Il est disponible pour les navigateurs Firefox, Chrome et Opera.

Parmi les goodies intégrés:

• Pipette à couleurs
• Règle
• Rechercher des ID en double
• Remplissez les champs du formulaire (utile pour tester rapidement les formulaires)
• Afficher les informations sur l'image

12. Constructeurs de requêtes SQL

La connaissance de SQL est une compétence essentielle lorsque vous devez sélectionner, insérer, mettre à jour ou supprimer dans la base de données WordPress – par exemple, si vous enregistrez des paramètres de plug-in ou des options de personnalisation de thème. (Cela peut également aider lors du nettoyage des plugins sans une routine de désinstallation appropriée.)

Les murs de connaissances fournissent un ensemble de générateurs de requêtes SQL pour vos requêtes, ainsi que de nombreux autres outils de manipulation de code.

13. Générateur de couleurs Sass

L'utilisation de Sass dans votre projet WordPress présente de nombreux avantages, dont la définition de valeurs de couleur et la possibilité de les manipuler avec des fonctions. Mais vous avez probablement du mal à visualiser la couleur «5% plus foncée».

C’est là que Sass Color Generator entre en jeu. Prenez le code hexadécimal d’une couleur et ajoutez un incrément de pourcentage et vous pouvez voir à quoi ressemblerait la couleur si elle était éclaircie, assombrie, saturée ou désaturée.

14. Cool HTML Tag et Attribute Online Stripper

J'ai parfois rencontré du code en désordre sur un site et j'ai eu besoin de le nettoyer lors d'une refonte. Par exemple:

• Publiez ou affichez du contenu avec de nombreux styles en ligne.
• Un document Google copié dans WordPress avec embêtant balises ajoutées.
• Contenu PDF collé dans WordPress rempli de balises indésirables, y compris les sauts de ligne.

J'ai trouvé un décapant de balise une aubaine en effectuant cette tâche.

Il existe quelques outils qui le font, mais j'aime les balises HTML cool et les attributs Stripper en ligne en raison des options que vous obtenez.

Il existe une liste prédéfinie de balises et d'attributs à conserver, mais vous pouvez les modifier ou les supprimer tous en fonction de votre objectif. (Vous devez garder le href attribut avec le par exemple.)

Outils de développement WordPress: test

Ces outils de test enregistrent l'apparence visuelle d'un site Web ou analysent le code pour les erreurs.

15. FireShot

FireShot est l'un de mes outils préférés. C'est mon extension de navigateur préférée pour prendre des captures d'écran en pleine page. Dix navigateurs différents sont pris en charge.

Il existe une version Pro que vous pouvez utiliser pour annoter vos captures d'écran, ainsi que d'autres avantages.

16. Navigateurs

Browsershots est un outil de vérification de sites Web sur différents navigateurs et systèmes d'exploitation (Windows, Mac et Linux).

Une gamme de navigateurs est couverte, y compris Chrome, Firefox, Safari et Opera. Il manque notamment Edge et IE, et aucun navigateur mobile n'est testé.

Browsershots sert vos captures d'écran après quelques minutes et vous avez peu de temps pour les télécharger.

Si vous avez besoin de tests supplémentaires sur différents navigateurs et appareils, vous pouvez consulter un essai gratuit de Cross Browser Testing.

17. W3C Nu HTML Checker

Pourquoi devriez-vous valider votre code? Parce qu'un code valide est plus susceptible d'être convivial pour le référencement, compatible avec plusieurs navigateurs, s'exécute plus rapidement et est plus accessible.

Le vérificateur Nu HTML est le successeur de l'ancien validateur W3C. Le nom est trompeur: il vérifie les erreurs de code HTML, CSS ou SVG.

18. JSLint

JSLint scanne le code JavaScript et propose des suggestions pour le rendre plus propre et plus propre.

Vous voyez trop d'avertissements? Au bas de l'interface, il y a des cases à cocher où vous pouvez demander à JSLint d'ignorer certains facteurs dans son évaluation.

19. Diffchecker

Si vous n'avez pas votre IDE préféré à portée de main pour comparer les fichiers, Diffchecker fera le travail.

Collez dans deux fichiers texte, qui peuvent inclure du code. L'outil vous montrera les différences entre les deux. Si vous créez un compte gratuit, vous pouvez enregistrer les différences.

Il fonctionne également en ligne pour les images et les PDF. Vous pouvez également installer une version d'interface de ligne de commande via Node.js et npm.

Il existe une version de bureau avec plus de fonctionnalités que vous pouvez essayer gratuitement pendant 30 jours ou acheter pour 49 $.

Outils de développement WordPress: Production

Lorsque vous avez terminé la création du site, ces outils optimisent votre code et vous préparent au lancement.

20. Minify

Si vous ne réduisez pas votre CSS et JS avec des outils de ligne de commande ou un plug-in de mise en cache, vous pouvez utiliser Minify pour terminer la tâche.

21. Convertisseur CSS en Sass / SCSS

Vous n'avez pas maîtrisé la syntaxe Sass? Le convertisseur CSS vers Sass / SCSS transformera votre code CSS en Sass ou SCSS – vous choisissez lequel.

22. Le générateur de compte administrateur WordPress

Le générateur de compte administrateur WordPress par Exygy fournit un moyen rapide d'exécuter une requête SQL pour créer un nouveau compte administrateur. C'est pratique si vous avez développé un site mais que vous le remettez au client et qu'il a besoin d'un accès administrateur.

Exécutez la requête dans votre base de données WordPress pour créer le compte.

Outils de développement WordPress: Maintenance

Une fois le site opérationnel, ces outils vous aident à garder un site en bonne santé.

23. ManageWP

ManageWP est un tableau de bord de logiciel en tant que service qui vous permet de gérer facilement plusieurs sites WordPress, et c'est mon site préféré de ce type.

La version gratuite possède plusieurs fonctionnalités, notamment des sauvegardes mensuelles, des contrôles de performances et de sécurité et des rapports clients. D'autres avantages tels que les sites de clonage nécessitent une mise à niveau payante. Le prix dépend du nombre de modules complémentaires premium que vous utilisez.

24. Outils de gestion des redirections 301

Les redirections 301 sont importantes pour maintenir un bon référencement sur un site.

Yoast Permalink Changer a votre dos si vous avez décidé de basculer la structure du permalien vers le /%après le nom%/ type. L'outil génère automatiquement les redirections dont vous avez besoin, en fonction de l'URL du site, des permaliens existants et du type de serveur.

Vous pourriez également avoir besoin d'un outil pour tester les expressions régulières pour les redirections, comme RegExr.

25. Vérification du lien brisé

Les liens rompus se développent au fil du temps et peuvent nuire à la crédibilité et à la convivialité d'un site. C'est quelque chose que vous voudrez surveiller, en particulier s'il s'agit de liens de paiement ou de liens d'affiliation.

Il existe quelques vérificateurs de liens en ligne, mais j'aime Broken Link Checkbest pour plusieurs raisons:

1. Vérifie plus de liens que les autres outils en ligne – jusqu'à 3 000.
2. Aucune limite au nombre de liens trouvés.
3. Vous indique où sur la page un lien est rompu (numéro de ligne).
4. Recherchez des liens rompus distincts.

Les limitations du service sont:

1. Un seul contrôle par adresse IP à la fois.
2. Une analyse peut prendre beaucoup de temps en fonction de la taille du site.
3. Les liens vers les images et les documents ne sont pas numérisés.
4. Aucun moyen d'exporter la liste des liens rompus vers un autre programme, par exemple Exceller. (J'ai trouvé un moyen de contourner ce problème en envoyant la page de résultats à imprimer et en utilisant l'option Imprimer au format PDF pour la télécharger).

Emballer

Et c'est une enveloppe sur les outils de développement WordPress qui font gagner du temps!

Ai-je manqué l'un de vos outils de développement WordPress préférés? Veuillez les ajouter dans les commentaires ou démarrer une conversation dans notre groupe Facebook.