Dreamweaver'da dosyalar oluşturun, açın, düzenleyin, kaydedin ve dönüştürün. Şablon oluşturun ve ilgili dosyaları açın.

Dreamweaver, çeşitli web belgeleriyle çalışmak için esnek bir ortam sağlar. HTML belgelerine ek olarak JavaScript, PHP ve Basamaklı Stil Sayfaları (CSS) gibi çeşitli metin tabanlı belgeler oluşturabilir ve açabilirsiniz.

Dreamweaver yeni bir belge oluşturmak için birkaç seçenek sağlar. Aşağıdakilerden herhangi birini oluşturabilirsiniz:

  • Yeni bir boş belge ya da şablon

  • Dreamweaver ile birlikte gelen ve önceden tasarlanmış sayfa mizanpajlarından birini temel alan bir belge (30'dan fazla CSS tabanlı sayfa mizanpajı da dahildir)

  • Varolan şablonlarınızdan birini temel alan bir belge

    Ayrıca belge tercihlerini de ayarlayabilirsiniz. Örneğin genelde tek bir belge türüyle çalışıyorsanız, oluşturacağınız yeni sayfalar için bu belge türünü varsayılan belge olarak ayarlayabilirsiniz.

    Tasarım görünümünde ya da Kod görünümünde meta etiketleri, belge başlığı ve arka plan renkleri gibi belge özelliklerini ve diğer birçok sayfa özelliğini kolayca tanımlayabilirsiniz.

Dreamweaver dosya türleri

Dreamweaver'da farklı dosya türleriyle çalışabilirsiniz. Çalışacağınız birincil tür dosya HTML dosyasıdır. HTML dosyaları (Köprü Metni İşaretleme Dili dosyaları) web sayfalarını tarayıcıda görüntüleme işlevini üstlenmiş etiket tabanlı dili içerir. HTML dosyalarını .html ya da .htm uzantısıyla kaydedebilirsiniz. Dreamweaver, dosyaları varsayılan olarak .html uzantısını kullanarak kaydeder.

Dreamweaver HTML5 tabanlı web sayfaları oluşturmanıza ve düzenlemenize izin verir. Ayrıca en baştan HTML5 sayfaları oluşturmak için başlangıç mizanpajları da mevcuttur.

Aşağıda Dreamweaver uygulamasıyla çalışırken kullanabileceğiniz diğer bazı yaygın dosya türleri verilmiştir:

CSS

Basamaklı Stil Sayfası dosyaları .css uzantılıdır. HTML içeriğini formatlamak ve çeşitli sayfa öğelerinin konumlandırmalarını kontrol etmek için kullanılırlar.

GIF

Graphics Interchange Format dosyaları .gif uzantılıdır. GIF formatı karikatürler, logolar, saydam alanlı grafikler ve animasyonlar için yaygın kullanılan bir web grafik formatıdır. GIF dosyaları en fazla 256 renk içerir.

JPEG

Joint Photographic Experts Group dosyaları (formatı oluşturan kuruluşun adı verilmiştir) .jpg uzantılıdır ve genellikle fotoğraf ya da renkli görüntü biçimindedir. JPEG formatı dijital ya da taranmış fotoğraflar, doku kullanan görüntüler, renk geçişleri bulunan görüntüler ve 256'dan fazla renk gerektiren tüm görüntüler için en iyisidir.

XML

Genişletilebilir İşaretleme Dili dosyaları .xml uzantılıdır. XSL (Genişletilebilir Stil Sayfası Dili) kullanılarak formatlanabilecek ham formda veri içerirler.

Yeni Belge iletişim kutusu

Yeni Belge iletişim kutusu PHP, XML ve SVG dahil olmak üzere tüm desteklenen belge dosya türlerini görüntüler.

Bu iletişim kutusundan ayrıca önceden tanımlanmış mizanpajlara, şablonlara ve çerçevelere de erişebilirsiniz.

Not:

Tüm özellikli başlangıç mizanpajları dinamik web sitelerini desteklemek için oluşturulmuştur ve HTML-5 ile uyumludur.

Boş sayfa kullanarak bir HTML mizanpajı oluşturma

Önceden tasarlanmış CSS mizanpajı içeren bir sayfa oluşturabilirsiniz ya da tümüyle boş bir sayfa oluşturabilir ve sonra kendi mizanpajınızı oluşturabilirsiniz.

  1. Dosya > Yeni seçeneğini belirleyin.

  2. Yeni Belge kategorisinde Belge Türü sütunundan oluşturmak istediğiniz sayfa türünü seçin. Örneğin, düz bir HTML sayfası oluşturmak için HTML seçeneğini belirleyin.

  3. Belge Türü açılır menüsünden bir belge türü seçin. Çoğu durumda varsayılan seçim olan HTML5 seçeneğini kullanabilirsiniz.

  4. Oluşturmak istediğiniz sayfanın türüne göre ek seçenekler seçin.

    • Yok: Bu seçeneği çerçeve kullanmadan basit bir web sayfası oluşturmak istiyorsanız seçin.
    • Bootstrap: Bootstrap şablonları, Bootstrap çerçevesi kullanan önceden tanımlanmış mizanpajlardır. Bu seçeneği, Bootstrap çerçevesi kullanarak dinamik web sayfaları oluşturmak istiyorsanız seçin.

    Not:

    Dinamik web sayfaları oluşturmayı planlıyorsanız Bootstrap çerçevesini seçin.

  5. Çerçeve kullanmıyorsanız, bu durumda:

    • Belge Başlığı: Bu alana, Belge Başlığını girdiğinizde Dreamweaver onu otomatik olarak belgenin <head> bölümüne ekler.
    • Belge Türü: Belge Türü açılır menüsünden bir belge türü seçin. Çoğu durumda varsayılan seçim olan, HTML5 seçeneğini kullanabilirsiniz.

    Belge Türü menüsündeki XHTML belge türü tanımlamalarından birini seçtiğinizde, sayfanız XHTML uyumlu olur. Örneğin menüden XHTML 1.0 Transitional ya da XHTML 1.0 Strict'i seçerek bir HTML belgesini XHTML uyumlu yapabilirsiniz. XHTML (Genişletilebilir Köprü Metni İşaretleme Dili), HTML'nin bir XML uygulaması olarak yeniden formüle edilmiş halidir. XHTML kullanmak genellikle XML'nin avantajlarını ve aynı zamanda web belgelerinizin geriye ve ileriye dönük uyumluluğunu sağlar.

    Not:

    XHTML hakkında daha fazla bilgi için, XHTML 1.1 - Modül Tabanlı XHTML (www.w3.org/TR/xhtml11/) ve XHTML 1.0 (www.w3c.org/TR/xhtml1/) özelliklerini ve bunların yanı sıra web tabanlı dosyalar için XHTML doğrulayıcı sitelerinin (http://validator.w3.org/) ve yerel dosyaların (http://validator.w3.org/file-upload.html) özelliklerini içeren World Wide Web Consortium (W3C) web sitesine bakın.

    • CSS Ekle: Sayfaya mevcut bir CSS mizanpajı ekleyin.  Bunu yapmak için CSS Dosyası Ekle bölmesinin yanındaki Stil Sayfası Ekle simgesini  tıklatın ve bir CSS stil sayfası seçin.
    Çerçeve kullanmadan yeni bir HTML sayfası oluşturma
    Çerçeve kullanmadan yeni bir HTML sayfası oluşturma

    Photoshop kompozisyonunu temel alan yeni bir sayfa oluşturmak isterseniz Photoshop kompozisyonlarınızdan sayfa oluşturmak için Extract'i kullanın. 

    Bu seçeneği belirlemek, bir PSD dosyası yükleyebileceğiniz ve HTML sayfanızı oluşturmaya başlayacağınız Extract panelini açar.

  6. Bootstrap çerçevesini kullanarak dinamik bir web sayfası oluşturmak istiyorsanız:

    • Bootstrap CSS: Yeni bir Bootstrap CSS oluşturma veya mevcut bir CSS dosyasını kullanma seçeneği. Mevcut bir CSS dosyası kullanıyorsanız dosya yolunu belirtin. CSS dosyasının sitenizin kök klasörü içinde olduğundan emin olun.
    • CSS Ekle: Sayfaya mevcut bir CSS mizanpajı ekleyin.  Bunu yapmak için CSS Dosyası Ekle bölmesinin yanındaki Stil Sayfası Ekle simgesini  tıklatın ve bir CSS stil sayfası seçin.
    • Önceden oluşturulmuş bir mizanpaj ekle: Mizanpajınız zaten varsa bu seçeneği belirleyin. Izgarayı ve kesme noktası değerlerini düzenlemek için Özelleştir’i tıklatın.
    Bootstrap çerçevesini kullanarak yeni bir HTML sayfası oluşturma
    Bootstrap çerçevesini kullanarak yeni bir HTML sayfası oluşturma

    Photoshop kompozisyonunu temel alan yeni bir sayfa oluşturmak isterseniz Photoshop kompozisyonlarınızdan sayfa oluşturmak için Extract'i kullanın. 

    Bu seçeneği belirlemek, bir PSD dosyası yükleyebileceğiniz ve HTML sayfanızı oluşturmaya başlayacağınız Extract panelini açar.

  7. Belge türü, kodlama ve dosya uzantısı gibi varsayılan belge tercihlerini ayarlamak istiyorsanız Tercihler'i tıklatın.

  8. Oluştur düğmesini tıklatın.

  9. Yeni belgeyi kaydedin (Dosya > Kaydet).

  10. Görünen iletişim kutusunda, dosyayı kaydetmek istediğiniz klasöre gidin.

    Not:

    Dosyayı bir Dreamweaver sitesine kaydetmeniz akıllıca olur.

  11. Dosya Adı kutusuna dosya için bir ad yazın.

    Dosya ve klasör adlarında boşluk ve özel karakterler kullanmayın ve dosya adını sayıyla başlatmayın. Özellikle, uzak bir sunucuya koymayı planladığınız dosyaların adlarında özel karakterler (örneğin é, ç veya ¥) ya da noktalama işaretleri (örneğin iki nokta üst üste, bölme çizgisi ya da nokta) kullanmayın; birçok sunucu yükleme sırasında bu karakterleri değiştirir ve bu da dosyalara oluşturulmuş bağların kopmasına neden olur.

Boş şablon oluşturma

Dreamweaver şablonları oluşturmak için Yeni Belge iletişim kutusunu kullanabilirsiniz. Şablonlar varsayılan olarak sitenizin Şablonlar klasörüne kaydedilir.

Not:

Şablon oluşturmak için öncelikle bir site oluşturmalısınız. Siteler ve site oluşturma hakkında daha fazla bilgi için bkz. Dreamweaver siteleri hakkında.

  1. Dosya > Yeni seçeneğini belirleyin.

  2. Yeni Belge iletişim kutusunda Site Şablonları kategorisini seçin.

  3. Belge Türü açılır menüsünden bir belge türü seçin. Çoğu durumda varsayılan olarak seçili olan XHTML 1.0 Geçişli seçeneğini değiştirmezsiniz.

    DocType (DTD) menüsündeki XHTML belge türü tanımlamalarından birini seçtiğinizde sayfanız XHTML uyumlu olur. Örneğin menüden XHTML 1.0 Transitional ya da XHTML 1.0 Strict'i seçerek bir HTML belgesini XHTML uyumlu yapabilirsiniz. XHTML (Genişletilebilir Köprü Metni İşaretleme Dili), HTML'nin bir XML uygulaması olarak yeniden formüle edilmiş halidir. XHTML kullanmak genellikle XML'nin avantajlarını ve aynı zamanda web belgelerinizin geriye ve ileriye dönük uyumluluğunu sağlar.

    Not:

    XHTML hakkında daha fazla bilgi için, XHTML 1.1 - Modül Tabanlı XHTML (www.w3.org/TR/xhtml11/) ve XHTML 1.0 (www.w3c.org/TR/xhtml1/) özelliklerini ve bunların yanı sıra web tabanlı dosyalar için XHTML doğrulayıcı sitelerinin (http://validator.w3.org/) ve yerel dosyaların (http://validator.w3.org/file-upload.html) özelliklerini içeren World Wide Web Consortium (W3C) web sitesine bakın.

  4. Şablonu düzenlediğinizde sayfanın otomatik olarak güncelleştirilmesini istiyorsanız Şablon Değiştiğinde Sayfayı Güncelleştir seçeneğini belirleyin.

  5. Oluştur düğmesini tıklatın.

  6. Yeni belgeyi kaydedin (Dosya > Kaydet). Şablona henüz düzenlenebilir bölgeler eklemediyseniz, belgede düzenlenebilir bölge olmadığını belirten bir iletişim kutusu görünür. İletişim kutusunu kapatmak için Tamam'ı tıklatın.

  7. Farklı Kaydet iletişim kutusunda şablonun kaydedileceği bir site seçin.
  8. Dosya Adı kutusuna yeni şablon için bir ad yazın. Şablonun adına dosya uzantısı eklemeniz gerekmez. Kaydet'i tıklattığınızda, sitenizin Şablonlar klasörüne kaydedilen yeni şablona .dwt uzantısı eklenir.

    Dosya ve klasör adlarında boşluk ve özel karakterler kullanmayın ve dosya adını sayıyla başlatmayın. Özellikle, uzak bir sunucuya koymayı planladığınız dosyaların adlarında özel karakterler (örneğin é, ç veya ¥) ya da noktalama işaretleri (örneğin iki nokta üst üste, bölme çizgisi ya da nokta) kullanmayın; birçok sunucu yükleme sırasında bu karakterleri değiştirir ve bu da dosyalara oluşturulmuş bağların kopmasına neden olur.

Şablonu temel alan sayfa oluşturma

Mevcut şablonlarınızdan veya Dreamweaver'ın başlangıç şablonlarından birini kullanarak yeni bir belge seçebilir, önizleyebilir ve oluşturabilirsiniz. Dreamweaver tarafından tanımlanmış sitelerinizin herhangi birinden şablon seçmek için Yeni Belge iletişim kutusunu kullanabilirsiniz ya da varolan bir şablondan yeni belge oluşturmak için Varlıklar paneli öğesini kullanabilirsiniz.

Şablonu temel alan belge oluşturma

  1. Dosya > Yeni seçeneğini belirleyin.

  2. Yeni Belge iletişim kutusunda, Şablondan Sayfa kategorisini seçin.

  3. Site sütununda, kullanmak istediğiniz şablonu içeren Dreamweaver sitesini seçin ve ardından sağdaki listeden bir şablon belirleyin.

  4. Bu sayfanın temel aldığı şablonda yaptığınız her değişiklikte sayfanın güncelleştirilmesini istemiyorsanız Şablon Değiştiğinde Sayfayı Güncelleştir seçeneğinin işaretini kaldırın.

  5. Belge türü, kodlama ve dosya uzantısı gibi varsayılan belge tercihlerini ayarlamak istiyorsanız Tercihler'i tıklatın.

  6. Daha fazla sayfa tasarımı içeriği yükleyebileceğiniz Dreamweaver Exchange uygulamasını açmak istiyorsanız Daha Fazla İçerik Al öğesini tıklatın.

  7. Oluştur öğesini tıklatın ve belgeyi kaydedin (Dosya > Kaydet).

Varlıklar panelinde şablondan belge oluşturma

  1. Açık değilse Varlıklar panelini açın (Pencere > Varlıklar).

  2. Varlıklar panelinde, mevcut sitenizdeki şablonların listesini görüntülemek için soldaki Şablonlar simgesini  tıklatın.

    Not:

    Uygulamak istediğiniz şablonu yeni oluşturduysanız, şablonu görmek için Yenile düğmesini tıklatmanız gerekebilir.

  3. Uygulamak istediğiniz şablonu sağ tıklatın (Windows) veya Control tuşu basılıyken tıklatın (Macintosh), ardından Şablondan Yeni seçeneğini belirleyin.

    Belgeniz, Belge penceresinde açılır.

  4. Belgeyi kaydedin.

Dreamweaver başlangıç şablonunu temel alan bir sayfa oluşturma

Dreamweaver, mobil uygulamalara yönelik profesyonel olarak geliştirilmiş çeşitli başlangıç dosyası ile birlikte gelir. Bu örnek dosyaları sitenizdeki sayfaları tasarlama amacıyla başlangıç noktaları olarak kullanabilirsiniz.

Başlangıç şablonunu temel alan bir belge oluştururken Dreamweaver, dosyanın bir kopyasını oluşturur. Böylece başlangıç dosyasının üzerine yazmazsınız.

Yeni Belge iletişim kutusunda örnek dosyayı önizleyebilir ve belgenin tasarım öğelerinin kısa bir açıklamasını okuyabilirsiniz.

  1. Dosya > Yeni seçeneğini belirleyin.

  2. Yeni Belge iletişim kutusunda Başlangıç Şablonları kategorisini seçin.

    Dreamweaver'daki başlangıç şablonları
    Dreamweaver'daki başlangıç şablonları

    Örnek sayfa ayrıntılarını ve görselleştirmesini, farklı seçenekleri seçtikçe panelin sağında görürsünüz.

  3. Oluştur düğmesini tıklatın.

    Yeni belge ve ilgili tüm dosyalar Belge penceresinde açılır.

  4. Belgeyi kaydedin (Dosya > Kaydet).

Farklı kodlama dilleri için yeni kod dosyaları oluşturma

Dreamweaver'da bir dizi kodlama dili için kod dosyaları oluşturabilirsiniz.

Dreamweaver'da kodlama desteği hakkında daha fazla bilgi için bkz. Dreamweaver'da kodlama hakkında.

Dreamweaver'da yeni bir kod dosyası oluşturmak için aşağıdaki talimatları kullanın:

  1. Dosya > Yeni Belge'yi seçin.

  2. Belge Türü altından, oluşturmak istediğiniz kod dosyasını seçin.

  3. Oluşturmak istediğiniz belge türünü (PHP dosyası gibi) Belge Türü sütunundan seçin.

    Yeni bir PHP sayfası oluşturma
    Yeni bir PHP sayfası oluşturma

  4. Seçtiğiniz dosya türüne bağlı olarak belge oluştururken ek seçenekler kullanılabilir. 

    Örneğin, PHP dosyası oluşturuyorsanız Belge Türü seçeneklerini ve bazı CSS seçeneklerini seçebilirsiniz.

  5. Oluştur düğmesini tıklatın. Ardından belgeyi kaydedin (Dosya > Kaydet).

Belgeleri kaydetme ve dönüştürme

Belgeyi geçerli adını ve konumunu kullanarak kaydedebilir veya farklı bir ad ve konumla belgenin kopyasını kaydedebilirsiniz.

Not:

Dosyaları adlandırırken, dosya ve klasör adlarında boşluk ve özel karakter kullanmaktan kaçının. Özellikle, uzak bir sunucuya koymayı planladığınız dosyaların adlarında özel karakterler (örneğin é, ç veya ¥) ya da noktalama işaretleri (örneğin iki nokta üst üste, bölme çizgisi ya da nokta) kullanmayın; birçok sunucu yükleme sırasında bu karakterleri değiştirir ve bu da dosyalara oluşturulmuş bağların kopmasına neden olur. Ayrıca, dosya adlarına sayı ile başlamayın.

Belge kaydetme

  1. Aşağıdakilerden birini yapın:
    • Diskteki geçerli sürümün üzerine yazmak ve yaptığınız değişiklikleri kaydetmek için Dosya > Kaydet seçeneğini belirleyin.
    • Dosyayı farklı bir klasöre veya farklı bir ad kullanarak kaydetmek için Dosya > Farklı Kaydet öğesini seçin.
  2. Görünen Farklı Kaydet iletişim kutusunda, dosyayı kaydetmek istediğiniz klasöre gidin.
  3. Dosya Adı metin kutusuna dosya için bir ad yazın.

  4. Dosyayı kaydetmek için Kaydet öğesini tıklatın.

Açık tüm belgeleri kaydetme

  1. Dosya > Tümünü Kaydet seçeneğini belirleyin.

  2. Kaydedilmemiş açık belge varsa Farklı Kaydet iletişim kutusu kaydedilmemiş her belge için görüntülenir.

    Görünen iletişim kutusunda, dosyayı kaydetmek istediğiniz klasöre gidin.

  3. Dosya Adı kutusuna dosya için bir ad yazın ve Kaydet öğesini tıklatın.

Belgenin en son kaydedilen sürümüne geri dönme

  1. Dosya > Geri Dön seçeneğini belirleyin.

    Değişikliklerinizi atmak ve kaydedilen önceki sürüme dönmek isteyip istemediğinizi soran bir iletişim kutusu görüntülenir.

  2. Önceki sürüme geri dönmek için Evet öğesini; değişikliklerinizi korumak için Hayır öğesini tıklatın.

    Not:

    Bir belgeyi kaydedip ardından Dreamweaver uygulamasından çıkarsanız, Dreamweaver uygulamasını yeniden başlattığınızda önceki sürüme geri dönemezsiniz.

Varsayılan belge türünü ve kodlamasını ayarlama tercihler

Sitenizdeki sayfaların çoğu belli bir dosya türündeyse (HTML, PHP veya JavaScript gibi), yeni belgeleri belirttiğiniz dosya türünde otomatik olarak oluşturan belge tercihlerini ayarlayabilirsiniz.

  1. Düzen > Tercihler (Windows) veya Dreamweaver > Tercihler (Macintosh) seçeneğini belirleyin.

    Not:

    Yeni bir belge oluştururken yeni belge tercihlerini ayarlamak için Yeni Belge iletişim kutusundaki Tercihler düğmesini de tıklatabilirsiniz.

  2. Soldaki kategori listesinden Yeni Belge öğesini tıklatın.

  3. Tercihleri gerektiği şekilde ayarlayın ya da değiştirin ve kaydetmek için Tamam'ı tıklatın.

    Varsayılan Belge

    Oluşturduğunuz sayfalar için kullanılacak bir belge türü seçin.

    Varsayılan Uzantı

    Oluşturduğunuz yeni HTML sayfaları için tercih ettiğiniz dosya uzantısını belirtin (.htm ya da .html).

    Not: Bu seçenek diğer dosya türleri için devre dışı bırakılmıştır.

    Default Document Type (DDT - Varsayılan Belge Türü)

    Yeni sayfaları XHTML uyumlu yapmak için XHTML belge türü tanımlamalarından (DTD) birini seçin. Örneğin menüden XHTML 1.0 Transitional ya da XHTML 1.0 Strict'i seçerek bir HTML belgesini XHTML uyumlu hale getirebilirsiniz.

    Varsayılan Kodlama

    Yeni sayfa oluşturulduğunda ve herhangi bir kodlama belirtmeyen bir belge açıldığında kullanılacak kodlamayı belirtin.

    Belge kodlaması olarak Unicode (UTF‑8) kodlamasını seçerseniz varlık kodlaması gerekmez çünkü UTF-8 tüm karakterleri güvenli şekilde temsil edebilir. Başka bir belge kodlaması seçerseniz belirli karakterleri temsil etmek için varlık kodlaması gerekebilir. Karakter varlıkları hakkında daha fazla bilgi için bkz. www.w3.org/TR/REC-html40/sgml/entities.html.

    Varsayılan kodlama olarak Unicode (UTF‑8) kodlamasını seçerseniz, Unicode İmzası İçer (BOM) seçeneğini işaretleyerek belgeye bir Byte Order Mark (BOM) ekleyebilirsiniz.

    BOM bir metin dosyasının başında bulunan ve dosyayı Unicode olarak tanımlayan ve ayrıca izleyen baytların bayt sırasını da tanımlayan 2-4 bayttır. UTF‑8'in bayt sırası olmadığı için UTF‑8 BOM eklemek isteğe bağlıdır. UTF‑16 ve UTF‑32 için bu gereklidir.

    Unicode Normalleştirme Formu

    Varsayılan kodlama olarak Unicode (UTF-8) seçeneğini belirlerseniz bu seçeneklerden birini işaretleyin.

    Dört adet Unicode Normalleştirme Formu vardır. World Wide Web için Karakter Modeli'nde en yaygın olarak kullanılan olduğundan, en önemlisi Normalizasyon Formu C'dir. Adobe bütünlük sağlamak için diğer üç Unicode Normalleştirme Formunu da sağlar.

    Ctrl+N Tuşlarına Basıldığında Yeni Belge İletişim Kutusunu Göster

    Tuş komutunu kullandığınızda varsayılan belge türünde bir belgeyi otomatik olarak oluşturmak için bu seçeneğin işaretini kaldırın (Macintosh için “Command+N”).

    Unicode'da görsel olarak benzer ancak belgede farklı yollarla saklanabilecek karakterler vardır. Örneğin, “ë” (e‑çift noktalı) tek bir karakter olarak, “e‑umlaut” veya iki karakter olarak, “normal Latin e” + “birleştirilen iki nokta” olarak görüntülenebilir. Unicode birleştirme karakteri, önceki karakterle kullanılan karakterdir, böylece çift nokta “Latin e” harfinin üzerinde görüntülenir. Her iki form da aynı görsel yazımla sonuçlanır ancak dosyaya kaydedilen her form için farklıdır.

    Normalizasyon, farklı formlarda kaydedilebilecek tüm karakterlerin aynı form kullanılarak kaydedilmesini sağlamak için yapılan işlemdir. Diğer bir deyişle, belgedeki tüm “ë” karakterleri tek bir “e‑çift nokta” veya “e” + “birleştirilen iki nokta” olarak kaydedilir. Bunlar, belgede her iki formda da kaydedilmez.

    Unicode Normalizasyonu ve kullanılabilecek belirli formlar hakkında daha fazla bilgi için www.unicode.org/reports/tr15 adresindeki Unicode web sitesine bakın.

Varolan belgeleri açma ve düzenleme

Dreamweaver uygulamasında oluşturulmuş olsun ya da olmasın, varolan bir web sayfasını ya da metin tabanlı belgeyi açabilir ve Tasarım görünümünde veya Kod görünümünde düzenleyebilirsiniz.

Açtığınız belge HTML belgesi olarak kaydedilmiş bir Microsoft Word dosyası ise Word'ün HTML dosyalarına eklediği yabancı işaretleme etiketlerini silmek için Araçlar > Word HTML'sini Temizle komutunu kullanabilirsiniz.

Microsoft Word tarafından oluşturulmayan HTML ya da XHTML'leri temizlemek için Araçlar > HTML'yi temizle komutunu kullanın. Daha fazla bilgi için bkz. Microsoft Word HTML dosyalarını temizleme.

Ayrıca JavaScript dosyaları, XML dosyaları, CSS stil sayfaları ya da sözcük işlemciler veya metin düzenleyiciler tarafından kaydedilmiş metin dosyaları gibi HTML olmayan metin dosyalarını da açabilirsiniz.

  1. Dosya > seçeneğini belirleyin.

    Not:

    Dosyaları açmak için Dosyalar panelini de kullanabilirsiniz.

  2. Açmak istediğiniz dosyaya gidin ve dosyayı seçin.

    Not:

    Henüz yapmadıysanız, başka bir konumdan açmak yerine Dreamweaver sitesinde açmayı ve düzenlemeyi planladığınız dosyaları düzenlemek yararlı olacaktır. Dreamweaver siteleri hakkında daha fazla bilgi için bkz. Dreamweaver siteleri hakkında.

  3. 'ı tıklatın.

    Belgeniz, Belge penceresinde açılır. JavaScript, metin ve CSS Stil Sayfaları varsayılan olarak Kod görünümünde açılır. Dreamweaver uygulamasında çalışırken belgeyi güncelleştirebilir ve dosyadaki değişiklikleri kaydedebilirsiniz.

Dreamweaver, ana belgenizle ilgili dosyaları ana belgenin odağını kaybetmeden görüntülemenize olanak tanır. Örneğin, ana belgeye eklenmiş CSS ve JavaScript dosyalarına sahipseniz Dreamweaver, bu ilgili belgeleri Belge penceresinde, ana belgeyi görünür şekilde tutarak görüntülemenize olanak tanır.

Dinamik olarak ilgili dosyalar hakkında daha fazla bilgi için bkz. Dinamik Olarak İlgili Dosyaları Açma.

Not:

HTML dosyalarıyla çalışırken dosyaya gitmeden ilgili CSS, JavaScript veya PHP dosyalarında hızlı değişiklikler yapmak isterseniz Hızlı Düzenleme'yi kullanabilirsiniz. Daha fazla bilgi için bkz. Hızlı Düzenleme.

Varsayılan olarak Dreamweaver, İlgili Dosyalar araç çubuğundaki ana belgeyle ilgili tüm dosyaların adlarını ana belge başlığının altında görüntüler. Araç çubuğundaki düğmelerin sırası, ana belge içinde bulunan ilgili dosyaların sırasını takip eder.

Not:

İlgili bir dosya kayıpsa, Dreamweaver yine de İlgili Dosyalar araç çubuğunda karşılık gelen düğmeyi görüntüler. Düğmeyi tıklatsanız da Dreamweaver bir şey görüntülemez.

Dreamweaver, şu tür ilgili dosyaları destekler:

  • İstemci tarafı komut dosyaları
  • Sunucu Tarafı İçerikleri
  • Harici CSS stil sayfaları (iç içe stil sayfaları dahil)

Aşağıdakilerden birini yapın:

  • Belgenin üst kısmındaki İlgili Dosyalar araç çubuğunda, açmak istediğiniz ilgili dosyanın adını tıklatın.

  • İlgili Dosyalar araç çubuğunda, açmak istediğiniz ilgili dosyanın adını sağ tıklatın ve içerik menüsünden Ayrı Dosya Olarak Aç öğesini seçin. Bu yöntemi kullanarak ilgili bir dosya açtığınızda, ana belge aynı anda görünür kalmaz.

  1. Ekleme noktasını, ilgili dosyanın etkilediğini bildiğiniz bir satır üzerine veya alana taşıyın.

  2. Kod Gezgini göstergesinin görünmesini bekleyin ve ardından Kod Gezgini'ni açmak için göstergeyi tıklatın.

  3. Kod Gezgini'ndeki öğeler hakkında daha fazla bilgi görüntülemek için üzerlerine gelin. Örneğin, belirli bir CSS renk özelliğini değiştirmek istiyor, ancak hangi kural içinde bulunduğunu bilmiyorsanız; Kod Gezgini'nde varolan kuralların üzerine gelerek özelliği bulabilirsiniz.

  4. Karşılık gelen ilgili dosyayı açmak için ilgilendiğiniz öğeyi tıklatın.

Ana belgenin kaynak koduna dönme

  1. İlgili Dosyalar araç çubuğunda Kaynak Kodu düğmesini tıklatın.

Tasarım görünümünden veya Kod ve Tasarım görünümlerinden (Bölünmüş görünüm) ilgili bir sayfa açtığınızda ilgili sayfa bölünmüş görünümde görüntülenir.

Görünüm > Böl'ü seçebilir ve Bölünmüş görünümü özelleştirmek istiyorsanız farklı Bölünmüş görünüm seçeneklerinden birini belirleyebilirsiniz.

İlgili dosyaları yalnızca Kod görünümünde görmek istiyorsanız araç çubuğunun üst kısmında Kod'u seçin.

Not:

Standart Kod görünümü ilgili Belgeleri, ana belgenin kaynak koduyla aynı anda görüntülemenize izin vermez.

Not:

Görüntüleme seçeneğindeki Kod Görünümü, ana belgenin kaynak kodunu ifade eder. Örneğin, Görünüm > Kod Görünümü Üstte öğelerini seçtiğinizde, Dreamweaver, ana belgenin kaynak kodunu Belge penceresinin üst yarısında görüntüler. Görünüm > Kod Görünümü Solda öğelerini seçtiğinizde ise Dreamweaver, ana belgenin kaynak kodunu Belge penceresinin sol yarısında görüntüler.

Varsayılan olarak bir HTML dosyası açtığınızda Dreamweaver ilgili dosyaları ayrı sekmelerde görüntüler. Bu işlevi devre dışı bırakmak isterseniz bunu Tercihler panelinden yapabilirsiniz.

  1. Düzen > Tercihler (Windows) veya Dreamweaver > Tercihler (Macintosh) seçeneğini belirleyin.

  2. Genel kategorisinde, İlgili Dosyaları Etkinleştir öğesinin seçimini kaldırın.

Dinamik Olarak İlgili Dosyalar özelliği, İlgili Dosyalar özelliğinin işlevselliğini, dinamik sayfaların ilgili dosyalarını İlgili Dosyalar araç çubuğunda görmenize izin vererek genişletir. Belirli bir biçimde, Dinamik Olarak İlgili Dosyalar özelliği, WordPress, Drupal ve Joomla! gibi popüler açık kaynaklı PHP İçerik Yönetimi Sistemi (CMS) çerçeveleri için çalışma zamanı kodu üretmek üzere gereken birçok içeriği görmenize izin verir.

Dinamik Olarak İlgili Dosyalar özelliğini kullanmak için, WordPress, Drupal veya Joomla! çalıştıran yerel veya uzak bir PHP uygulama sunucusuna erişiminizin olması gerekir. Sayfaları test etmek için kullanılan yaygın uygulamalardan biri localhost PHP uygulama sunucusu kurmak ve sayfaları yerel olarak test etmektir.

Sayfaları test etmeden önce şu adımları gerçekleştirmeniz gerekir:

  • Bir Dreamweaver sitesi kurun ve Site Kurulumu iletişim kutusunda Web URL'si metin kutusunu doldurduğunuzdan emin olun.

  • Bir PHP uygulama sunucusu kurun.

    Not: Dreamweaver'da Dinamik Olarak İlgili Dosyalarla çalışmayı denemeden önce sunucu çalışır durumda olmalıdır.

  • Uygulama sunucusunda WordPress, Drupal veya Joomla! çerçevesini yükleyin. Daha fazla bilgi için bkz:

  • Dreamweaver'da CMS dosyalarınızı indireceğiniz ve düzenleyeceğiniz yerel bir klasör tanımlayın.

  • Uzak ve test klasörünüz olarak yüklü WordPress, Drupal veya Joomla dosyalarının konumunu tanımlayın.

  • CMS dosyalarını uzak klasörünüzden indirin (alın).

Dinamik Olarak İlgili Dosyalarla ilişkili bir sayfa açtığınızda, Dreamweaver, dosyaları otomatik olarak keşfedebilir veya dosyaları el ile keşfetmenize izin verir (sayfanın üstündeki Bilgi çubuğundaki bir bağı tıklatarak yapabilirsiniz). Varsayılan ayar el ile keşfetmedir.

  1. Düzen > Tercihler (Windows) veya Dreamweaver > Tercihler (Macintosh OS) seçeneğini belirleyin.

  2. Genel kategorisinde İlgili Dosyaları Etkinleştir seçeneğinin belirlendiğinden emin olun.

  3. Dinamik Olarak İlgili Dosyalar açılır menüsünden El İle veya Otomatik Olarak öğesini seçin. Ayrıca keşfetme özelliğini Devre Dışı öğesini seçerek tamamen devre dışı bırakabilirsiniz.

  1. Dinamik Olarak İlgili Dosyalarla ilişkisi olan bir sayfa açın (örneğin, bir WordPress, Drupal veya Joomla! sitesinin site kökü index.php) sayfası.

  2. Dinamik Olarak İlgili Dosyaların keşfi el ile (varsayılan) ayarlanmışsa, Belge penceresinde sayfanın üzerinde görüntülenen Bilgi çubuğundaki Keşfet bağını tıklatın.

    Dinamik Olarak İlgili Dosyaların keşfi otomatik olarak etkinleştirildiyse, bir Dinamik Olarak İlgili Dosyalar listesi, İlgili Dosyalar araç çubuğunda görüntülenir.

İlgili ve Dinamik Olarak İlgili Dosyalar, İlgili Dosyalar araç çubuğunda şu şekilde sıralanır:

  • Statik ilgili dosyalar (herhangi bir dinamik işlem gerektirmeyen ilgili dosyalar)
  • Dinamik yol sunucusuna dahil edilen dosyalara eklenmiş harici ilgili dosyalar (.css ve .js dosyaları)
  • Dinamik yol sunucusuna dahil edilen dosyalar (.php, .inc ve modül dosyaları)

İlgili Dosyalar ve Dinamik Olarak ilgili Dosyalar genellikle çok çeşitli olabileceğinden, Dreamweaver çalışmak istediğiniz dosyaların konumunu tam olarak bulabilmeniz için İlgili Dosyaları filtrelemenize izin verir.

  1. Kendisiyle ilişkili İlgili Dosyaları olan bir sayfa açın.

  2. Gerekirse Dinamik Olarak İlgili Dosyaları keşfedin.

  3. İlgili Dosyalar araç çubuğunun sağ tarafındaki İlgili Dosyaları Filtrele simgesini tıklatın.

  4. İlgili Dosyalar araç çubuğunda görmek istediğiniz dosya türlerini seçin. Varsayılan olarak, Dreamweaver tüm İlgili Dosyaları seçer.

  5. Özel bir filtre oluşturmak için İlgili Dosyaları Filtrele simgesini tıklatın ve Özel Filtre seçeneğini belirleyin.

    Özel Filtre iletişim kutusu yalnızca tam dosya adlarının (style.css), dosya uzantılarının (.php) ve joker karakter ifadelerinin yıldız işareti kullanılarak (*menu*) filtrelenmesine izin verir. Her ifadeyi noktalı virgül ile ayırarak birden fazla joker karakter ifadesini filtreleyebilirsiniz (örneğin, style.css;*.js;*tpl.php).

Not:

Filtre ayarları dosyayı kapattığınızda gider.

Microsoft Word HTML dosyalarını temizleme

Microsoft Word (Microsoft Word 97 veya sonraki sürümler) tarafından HTML dosyaları olarak kaydedilen belgeleri açabilir ve Word tarafından oluşturulan yabancı HTML kodunu silmek için Araçlar > Word HTML'sini Temizle komutunu kullanabilirsiniz.

Dreamweaver uygulamasının kaldırdığı kod, Word tarafından öncelikle belgeleri biçimlendirmek ve Word'de görüntülemek için kullanılır ve HTML dosyasını görüntülemek için gerçekten gerekli değildir.

HTML dosyasını temizlediğinizde HTML belgesini Word'de tekrar açamayabilirsiniz, bu nedenle özgün Word (.doc) dosyanızın yedek bir kopyasını oluşturun.

Not:

Microsoft Word tarafından oluşturulmayan HTML ya da XHTML'leri temizlemek için Araçlar > HTML'yi temizle komutunu kullanın.

  1. Microsoft Word belgenizi HTML dosyası olarak kaydedin.

    Not:

    Windows'ta, paylaşım ihlalini önlemek için dosyayı Word'de kapatın.

  2. HTML dosyasını Dreamweaver'da açın.

    Word tarafından oluşturulan HTML kodunu görüntülemek için Kod görünümüne (Görünüm > Kod) geçin.

  3. Araçlar > Word HTML'sini Temizle seçeneğini belirleyin.

    Not:

    Dreamweaver dosyayı kaydetmek için hangi Word sürümünün kullanıldığını belirleyemezse doğru sürümü açılır menüden seçin.

  4. Temizleme işlemiyle ilgili seçenekleri işaretleyin (ya da işaretlerini kaldırın). Girdiğiniz tercihler varsayılan temizleme ayarları olarak kaydedilir.

    Dreamweaver, temizleme ayarlarını HTML belgesine uygular ve değişikliklere ilişkin bir günlük görünür (iletişim kutusunda bu seçeneğin işaretini kaldırmadıysanız).

    Microsoft Word HTML temizleme seçenekleri
    Microsoft Word HTML temizleme seçenekleri

    Word'e Özgü Tüm İşaretlemeyi Kaldır

    HTMLetiketlerinden XML'yi, belgenin başlığındaki Word özel meta veri ve bağ etiketlerini, Word XML işaretlemesini, koşullu etiketler ve bunların içeriğini ve stillerden boş paragrafları ve kenar boşluklarını kaldırma da dahil, Microsoft Word'e özgü tüm HTML'yi kaldırır. Ayrıntılı sekmesini kullanarak bu seçeneklerden her birini ayrı ayrı seçebilirsiniz.

    CSS'yi Temizle

    Mümkün olduğunda satır içi CSS stillerini (üst stilin özellikleri aynı olduğunda), “mso” ile başlayan satır niteliklerini, CSS olmayan stil bildirimlerini, tablolardan CSS stil niteliklerini ve kullanılmayan tüm stil tanımlamalarını başlıktan kaldırma da dahil, Word'e özgü tüm CSS'yi kaldırır. Ayrıntılı sekmesini kullanarak bu seçeneği daha da özelleştirebilirsiniz.

    Etiketleri <font> Temizle

    Varsayılan gövde metni boyutunu 2 HTML metnine dönüştürerek HTML etiketlerini kaldırır.

    Geçersiz Şekilde Yuvalanmış Etiketleri Onar

    Word tarafından paragraf ve başlık (blok düzeyi) etiketleri dışına eklenmiş font işaretleme etiketlerini kaldırır.

    Kaynak Formatını Uygula

    HTML Formatı tercihlerinde ve SourceFormat.txt dosyasında belirttiğiniz kaynak biçimlendirme seçeneklerini belgeye uygular.

    Tamamlandığında Günlüğü Göster

    Temizleme işlemi biter bitmez belgede yapılan değişiklikler hakkında ayrıntıların olduğu bir uyarı kutusu görüntüler.

  5. Tamam'ı tıklatın ya da Word'e Özgü Tüm İşaretlemeyi Kaldır ve CSS'yi Temizle seçeneklerini daha fazla özelleştirmek istiyorsanız Ayrıntılı sekmesini tıklatın ve ardından Tamam'ı tıklatın.

Bu çalışma Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License kapsamında lisanslanmıştır  Creative Commons şartları, Twitter™ ve Facebook sitelerinde paylaşılanları kapsamaz.

Yasal Uyarılar   |   Çevrimiçi Gizlilik İlkesi