Bluefish Text HTML Editor Tutorial

click fraud protection

Bluefish editor kódu je aplikace používaná k vývoji webových stránek a skriptů. Není to editor WYSIWYG. Bluefish je nástroj používaný k úpravě kódu, ze kterého je vytvořena webová stránka nebo skript. Je určen pro programátory, kteří mají znalosti psaní HTML a CSS kód a má režimy pro práci s nejběžnějšími skriptovacími jazyky, jako jsou PHP a Javascript, a také s mnoha dalšími. Hlavním účelem editoru Bluefish je usnadnit kódování a snížit počet chyb. Bluefish je zdarma a open source software a verze jsou k dispozici pro Windows, Mac OSX, Linux a různé další platformy podobné Unixu. Verze, kterou používám v tomto tutoriálu, je Bluefish pro Windows 7.

01

ze dne 04

Rozhraní Bluefish

Rozhraní Bluefish

Screenshot s laskavým svolením Jon Morin

Rozhraní Bluefish je rozděleno do několika sekcí. Největší částí je podokno úprav, kde můžete přímo upravovat svůj kód. Na levé straně podokna úprav je boční panel, který vykonává stejné funkce jako správce souborů a umožňuje vám vybrat soubory, se kterými chcete pracovat, a soubory přejmenovat nebo odstranit.

instagram viewer

Sekce záhlaví v horní části oken Bluefish obsahuje několik panelů nástrojů, které lze zobrazit nebo skrýt prostřednictvím nabídky Zobrazit.

Panely nástrojů jsou hlavním panelem nástrojů, který obsahuje tlačítka pro provádění běžných funkcí, jako je ukládání, kopírování a vkládání, vyhledávání a nahrazování, a některé možnosti odsazení kódu. Všimnete si, že nejsou k dispozici žádná tlačítka pro formátování, například tučné nebo podtržené.

Je to proto, že Bluefish neformátuje kód, je to pouze editor. Pod hlavním panelem nástrojů je HTML panel nástrojů a nabídka úryvků. Tyto nabídky obsahují tlačítka a dílčí nabídky, které můžete použít k automatickému vložení kódu pro většinu jazykových prvků a funkcí.

02

ze dne 04

Používání panelu nástrojů HTML v Bluefish

Používání panelu nástrojů HTML v Bluefish

Screenshot s laskavým svolením Jon Morin

Panel nástrojů HTML v Bluefish je uspořádán podle karet, které oddělují nástroje podle kategorií. Karty jsou:

  • Rychlá lišta - na tuto kartu můžete připnout další nástroje pro položky, které často používáte.
  • HTML 5 - umožňuje přístup k běžným značkám a prvkům v HTML 5.
  • Standard - na této kartě jsou přístupné běžné možnosti formátování HTML.
  • Formátování - méně obvyklé možnosti formátování najdete zde.
  • Tabulky - různé funkce generování tabulek, včetně průvodce tabulkou.
  • Seznam - nástroje pro generování seřazených, neuspořádaných a definičních seznamů.
  • CSS - z této záložky a kódu rozložení lze vytvářet šablony stylů.
  • formuláře - z této záložky lze vložit nejběžnější prvky formuláře.
  • Písma - tato karta obsahuje zkratky pro práci s písmy v HTML a CSS.
  • Rámečky - nejběžnější funkce pro práci s formuláři.

Kliknutím na každou kartu se na panelu nástrojů pod kartami zobrazí tlačítka související s příslušnou kategorií.

03

ze dne 04

Používání nabídky Fragmenty v Bluefish

Používání nabídky Fragmenty v Bluefish

Screenshot s laskavým svolením Jon Morin

Pod panelem nástrojů HTML je nabídka s názvem panel úryvků. Tato lišta nabídek obsahuje dílčí nabídky týkající se různých programovacích jazyků. Každá položka v nabídce vloží běžně používaný kód, například HTML doctypes a meta informace.

Některé položky nabídky jsou flexibilní a generují kód v závislosti na značce, kterou chcete použít. Například pokud chcete na webovou stránku přidat předem naformátovaný blok textu, můžete kliknout na nabídku HTML na liště fragmentů a vybrat položku nabídky „libovolná spárovaná značka“.

Kliknutím na tuto položku se otevře dialogové okno s výzvou k zadání značky, kterou chcete použít. Můžete zadat „pre“ (bez lomených závorek) a Bluefish vloží do dokumentu otevírací a zavírací značku „pre“:

.

04

ze dne 04

Další vlastnosti Bluefish

Další vlastnosti Bluefish

Screenshot s laskavým svolením Jon Morin

Zatímco Bluefish není WYSIWYG editor, má možnost vám umožnit zobrazit náhled kódu v libovolném prohlížeči, který máte nainstalovaný v počítači. Podporuje také automatické dokončování kódu, zvýrazňování syntaxe, ladicí nástroje, výstupní pole skriptu, pluginy a šablony, které vám umožní rychlý start při vytváření dokumentů, které často pracujete s.

instagram story viewer