Samouczek edytora HTML tekstu Bluefish

click fraud protection

Bluefish edytor kodu to aplikacja służąca do tworzenia stron internetowych i skryptów. To nie jest edytor WYSIWYG. Bluefish to narzędzie służące do edycji kodu, z którego tworzona jest strona internetowa lub skrypt. Jest przeznaczony dla programistów, którzy mają wiedzę na temat pisania HTML i CSS kod i ma tryby pracy z najpopularniejszymi językami skryptowymi, takimi jak PHP i Javascript, a także z wieloma innymi. Głównym celem edytora Bluefish jest ułatwienie kodowania i redukcja błędów. Bluefish jest bezpłatny i oprogramowanie open source i wersje są dostępne dla Windows, Mac OSX, Linux i różnych innych platform uniksopodobnych. Wersja, której używam w tym samouczku, to Bluefish w systemie Windows 7.

01

z 04

Interfejs Bluefish

Interfejs Bluefish

Zrzut ekranu dzięki uprzejmości Jona Morin

Interfejs Bluefish jest podzielony na kilka sekcji. Największa sekcja to okienko edycji, w którym możesz bezpośrednio edytować swój kod. Po lewej stronie okienka edycji znajduje się panel boczny, który pełni te same funkcje, co menedżer plików, umożliwiając wybór plików, nad którymi chcesz pracować, oraz zmianę nazwy lub usunięcie plików.

instagram viewer

Sekcja nagłówka u góry okien Bluefish zawiera kilka pasków narzędzi, które można pokazać lub ukryć za pomocą menu Widok.

Paski narzędzi to główny pasek narzędzi, który zawiera przyciski do wykonywania typowych funkcji, takich jak zapisywanie, kopiowanie i wklejanie, wyszukiwanie i zastępowanie oraz niektóre opcje wcięć kodu. Zauważysz, że nie ma przycisków formatowania, takich jak pogrubienie lub podkreślenie.

To dlatego, że Bluefish nie formatuje kodu, jest tylko edytorem. Poniżej głównego paska narzędzi znajduje się HTML pasek narzędzi i menu urywków. Te menu zawierają przyciski i podmenu, których można używać do automatycznego wstawiania kodu dla większości elementów i funkcji językowych.

02

z 04

Korzystanie z paska narzędzi HTML w Bluefish

Korzystanie z paska narzędzi HTML w Bluefish

Zrzut ekranu dzięki uprzejmości Jona Morin

Pasek narzędzi HTML w Bluefish jest uporządkowany według kart, które oddzielają narzędzia według kategorii. Zakładki to:

  • Szybki pasek - możesz przypiąć inne narzędzia do tej zakładki dla przedmiotów, których często używasz.
  • HTML 5 - daje dostęp do wspólnych tagów i elementów w HTML 5.
  • Standard - w tej zakładce dostępne są popularne opcje formatowania HTML.
  • Formatowanie - znajdziesz tutaj mniej popularne opcje formatowania.
  • Stoły - różne funkcje generowania tabel, w tym kreator tabel.
  • Lista - narzędzia do generowania list uporządkowanych, nieuporządkowanych i definicyjnych.
  • CSS - z tej zakładki można tworzyć arkusze stylów, a także kod układu.
  • Formularze - z tej zakładki można wstawić najczęstsze elementy formularza.
  • Czcionki - ta zakładka zawiera skróty do pracy z czcionkami w HTML i CSS.
  • Ramki - najczęstsze funkcje do pracy z formularzami.

Kliknięcie każdej zakładki spowoduje pojawienie się przycisków związanych z odpowiednią kategorią na pasku narzędzi pod zakładkami.

03

z 04

Korzystanie z menu fragmentów w Bluefish

Korzystanie z menu fragmentów w Bluefish

Zrzut ekranu dzięki uprzejmości Jona Morin

Poniżej paska narzędzi HTML znajduje się menu zwane paskiem skrawków. Ten pasek menu zawiera podmenu dotyczące różnych języków programowania. Każda pozycja w menu wstawia powszechnie używany kod, na przykład typy dokumentów HTML i metainformacje.

Niektóre pozycje menu są elastyczne i generują kod w zależności od tagu, którego chcesz użyć. Na przykład, jeśli chcesz dodać wstępnie sformatowany blok tekstu do strony internetowej, możesz kliknąć menu HTML na pasku skrawków i wybrać element menu „dowolny sparowany tag”.

Kliknięcie tego elementu otwiera okno dialogowe z prośbą o wprowadzenie tagu, którego chcesz użyć. Możesz wpisać „pre” (bez nawiasów ostrych), a Bluefish wstawi do dokumentu otwierający i zamykający znacznik „pre”:

.

04

z 04

Inne cechy Bluefish

Inne cechy Bluefish

Zrzut ekranu dzięki uprzejmości Jona Morin

Chociaż Bluefish nie jest Edytor WYSIWYG, umożliwia podgląd kodu w dowolnej przeglądarce zainstalowanej na komputerze. Obsługuje również autouzupełnianie kodu, podświetlanie składni, narzędzia do debugowania, pole wyjściowe skryptu, wtyczki i szablony, które mogą dać Ci szybki start do tworzenia dokumentów, nad którymi często pracujesz z.

instagram story viewer