Dreamweaver Dersleri

Çalışma Alanı Seçimi

Dreamweaver MX programının kurulumu sırasında dosya yükleme işlemleri bittikten sonra Workspace Setup isimli bir pencere açılır.

Bu pencere yardımıyla biz Dreamweaver MX'in çalısma alanını değiştirebiliriz. Daha doğrusu Dreamweaver 4 ve Dreamweaver 3 programlarındakinden daha farklı bir çalısma alanı seçebiliriz.

İlk kurulum sırasında bu pencere açıldığında "Dreamweaver MX Workspace" seçilidir.

Dreamweaver MX'i kurduktan sonra bu pencereye Edit>>Preferences menüsüyle ulaşılan Preferences penceresinin General kategorisindeki Change Workspace... düğmesi ile ulaşabiliriz.

Açılan bu pencerede 3 farklı görünüm seçebiliriz. Bunlardan ilki Dreamweaver MX'le gelen geçerli görünüm. Bir diğeri bu geçerli görünüm seçiliyken "Homesite/Coder-Style" seçeneği işaretlendiğinde seçilen daha çok kod yazmak için uygun olan görünüm bir diğeri ise "Dreamweaver 4 Workspace" seçeneği seçildiğinde elde edilecek Dreamweaver 4'ten aşina olduğumuz görünümdür.

Bu 3 farklı görünümün hangisini seçeceğiniz sizin hangisiyle daha kolay çalısacağınız ve Dreamweaver'i kod yazmak için mi yoksa daha çok görsel olarak site tasarlamak için mi kullanacağınız belirler.

Asağıdaki bağlara tıklayarak 3 farklı çalışma alanını inceleyebilirsiniz.

Dreamweaver MX Workspace
HomeSite/Coder-Style

Dreamweaver 4 Workspace

Not: Seçtiğiniz çalışma alani seçiminizi yaptığınız anda değil, Dreamweaver MX programını kapatıp tekrar baslattığınızda etkin olacaktır.

Site Tanımlamak 1

Dreamweaver MX'te çalışmaya başlamadan önce, yapacağımız çalısmaların derli toplu olması için bir site tanımlamasi yapmakta fayda vardır. Dreamweaver MX gerek sayfalarımızı kaydederken gerekse sayfalarda kullandığımız resim, stil veya animasyonlar için bize kaydetmek istediğimiz dosyaların ait olduğu siteyi soracaktır. Bir site için dosyalar tasarlıyor olmasak da tanımlanmış bir sitemizin olması işimize yarayacaktır.

Site tanımlamak için Site>>New Site... menüsünü kullanırız. Bu menü ile içerisinde Basic ve Adavanced sekmeleri bulunan Site Definition for Unnamed Site 1 penceresine ulaşırız.

Bu dersimizde biz Basic sekmesini tıklayarak bu sekmeyi kullanarak site tanımlamayı öğreneceğiz.

Basic sekmesinde ilk olarak "What would you like to name your site?" sorusunun altindaki metin alanına sitemizin ismini yazmamiz gerekir. Ben DWTurk yazıyorum. Next dediğimizde karşımıza ColdFusion, JSP, PHP veya ASP gibi bir server teknoloji kullanıp kullanmayacağımıza dair bir seçim yapmamızı gerektiren aşağıdaki ekran gelir.

Server tipi seçimi

Biz su an için html uzantılı sayfalar tasarlayacağımız için ilk seçenek olan "No, I do not want to use a server technology" seçiyoruz.

Tekrar next dediğimizde sitenin yapım aşamasında dosyalarla nasıl çalışacağımızı seçmemiz istenir. Burada aşağıda görülen 3 seçenek vardır.

Çalisma Süreci

Biz dosyalarımızı tasarladıktan sonra web alanına yükleyeceğimiz için ilk seçeneği seçiyoruz.
İkinci seçenek olan "Edit directly on server using local network" dosyalara yerel bir ağ üzerindeki bir makineden ulaşarak işlem yapmak için, üçüncü seçenek ise site dosyalarına FTP ya da RDS kullanarak ulaşmak içindir.
Bu ekranda "Where on your computer do you want to store your files?" sorusu altındaki metin alanında site dosyalarımızı saklayacağımız bir klasör belirtmemiz istenir. Bunun için düğmesine tıklarız ve açılan pencerede site dosyalarımızı saklayacağımız dizini seçeriz.

Next diyerek ulaştığımız bir sonraki aşamada sitemizi barındıracağımız sunucuya erişim yöntemimizi seçmemiz istenmektedir. Biz şimdilik dosyalarımızla bilgisayarımızda islem yapacağımız için ilk seçenek olan "None"i seçeriz.

