Ne morate koristiti samo WYSIWYG
Dreamweaver je odličan WYSIWYG editor , ali ako niste zainteresovani za pisanje web stranica u okruženju "ono što vidite", možete i dalje koristiti Dreamweaver jer je to i izvrsni tekst editor. Međutim, postoji puno funkcija koje se sklanjaju na putanji unutar Dreamweaverovog kodnog uređaja, jer je primarni fokus na "dizajnerskom pogledu" ili WYSIWYG uređivačkom dijelu proizvoda.
Kako doći do Dreamweaver kodskog prikaza
Ako nikada niste koristili Dreamweaver kao HTML editor pre nego što nikada niste primijetili tri dugmeta na vrhu stranice: "Code", "Split" i "Design". Dreamweaver se podrazumevano pokreće u "Design view" ili WYSIWYG modu. Ali lako je prebaciti na pregled i uređivanje HTML koda. Samo kliknite na dugme "Kod". Ili, idite u meni Prikaz i izaberite "Kod".
Ako samo učite kako da napišete HTML ili želite da shvatite kako će vaše promene uticati na vaš dokument, možete istovremeno otvoriti prikaz koda i dizajn. Ljepota ove metode je što možete editirati u oba prozora. Tako možete da napišete kod za svoju oznaku slike u HTML-u, a zatim koristite prikaz dizajna da biste ga premestili na drugu lokaciju na stranici sa prevlačenjem i pucanjem.
Da biste pogledali obe odjednom, ili:
- Kliknite na dugme "Split" (između "Code" i "Design")
- U meniju Prikaz izaberite "Kod i dizajn"
Jednom kada vam je udobno da koristite Dreamweaver da biste izmenili HTML kod, možete podesiti svoje preferencije da otvorite Dreamweaver u prikazu koda po defaultu. Najlakši način je čuvanje prikaza koda kao radnog prostora. Dreamweaver će se otvoriti u poslednjem radnom prostoru koji ste koristili. Ako to nije slučaj, jednostavno idite u meni prozora i izaberite radni prostor koji želite.
Opcije prikaza kodova
Dreamweaver je tako fleksibilan jer ima toliko načina da ga prilagodite i učinite kako radite onako kako želite. U prozoru opcija postoje boje kodova, formatiranje koda, saveti za kodove i opcije za prepisivanje koda koje možete podesiti. Međutim, možete takođe promijeniti neke posebne opcije u samom prikazu koda.
Kada ste u prikazu koda, na traci sa alatkama postoji "View Options". Takođe možete pogledati opcije tako što ćete otići u meni "Pregled" i izabrati opcije "Pregled koda". Opcije su:
- Word Wrap - obrađuje HTML kôd tako da ga možete pregledati bez horizontanja. Imajte na umu da ova opcija ne ubacuje povratak kolica u vaš kod, on samo prikazuje kod tako da je lakše čitati.
- Brojevi linija - prikazuje brojeve linija sa strane koda. Prikazuje simbol linije za linije koje se uvlače duže od prozora za prikaz.
- Skriveni znaci - prikazuje posebne karaktere umesto prostora koji bi se prikazivao na web stranici. Na primer, tačka zamenjuje prostor, dvostruki ševron zamenjuje svaki jezičak, a oznaka pilcrowa ili pasusa zamenjuje svaki prekid linije.
- Označite nevažeći kod - ističe HTML koji je netačan u žutoj boji. Ako odaberete žutu oznaku, Property Inspector će vam dati savjete kako ga ispraviti.
- Sintaksa Bojanje - uključuje ili isključuje boje kodiranja vašeg koda. Promenite boje kodiranja boja u odjeljku za bojenje kodova preferenci.
- Auto indent - automatski unosi vašu kodku nakon povratka kolica ako je kod iznad njega urezan. Možete promeniti veličinu indentacije tako što ćete promeniti veličinu kartice u odjeljku za formatiranje kodova preferenci.
Uređivanje HTML koda u Dreamweaver kodnom prikazu
Lako je uređivati HTML kod u Dreamweaverovom prikazu koda. Jednostavno počnite da kucate svoj HTML. Ali Dreamweaver vam nudi neke dodatke koji ga šire izvan osnovnog HTML uređaja. Kada počnete pisati HTML oznaku, unosite <. Ako pauzirate odmah nakon tog karaktera, Dreamweaver će vam pokazati listu HTML oznaka . Ovi se zovu kodovi. Da biste suzili izbor, počnite da unosite slova - Dreamweaver će smanjiti padajuću listu na oznaku koja odgovara onome što unosite.
Ako ste novi u HTML-u, možete se pomerati kroz listu HTML oznaka i izabrati razne da biste videli šta rade. Dreamweaver će nastaviti da vas traži za atribute nakon što unesete oznaku. Na primjer, ako upišete ".
Ali kodovi se ne završavaju na oznakama. Možete koristiti upute za kodove za umetanje:
Ukoliko se kodovi ne pojavljuju, možete da pritisnete Ctrl-razmak (Windows) ili Cmd-razmak (Macintosh) da biste ih prikazali. Najčešći razlog zbog kojeg se možda ne može pojaviti kôd za kod je ako ste prešli na drugi prozor pre nego što završite oznaku. Zbog toga što Dreamweaver odbacuje otkucanje karaktera <, ako napustite prozor i vratite se, moraćete ponovo pokrenuti savjete kodova.
Možete isključiti meni za savete kodova pritiskom na taster za izbjegavanje.
Kada otkucate otvaranje HTML oznake, morate ga zatvoriti. Dreamweaver to radi na prirodan način. Ako upišete opciju "Close Tags" koja najbolje odgovara vašim potrebama.
Ako niste sasvim spremni da pređete na uređivanje svojih stranica u HTML-u, ali želite da gledate kôd onako kako je napisano, trebalo bi da probate kodni inspektor. Ovo otvara HTML kod u posebnom prozoru. Ona funkcioniše baš kao kodni prikaz, a zapravo je u osnovi prozor za prikazivanje koda za trenutni dokument. Da biste otvorili inspektor koda, idite u meni Window i odaberite "Code Inspector" ili pritisnite tipku F10 na tastaturi.
Dreamweaver će formatirati HTML kôd, ali želite da se prikaže. Na primjer, ako koristite 3 razmaknice za unos, ali nikada ne nalazite IMG oznake, možete specificirati informacije o formatu u opcijama ponovnog koda. Zatim idite na meni Commands i izaberite "Apply Formatting Format". Ovo je sjajan način da dobijete kôd koji je napisao neko drugi u formatu koji vam je poznat.
Funkcija koju mnogi HTML koderi ne poznaju ili ne koriste su mogućnost srušenja HTML koda. Ovo ne uklanja oznake iz dokumenta, ali samo ih uklonite iz prikaza, tako da oni ne odvraćaju pažnju na ono na čemu radite. Da biste srušili svoj kod:
- Izaberite odeljak koda koji želite sakriti
- U meniju Uređivanje odaberite "Collapse Selection" iz podmenija Code Collapse
Jednostavnije je da izaberete kod, a zatim kliknite na ikone kolapsa kodova koji se pojavljuju u žlebu. Takođe možete kliknuti desnim tasterom na izabranu šifru i odaberite "Collapse Selection".
Ako želite da sakrijete sve osim što je označeno, izaberite opciju "Collapse Outside Selection" u bilo kojoj od gore navedenih metoda.
Da biste proširili srušeni kôd, jednostavno dvaput kliknite na njega. Ovo otvara kod i odabire ga. Zatim možete pomeriti taj izbor ili ga izbrisati ili dodati dodatne oznake oko nje.
Sve vreme možete koristiti funkciju kolapsa i proširenja na stranicama na kojima ne želite uređivati spoljni šablon. Samo izaberite oblast sadržaja koju želite urediti i srušiti napolju. Zatim napišite svoj HTML. Još uvijek možete pogledati stranicu u prikazu Dizajn ili je pregledati u pregledaču. Srušeni kôd se ne uklanja iz dokumenta, jednostavno sakriven od pogleda. Takođe možete da ga koristite kada radite na nizu stavki. Kada završite, srušite ga. Znaš da si završio kad nema koda koji pokazuje.