Písanie HTML kódu v aplikácii Dreamweaver

Nemusíte používať iba WYSIWYG

Dreamweaver je skvelý editor WYSIWYG , ale ak nemáte záujem o písanie webových stránok v prostredí "čo vidíte, čo dostanete", stále môžete používať Dreamweaver, pretože je to aj skvelý textový editor. Existuje však veľa funkcií, ktoré prekrývajú trať v editore kódov Dreamweaver, pretože primárne zameranie je na "návrhový pohľad" alebo časť editora WYSIWYG produktu.

Ako sa dostať do zobrazenia kódu Dreamweaver

Ak ste nikdy nepoužívali aplikáciu Dreamweaver ako editor HTML, skôr ako si možno nikdy nevšimnete tri tlačidlá v hornej časti stránky: "Kód", "Rozdelenie" a "Návrh". Aplikácia Dreamweaver sa štandardne spustí v režime "Design view" alebo WYSIWYG. Je však ľahké prepnúť na prezeranie a úpravu kódu HTML. Stačí kliknúť na tlačidlo "Kód". Prípadne prejdite do ponuky Zobraziť a zvoľte "Kód."

Ak sa len učíte písať HTML alebo chcete získať zmysel, ako vaše zmeny ovplyvnia váš dokument, môžete súčasne zobraziť zobrazenie kódu a návrh. Krása tejto metódy je, že môžete upravovať aj v oboch oknách. Takže môžete napísať kód pre značku obrázka do HTML a potom ho použiť na premiestnenie na iné miesto na stránke drag and drop.

Ak chcete zobraziť obidve naraz:

Akonáhle vám vyhovuje Dreamweaver, ak chcete upraviť kód HTML, môžete predvolené nastavenia zmeniť, aby ste predvolene otvorili program Dreamweaver v zobrazení kódu. Najjednoduchším spôsobom je uloženie zobrazenia kódu ako pracovného priestoru. Aplikácia Dreamweaver sa otvorí v poslednom pracovnom priestore, ktorý ste použili. Ak sa tak nestane, jednoducho prejdite do ponuky Okno a vyberte požadovaný pracovný priestor.

Možnosti zobrazenia kódu

Program Dreamweaver je tak flexibilný, pretože má toľko spôsobov, ako ho prispôsobiť a urobiť ho tak, ako to chcete. V okne s možnosťami sa zobrazujú sfarbenia kódu, formátovanie kódu, názvy kódov a možnosti prepisovania kódu, ktoré môžete upraviť. Môžete tiež zmeniť niektoré špeciálne možnosti v samotnom zobrazení kódu.

Po zobrazení kódu máte na paneli s nástrojmi tlačidlo "Možnosti zobrazenia". Možnosti môžete zobraziť tak, že prejdete do ponuky Zobraziť a zvolíte možnosť "Možnosti zobrazenia kódu". Možnosti sú:

Úprava kódu HTML v zobrazení kódu programu Dreamweaver

Ľahko upravovať kód HTML v zobrazení kódu programu Dreamweaver. Jednoducho začnite písať HTML. Aplikácia Dreamweaver vám však poskytuje niektoré doplnky, ktoré ju rozširujú nad rámec základného editora HTML. Keď začnete písať značku HTML, zadáte <. Ak pozastavíte hneď za týmto znakom, Dreamweaver vám zobrazí zoznam značiek HTML . Tieto sa nazývajú pokyny pre kód. Ak chcete zúžiť výber, začnite písať písmená - aplikácia Dreamweaver zúži rolovací zoznam na značku, ktorá zodpovedá zadanému výrazu.

Ak ste novým jazykom HTML, môžete prechádzať zoznamom značiek HTML a vybrať si rôzne, aby ste videli, čo robia. Aplikácia Dreamweaver vás bude aj naďalej vyzývať na atribúty po zadaní značky. Napríklad, ak zadáte " HTML, pričom ostatné značky začínajú na nasledujúcom texte. Ak budete pokračovať písaním písmena "m", aplikácia Dreamweaver ju zužuje na značku .

Pokyny pre kód však nekončia na značkách. Môžete použiť tipy pre vloženie:

Ak sa názvy kódov nezobrazia, stlačte Ctrl-spacebar (Windows) alebo Cmd-spacebar (Macintosh), aby ste ich zobrazili. Najčastejším dôvodom, prečo sa názov kódu nemusí zobraziť, je zmena iného okna pred dokončením značky. Pretože Dreamweaver vypíše písanie znaku <, ak opustíte okno a vrátite sa, budete musieť znova spustiť poradie kódu.

Pomocou klávesu Escape môžete vypnúť ponuku názvov kódov.

Po zadaní vašej úvodnej HTML značky musíte ju zavrieť. Dreamweaver to robí prirodzeným spôsobom. Ak zadáte možnosť Zavrieť značky, ktorá najlepšie vyhovuje vašim potrebám.

Ak nie ste celkom pripravený prejsť na úpravu svojich stránok v HTML, ale chcete sa pozrieť na kód, ako je napísaný, mali by ste skúsiť inšpektora kódu. Tým sa otvorí HTML kód v samostatnom okne. Funguje to rovnako ako kódový pohľad a v skutočnosti je v podstate odnímateľné zobrazenie kódu pre aktuálny dokument. Ak chcete otvoriť kódový inšpektor, prejdite do ponuky Window a zvoľte "Code Inspector" alebo stlačte kláves F10 na klávesnici.

Dreamweaver bude formátovať HTML kód, ale chcete, aby sa zobrazil. Napríklad, ak použijete 3 medzery na odsadenie, ale nikdy neodrážate značky IMG, môžete zadať informácie o formátovaní v možnostiach prepisovania kódu. Potom prejdete do ponuky Príkazy a zvolíte možnosť "Použiť formátovanie zdroja". Je to skvelý spôsob, ako získať kód, ktorý niekto iný napísal do formátu, ktorý je vám známy.

Funkcia, ktorú mnoho HTML programátorov nevie alebo nepoužíva, je schopnosť zbaliť HTML kód. Toto neodstraňuje značky z dokumentu, ale jednoducho ich odstráňte z pohľadu, takže nerúšajú to, na čom pracujete. Zbaliť kód:

  1. Vyberte časť kódu, ktorú chcete skryť
  2. V ponuke Úpravy zvoľte "Zbaliť výber" z podmenu "Zbaliť kód"

Jednoduchší spôsob je vybrať kód a potom kliknúť na ikony zbalenia kódu, ktoré sa zobrazujú v žľabe. Môžete tiež kliknúť pravým tlačidlom myši na vybraný kód a zvoliť "Zbaliť výber".

Ak chcete skryť všetko okrem toho, čo je zvýraznené, zvoľte "Zbaliť vonkajší výber" v ktoromkoľvek z vyššie uvedených spôsobov.

Ak chcete rozšíriť zbalil kód, stačí naň dvakrát kliknúť. Otvorí sa kód a vyberie ho. Potom môžete tento výber presunúť alebo ho odstrániť alebo pridať ďalšie značky okolo neho.

Funkciu zbalenia a rozbaľovania môžete používať nepretržite na stránkach, v ktorých nechcete upravovať externú šablónu. Stačí vyberať oblasť obsahu, ktorú chcete upraviť a zbaliť mimo. Potom napíšte HTML. Stranu môžete zobraziť v zobrazení Návrh alebo ju zobraziť v prehliadači. Zbalil kód nie je odstránený z dokumentu, skryté z pohľadu. Môžete ho použiť aj pri práci na sérii položiek. Keď skončíte, zbalte ho. Viete, že ste skončili, keď sa nezobrazuje žiadny kód.