Son aşamada ise karşımıza yaptığımız seçimlerin yer aldığı "Summary" kısmı gelir.

Done tuşuna tıkladığımızda sitemizi oluşturmuş oluruz ve Site penceresi açılır.

Not: Site penceresi Dreamweaver MX Workspace görünümünde pencerenin sağında yer alan Files panelinin içerisindeki Site sekmesinde açılır. Bu sekmeyi panelden dışarıya sürüklediğinizde yukarıdaki resimde görülen pencere haline dönüşür.


Site Tanımlamak 2

Daha önceki derste Site Tanımlama sihirbazı ile bir site tanımlamıştık. Bu defa Advanced sekmesini kullanarak bir site tanımlayacağız. Fakat sitemiz yine bilgisayarımızda çalışan lokal bir site olacak.

Site>>New Site.. menüsü ile Site Definition pencersine ulaşıp Advanced sekmesini tıklarız. Karşımıza ilk kategori olan Local Info kategorisinin içeriği gelir. Sırayla buradaki alanları tanıyalım ve Cizik Roman sitesini oluşturmak için kullanalım.

LocalInfo kategoris özellikleri

Site Name: Buraya sitemizin adını yazarız. Bu ad Site panelinde görüntülenecek addır.

Local Root Folder: Sitemize ait dosyalarımızı saklayacağımız ve sitemizin Root Folder(Kök Dizin)'ı olacak dizini seçtiğimiz yerdir. Bu dizin bilgisayarımızda yer alan bir dizin olacağından yolunu doğrudan yazabileceğimiz gibi Folder(Dizin) ( Folder İkonu ) simgesini tıkladığımızda açılacak olan Choose Local Root Folder for Site pencersinden bir dizin seçebiliriz.
Örneğin aşağıdaki resimde görüldüğü gibi CizikRoman dizini benim kök dizinimdir.

Choose Local Root folder for Site CizikRoman penceresi

"Refresh Local File List" seçeneği işaretliyken kök dizinimize eklediğimiz ya da kök dizinden çıkarttığımız her dosya/dizin Dreamweaver tarafından kaydedilir ve Site panelinde eklediğimiz her dosyayı/dizini eklediğimiz an görebiliriz.
Sitemizdeki dosyaları daha kolay takip edebilmemiz de bu seçeneğin işaretli olmasının faydası vardır ;)

Default Images Folder metin kutusuna sitemizdeki resimleri sakladığımız dizinin adresini yazarız. Metin kutusunu yanındaki Folder simgesini tıkladığımız da açılan Choose Local Image Folder for Site penceresinden de klasörümüzü seçebiliriz.

Bu klasörü belirtmenizde şöyle bir yarar vardır. Örneğin sayfanıza kök dizin dışında bir dizinden resim eklediğimizde ve sayfamızı kaydetmek istediğimizde eklediğiniz resmin kök dizin dışarında olduğu ve kök dizin içerisine kaydetmek isteyip istemediğimiz soran bir mesaj kutusu çıkar ve eğer biz resimlerimiz için bir dizin tanımlamışsak, resmin bir kopyası belirlediğimiz dizin içerisine kopyalanır. :)

HTTP Address metin kutusuna sitemizin web adresini yazarız. Ben http://www.cizikroman.net yazıyorum.

Cache etiketi yanındaki "Enable Cache" seçeneği sitemiz için bir Cache(Önbellek) oluşturmamızı sağlar. Bu seçeneğin seçili olması çok önemlidir. Bu seçenek sayesinde Dreamweaver MX sizin için bütün bağlara ait bir index oluşturur. Herhangi bir bağı değiştirdiğimizde, bir dosya adını değiştirdiğimizde sitedeki bu bağı ya da dosyayı kullanan dosyalrımızda otomatik olarak güncellemeler yapar.

Örneğin A.htm doyasından B.htm dosyasına bir bağ tanımlamışsak, B.htm doyasınn adını C.htm yaptığımızda bize "Siz a.htm'den B.htm dosyasına bağ tanımlamıştınız, bu bağı C.htm'e dönüştürmek ister misiniz?" diye sorar.

Yine A.htm ve B.htm sayfalarına yerleştiriğimiz Kaplum.gif resminin adını kaplumbik.gif olarak değiştirdiğimizde bize "Kaplum.gif dosyasını yerleştiriğiniz A.htm ve B.htm dosyalarının Kaplum.gif yerine Kaplumbik.gif resmini kullanmasını istermisiniz?" diye sorar.

Bütün bu işlemler sonrasında Tamam dediğimizde eğer "Enable Cache" seçeneğini işaretlemişsek karşımıza aşağıdaki mesaj kutusu çıkar.

Bütün bu işlemler sonrasında Tamam(OK) diyerek sitemizi tanımlamış oluruz.