Psaní HTML kódu do aplikace Dreamweaver

Nemusíte používat pouze WYSIWYG

Dreamweaver je skvělý editor WYSIWYG , ale pokud nemáte zájem o psaní webových stránek v prostředí "co vidíte je to, co dostanete", můžete stále používat Dreamweaver, protože je to také skvělý textový editor. Ale v editoru kódů Dreamweaver je spousta funkcí, které se skrývají v cestě, protože primární zaměření je na stránce "design view" nebo WYSIWYG editor produktu.

Jak se dostat do zobrazení kódu Dreamweaver

Pokud jste nikdy nepoužívali Dreamweaver jako editor HTML, můžete si ještě nikdy nevšimnout tři tlačítka v horní části stránky: "Kód", "Rozdělit" a "Návrh". Aplikace Dreamweaver se ve výchozím nastavení spustí v návrhovém zobrazení nebo režimu WYSIWYG. Přechod na prohlížení a úpravu kódu HTML je snadné. Stačí kliknout na tlačítko "Kód". Nebo přejděte do nabídky Zobrazit a vyberte možnost "Kód".

Pokud se právě učíte, jak psát HTML, nebo chcete zjistit, jakým způsobem ovlivní vaše změny váš dokument, můžete současně otevřít zobrazení kódu a návrh. Krása této metody je, že můžete upravovat i v obou oknech. Takže můžete napsat kód pro značku obrázku v HTML a potom pomocí zobrazení návrhu jej přesunout na jiné místo na stránce drag and drop.

Chcete-li zobrazit obě najednou, buď:

Jakmile budete chtít aplikaci Dreamweaver upravit, abyste mohli upravovat kód HTML, můžete předvolby změnit tak, že ve výchozím nastavení otevřete Dreamweaver v zobrazení kódu. Nejjednodušší je uložit zobrazení kódu jako pracovní prostor. Dreamweaver se otevře v posledním pracovním prostoru, který jste použili. Pokud tomu tak není, jednoduše přejděte do nabídky Okno a vyberte pracovní prostor, který chcete.

Možnosti zobrazení kódu

Dreamweaver je tak flexibilní, protože má tolik způsobů, jak ji přizpůsobit a jak pracovat tak, jak to chce. V okně s volbami jsou kódování, kódování, kódové tipy a možnosti přepisování kódu, které můžete upravit. Můžete také změnit některé speciální možnosti v samotném zobrazení kódu.

Jakmile jste v zobrazení kódu, na panelu nástrojů je tlačítko "Zobrazit možnosti". Možnosti můžete také zobrazit tak, že přejdete do nabídky Zobrazit a zvolíte možnost "Možnosti zobrazení kódu". Možnosti jsou:

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

V kódu kódu aplikace Dreamweaver je snadné upravovat kód HTML. Jednoduše začněte psát HTML. Aplikace Dreamweaver však poskytuje některé doplňky, které ji rozšiřují nad rámec základního editoru HTML. Když začnete psát značku HTML, zadejte <. Pokud se pozastavíte hned za tímto znakem, aplikace Dreamweaver zobrazí seznam značek HTML . Tyto názvy se nazývají kódové rady. Chcete-li výběr zúžit, začněte psát písmena - aplikace Dreamweaver zúží rozevírací seznam na značku, která odpovídá zadanému textu.

Pokud jste noví k HTML, můžete procházet seznamem značek HTML a vybrat různé, abyste viděli, co dělají. Aplikace Dreamweaver vás bude dále vyzývat k zadání atributů po zadání značky. Pokud například napíšete " HTML, přičemž ostatní značky začínají písmenem I. Pokud budete pokračovat zadáním písmena "m", aplikace Dreamweaver jej zúží až na značku .

Příkazy kódu však neskončí u značek. Můžete použít tipy pro vložení:

Pokud se pokyny pro kód neobjeví, můžete stisknout Ctrl-mezerník (Windows) nebo Cmd-mezerník (Macintosh), aby se zobrazily. Nejčastějším důvodem, proč se kód pokyn neobjeví, je přepnutí do jiného okna před dokončením značky. Protože aplikace Dreamweaver vypíná zadání znaku <, pokud opustíte okno a vrátíte se, budete muset restartovat pokyny k kódu.

Můžete vypnout nabídku kódů pomocí klávesy Escape.

Jakmile jste zadali svou počáteční značku HTML, budete ji muset zavřít. Dreamweaver to dělá přirozeně. Pokud zadáte možnost "Zavřít značky", která nejlépe vyhovuje vašim potřebám.

Pokud nejste úplně připraveni přepnout na úpravu stránek v HTML, ale chcete se podívat na kód, jak je napsán, měli byste zkusit inspektora kódu. Otevře se HTML kód v samostatném okně. Funguje stejně jako zobrazení kódu a ve skutečnosti je v podstatě odnímatelným oknem kódu pro aktuální dokument. Chcete-li otevřít inspektor kódu, přejděte do nabídky Okno a zvolte "Inspector kódu" nebo stiskněte klávesu F10 na klávesnici.

Dreamweaver bude formátovat HTML kód, který by se ale chtěl zobrazit. Například pokud použijete 3 oddělené mezery, ale nikdy neodrážet značky IMG, můžete zadat informace o formátování v možnostech přepisování kódu. Poté přejdete do nabídky Příkazy a zvolíte možnost Použití formátování zdroje. To je skvělý způsob, jak získat kód napsaný někým jiným do formátu, který je pro vás známý.

Funkce, kterou mnoho HTML kodérů neví nebo nepoužívá, je schopnost sbalit kód HTML. To neodstraní tagy z dokumentu, ale stačí je odstranit z pohledu, takže to neruší tomu, na čem pracujete. Sbalit kód:

  1. Vyberte část kódu, kterou chcete skrýt
  2. V nabídce Úpravy vyberte v podnabídce "Sbalit kód" možnost "Sbalit výběr"

Snadnější je vybrat kód a poté kliknout na ikony sbalení kódu, které se objevují v okapu. Můžete také kliknout pravým tlačítkem na vybraný kód a zvolit "Sbalit výběr".

Chcete-li skrýt vše, kromě toho, co je zvýrazněno, zvolte "Sbalit vnější výběr" v některém z výše uvedených metod.

Chcete-li rozbalený kód rozbalit, jednoduše klikněte na něj. Tím se kód otevře a vyberou. Pak můžete tento výběr přesunout nebo smazat nebo přidat kolem něj další značky.

Funkci sbalování a rozbalování můžete používat po celou dobu na stránkách, kde nechcete upravit externí šablonu. Stačí vybrat oblast obsahu, kterou chcete upravit a sbalit venku. Pak napište svůj kód HTML. Stránku můžete zobrazit v zobrazení Návrh nebo zobrazit v prohlížeči. Sbalený kód není z dokumentu odstraněn, skrytý z pohledu. Můžete také použít, když pracujete na řadě položek. Až dokončíte jednu, sbalte ji. Víte, že jste hotovi, když se nezobrazí žádný kód.