Skip to main content

Tutoriel pour l'éditeur HTML de texte Bluefish

Color Correction/Grading Tutorial (Avril 2024)

Color Correction/Grading Tutorial (Avril 2024)
Anonim

L'éditeur de code Bluefish est une application permettant de développer des scripts et des pages Web. Ce n'est pas un éditeur WYSIWYG. Bluefish est un outil permettant d’éditer le code à partir duquel une page Web ou un script est créé. Il est destiné aux programmeurs connaissant l'écriture de code HTML et CSS et disposant de modes permettant de travailler avec les langages de script les plus courants tels que PHP et Javascript, ainsi que de nombreux autres. L'objectif principal de l'éditeur Bluefish est de faciliter le codage et de réduire les erreurs. Bluefish est un logiciel gratuit et à code source ouvert et ses versions sont disponibles pour Windows, Mac OSX, Linux et diverses autres plates-formes de type Unix. La version que j'utilise dans ce tutoriel est Bluefish sur Windows 7.

01 sur 04

L'interface Bluefish

L'interface Bluefish est divisée en plusieurs sections. La section la plus grande est le volet d'édition et vous permet de modifier directement votre code. Sur le côté gauche du volet d'édition se trouve le panneau latéral, qui remplit les mêmes fonctions qu'un gestionnaire de fichiers, vous permettant de choisir les fichiers sur lesquels vous souhaitez travailler et de renommer ou de supprimer des fichiers.

La section d'en-tête en haut de la fenêtre Bluefish contient plusieurs barres d'outils, qui peuvent être affichées ou masquées via le menu Affichage.

Les barres d’outils constituent la barre d’outils principale, qui contient des boutons permettant d’exécuter des fonctions courantes telles que l’enregistrement, le copier-coller, la recherche et le remplacement et certaines options d’indentation du code. Vous remarquerez qu'il n'y a pas de boutons de mise en forme tels que gras ou souligné.

C’est parce que Bluefish ne formate pas le code, ce n’est qu’un éditeur. Sous la barre d'outils principale se trouvent la barre d'outils HTML et le menu d'extraits. Ces menus contiennent des boutons et des sous-menus que vous pouvez utiliser pour insérer automatiquement du code pour la plupart des éléments et des fonctions de la langue.

02 sur 04

Utilisation de la barre d'outils HTML dans Bluefish

La barre d'outils HTML dans Bluefish est organisée en onglets qui séparent les outils par catégorie. Les onglets sont:

  • Barre rapide - vous pouvez épingler d'autres outils dans cet onglet pour les éléments que vous utilisez fréquemment.
  • HTML 5 - vous donne accès aux balises et aux éléments communs en HTML 5.
  • la norme - les options de formatage HTML courantes sont accessibles sur cet onglet.
  • Mise en forme - Des options de formatage moins courantes sont disponibles ici.
  • les tables - diverses fonctions de génération de table, y compris un assistant de table.
  • liste - des outils pour générer des listes ordonnées, non ordonnées et de définitions.
  • CSS - Les feuilles de style peuvent être créées à partir de cet onglet ainsi que le code de mise en page.
  • Formes - les éléments de formulaire les plus courants peuvent être insérés à partir de cet onglet.
  • Les polices - Cet onglet a des raccourcis pour travailler avec les polices HTML et CSS.
  • Cadres - les fonctions les plus courantes pour travailler avec des formulaires.

En cliquant sur chaque onglet, les boutons relatifs à la catégorie correspondante apparaissent dans la barre d'outils située sous les onglets.

03 sur 04

Utilisation du menu Snippets dans Bluefish

Sous la barre d'outils HTML se trouve un menu appelé barre de fragments. Cette barre de menus contient des sous-menus relatifs à divers langages de programmation. Chaque élément du menu insère du code couramment utilisé, tel que des doctypes HTML et des méta-informations, par exemple.

Certains éléments de menu sont flexibles et génèrent du code en fonction de la balise que vous souhaitez utiliser. Par exemple, si vous souhaitez ajouter un bloc de texte préformaté à une page Web, vous pouvez cliquer sur le menu HTML dans la barre d’extraits et choisir l’élément de menu «balises appariées».

En cliquant sur cet élément, une boîte de dialogue vous invite à saisir le tag que vous souhaitez utiliser. Vous pouvez entrer «pre» (sans les crochets) et Bluefish insère une balise «pre» d'ouverture et de fermeture dans le document:

.

04 sur 04

Autres caractéristiques de Bluefish

Bien que Bluefish ne soit pas un éditeur WYSIWYG, il vous permet de prévisualiser votre code dans n’importe quel navigateur que vous avez installé sur votre ordinateur. Il prend également en charge la saisie automatique du code, la coloration syntaxique, des outils de débogage, une zone de sortie de script, des plug-ins et des modèles pouvant vous aider à créer des documents avec lesquels vous travaillez fréquemment.