1 / 100

FORM EKLEMEK Ziyaret iler formlari kullanarak sayfa zerinden veri g nderebilirler. Uygulama: 1. Sayfa zerinde form ekl

tausiq
Download Presentation

FORM EKLEMEK Ziyaret iler formlari kullanarak sayfa zerinden veri g nderebilirler. Uygulama: 1. Sayfa zerinde form ekl

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


    1. FORM EKLEMEK Ziyaretçiler formlari kullanarak sayfa üzerinden veri gönderebilirler. Uygulama: 1. Sayfa üzerinde form eklenecek yeri tiklayin.

    2. 2.Doküman çubugu üzerinde form çubugunu etkinlestirin. 3.Çubugun en basindaki form olusturma dügmesine tiklayin.

    3. Kirmizi çizgilerle isaretli form alani olusturulur.

    4. Özellikler penceresinden Bu formun ID degeri degistirililir. 4. Veri Gönderme tipi Method bölümünden degistirilir. Veri yollanirken adres çubugundan yollanan veri takip edileblirken, Seçildiginde veriler görünmeyecek sekilde gönderilir. Kayit islemi basari ile tamamlandiginda,ziyaretçileri karsilayacak sayfanin adiniysa

    5. Action bölümüne girilir. Ziyaretçilerin dolduracagi form alanlarini yerlestirirken bu kirmizi kesikli çizgiler arasinda olmasina dikkat edilmelidir. Bu alan disindaki formlara girilen veriler gönderilmez.

    6. FORM ALANLARINI GRUPLANDIRMAK Form alanlarini gruplandirip adlandirarak ziyaretçilere daha anlasilir alanlar olusturulur. Uygulama: 1.Form çubugundan Fieldset dügmesine tiklayin. 2.Iletisim kutusu belirdiginde öernek olarak hesap bilgileri metnini girin ve ok dügmesi tiklayin.

    7. 3.Simdi ikinci bir baslik olusturmak için tekrar Fieldset dügmesini tiklayin. 4.Burayada örnek olarak kisisel bilgiler metnini girin ve ok tiklayin.

    8. 5.Simdi degisiklileri kaydedin ve sayfayi ön izleyin.

    9. 6.Basliklarin sekmeler seklinde farkli bir görünümde oldugu görülecektir.

    10. METIN KUTULARI EKLEMEK Form islemlerinde kullanicidan bilgi almak için kullanilir. Uygulama: 1.Metin kutusunu eklemek istenilen yere tiklayin. 2.Form çubugundaki Text Field dügmesini tiklayin.

    13. 3.Asagidaki gibi metin kutulari ekledikten sonra sayfayi öngörünümde izleyin.

    14. AÇILIR MENÜ OLUSTURMAK Kullanicilara form islemlerinde bir listeden tekli veya çoklu seçim yapmasi saglanabilir. Uygulama: 1.Liste ögesini eklemek istenilen yere tiklayin. 2.Form çubugundaki list menü dügmesini tiklayin.

    16. 3.Id,label ve Index alanlari uygun sekilde girilir. 4.Form alanlarinin altina bir açilir menü eklenecektir.

    17. 5.Simdi bu listeye ögeler eklemek için, seçtikten sonra özellikler penceresinden List Values dügmesine tiklayin.

    18. 6.Menü ögesi ve karsilik gelen degerleri girin ve ardindan tab tusuna basarak siradaki elemana geçin. 7.Bu adimlari izleyerek listeye birden fazla öge ekleyin. 8.Liste sirasini dügmeyi tiklayarak degistirebilirsiniz. Ok diyerek kaydedip ve çikin.

    19. SEÇIM KUTULARI EKLEMEK Uygulama: 1.Seçim kutularini eklemek istenilen yere tiklayin.Seçim için bir açiklama metni girin. 2.Daha sonra form çubugundan Radio Button dügmesine tiklayin.

    21. 3.Iletisim dügmesi belirdiginde bu dügme için bir isim girin ve ardinda etiket alanini tiklayin.

    22. 4.Daha sonra seçim listesinde görünmesini istediginiz metni bu alana girin.

    23. 5.Value alanrini girin ve yeni deger için Artiya basin.

    24. 6.Bu yeni ögelere index degerleri atanmalidir.

    25. 7.Bunun için ilk seçenek seçilir daha sonra Ctrl+T Tuslarina basilir. 8.Etiket degistirme penceresi görüntülendinde ilgili alandan tabindex degerini girin.

    26. 9.Daha sonra diger iki seçenek için de bu degerler girip sayfayi kaydettikten sonra ön izlemede görün.

    27. 10.Sayfa çalistiginda kutucuklara tiklayarak çalismasini bakin.

    28. ONAY KUTUSU EKLEMEK Ziyaretçilere birden fazla seçim yapabilecekleri seçenekler sunmak için onay kutulari kullanilir. Uygulama: 1.Onay kutusu için örnek bir açiklama girdikten sonra Form çubugundaki Checkbox dügmesini tiklayin.

    30. 2. Id,Etiket ve Tabindex degerlerini girin ve Ok tiklayin.

    31. 3.Onay kutusu form alaninin en altina eklenecektir.

    32. 4.Ikinci bir seçenek eklemek için form çubugundan checkbox tiklayin. 5. Id,Etiket ve Tabindex degerlerini girin ve Ok tiklayin.

    33. 6.Bu adimlari izleyerek iki onay kutusu daha ekleyin.

    35. 7.Daha sonra degisiklikleri kaydedip sayfayi ön izleyin.Sayfa görüntülendiginde seçeneklerin çalismasini denetleyin.

    36. METIN KUTUSU EKLEMEK Ziyaretçilerin birden fazla satirdan olusan yorum ve açiklamalarini girebilecegi form alanlarini olusturmak için kullanilir. Uygulama: 1.Bunun için form çubugundaki Textarea dügmesine tiklayin.

    37. 2.Iletisim penceresi görüntülendiginde; Id,Etiket ve Tabindex degerlerini girin ve Ok tiklayin.

    38. 3.Metin kutusunu üzerinde görüntülenmesi gereken baslik solda görünecektir.Bu sorunu gidermek için karekter genisligi yeniden ayarlanir.Bunun için; 4.Metin kutusunu seçin ve özellikler penceresinden degistirin.

    39. 5.Bu tercihlerle baslik ve metin alani ayni alana sigmadigi için alt alta görünür.Bu durum sayfa alaninin daha verimli kullanilmasini saglayacaktir. 6.Ziyaretçiler bu alana metin girisi yaparken ayni anda daha fazla satiri görmesini saglayablirsiniz. 7.Bunun için özellikler penceresinden Num lines degerini uygun bir sekilde degistirin.

    40. 8.Form alanlarinin tarayici pencerelerinde görünümleri farkli oldugundan çalismanin son durumunu ön izlemede görün.

    41. FLASH DOSYALARININ EKLENMESI Uygulama: 1.Bunun için Assets panelini etkinlestirin.

    42. 2.Assets panelinde çalisma dosyalarinizin bir listesi görüntülenecektir. 3.Sadece Flash dosyalarinin listelenmesi için sol taraftan flash seçenegini tiklayin.

    43. 4.Simdi listeden bir dosyayi web sayfasinin üzerine sürükleyip birakin.

    44. 5.Bu alan için bir etiket belirledikten sonra Ok tiklayin.degisiklikleri kaydedin.

    45. 6.Ön gürünümde falash dosyasini çalistirmak için özellikler penceresinden Play tusuna basin.

    46. FLASH ÖZELLIKLERININ BELIRLENMESI Web sayfasina eklediginiz flash nesnelerinin kalite,boyut,saydamlik gibi özellikleri degistirilebilir. Uygulama: 1.Bunun için ilgili flash nesnesini seçin ve özellikler penceresindeki play dügmesini tiklayin. 2.Simdi örnegin flash nesnesinin genisligini degistirelim. 3.Bunun için özellikler penceresindeki W degerine uygun bir deger girin.

    47. 4.Flash nesnesi vektör yapisinda oldugundan kalitesinde herhangi bir düsüs olmayacaktir.

    48. 5.Flash nesnesinin sürekli tekrar etmesini istemiyorsaniz Loop seçenegi etkisizlestirilir. 6.Flash nesnesinin kalite ayarini yapmak için pencereden istenilen deger seçilir.

    49. 7.Flash animasyon pencere boyutu varsayilan olaraksabittir.Flash nesnesinin tarayici boyutu ile orantili boyutlandirilmasini için Exact Fit seçilir. 8.Flash nesnesinin sabit boyutlu kalmasi için Default seçenegi seçilir.

    50. 9.Flash nesnesini saydamlastirmak için özellikler penceresindeki Wmode açilir penceresini tiklayin ve transparent seçenegini seçin.

    51. 10.Degisiklikleri kaydedin ve tarayici penceresinde sayfayi ön izleyin.

    52. FLASH DREAMWEAVER ENTEGRASYONU Flash nesnelerini kolayca flash ile açip güncelleneblir. Uygulama: 1.Ilgili flash dosyasi seçilir. 2.Özellikler penceresindeki Edit dügmesi tiklanir. 3.Flash dosyasi çalistirilip ilgili dosya görüntülenir.

    54. 4.Baslik çubugunda Dreamweaver ile entegrasyonu saglayan simge görünür. 5.Bu örnek için arka plan rengini degistirelim.

    55. 6.Degisikleri kaydetmek için Done tiklayin. 7.Flash uygulamasini etkinlestirmek için özellikler penceresindeki play dügmesini tiklayin.Yapilan degisikliker animasyonda görüntülenecektir.

    56. ACCORDION MENÜ OLUSTURMA Uygulama: File / New/ Html diyerek yeni bir sayfa olusturun. Layout penceresinden Table seçenegi seçilir. 3.Rows:1 Column: 1 degerlerinde tablo olusturulur.

    57. 4.Tablonun içine tiklanir ve Layout penceresinden accordion menu seçenegi tiklanir. 5.Nereye kaydedilecegini soran bir iletisim penceresi açilir.Tamam denir.

    58. 6.Masaüstüne menu klasörü açilir ve içerisine menu ismiyle kaydedilir.

    59. 7.Asagidaki görüntü olusmaktadir.

    60. 8.Göz dügmesini tiklayarak menü içerigine geçilir. 9.Panels kisminda + tiklayarak yeni menü eklenir. Eklendikten sonra label1 seçilip istenilen menü ismi yazilir.

    61. 10.Daha sonra anasayfa.html adinda yeni bir dosya olusturun. 11.Menü kismindan Ana Sayfa Yazisina bu dosyayi link verin.

    62. 12.Daha sonra diger menülerin dosyalarini da tek tek olusturup buradan link verin. 13.Degisiklikleri kaydedip menünüzün çalismasini ön izlemede görün.

    63. 14.Olusturdugumuz bu menüyü dosya klasörü ile birlikte istenilen web sayfasinda kullanabilirsiniz.

    64. FRAMES EKLEMEK Dreamweaver da pencereler ekleyerek birbirinden bagimsiz sayfalari ayni anda pencerelerde görülebilir. Uygulama: 1.Masaüstüne frames klasörü olusturun. 2.Dreamweaverda eski sayfalariniz açiksa kapatin ve File/New ile yeni bir Html sayfasi olusturun. Sayfayi index.html olarak kaydedin. 3.Table olusturun.

    65. 4.Table degerleri su sekilde olmalidir.

    66. 5.Table özelliklerini ayarliyoruz. Sayfa ana sayfa oldugu için genel tasarimini düzenliyoruz.

    67. 7.Seçenekleri seçili ile hücreleri birlestiriyoruz.

    68. 8.Seçenekleri seçili ile hücreleri birlestiriyoruz.

    69. 9.Seçenekleri seçili ile hücreleri birlestiriyoruz.

    70. 10.Table disindan seçerek özellikler penceresinden sayfaya ortaliyoruz.

    71. 11.Table kenarlarindan tutarak biraz genisletiyoruz. Ve kayit edip ön izlemede görüyoruz.

    73. 12.Table seçilir ve border degeri 0 yapilir bu sekilde table nun kenar çizgileri görünmez.

    74. 13.Table da istenilen yere iframe eklenerek diger sayfalarin bu frame de görüntülenmesi saglanir. 14.Bunun için table nun ortasina tiklayin. burada iken

    75. 15.Layout araçlarindan iframe dügmesine tiklayin. 16.Iframe standart olarak orta tabloya eklendi.

    76. 17.Iframe in degisik ayarlari düzenlenmelidir. 18.Iframe i seçin ve Code görünümüne geçin.

    77. 19. Code görünümünde iframe in with ve height degerlerini 100% olarak ayarlayin.ve table in içini kaplamasini saglayin. Genislik ayari. with Yükseklik ayari.height

    78. 20. Design kismina bakarak iframe in orta table i kapladigini görebilirsiniz. 21.Yeni olusturacagimiz sayfalari bu iframe de görüntüleyecegiz.Bunun için iframe bir isim verelim. Name özelligine isim iframe_orta ismi verelim.

    79. 22.File/New diyerek yeni bir sayfa olusturlim. Anasayfa.html Bolum_hak.html Vizyon.html Iletisim.html Isiml.html Isimlerinde dosyalari olusturun.

    80. 23. Daha sonra önceki uygulamdada yapmis oldugumuz accordion menüyü soldaki table in içine olusturun.

    81. 25.Daha sonra sayfalari menüden tiklayinca iframe de açmasini istedigimiz için iframe e vermis oldugumuz name ismini target alanina giriyoruz. Bu sekilde sayfalar artik iframe de görüntülenmis oldu.

    82. 24.Daha sonra menü dosyalarini tek tek burada olusturdugumuz dosyalari gösteriyoruz.

    83. 26. Sol taraftan Accordion menü nün listesinden ana sayfaya tiklayinca sag daki iframe içerisinde anasayfa.html sayfasi görüntülenmektedir.Bu sekilde diger sayfalarinda görüntülenmesini saglayin.

    84. 27. iframe in çerçeve görünümünü kapanmasi için frmborder degeri 0 girilir. 28. Iframe web sayfasi ilk çalisinca içerisinde sayfa görünümü olmasi isteniyorsa src degerine sayfa gösterilir.

    85. 29.Bu sekilde iframe in çerçevesi gizlenmis oldu.

    86. Frames(Çerçeveler) Uygulama: 1.File/New ile yeni bir çalisma açin. 2.Dosyayi yeni bir klasör içerisine index adinda kaydedin.

    87. 3. Daha sonra Layout araçlarinda frames dügmesi ile açilan pencereden Top Frame seçenegini seçin.

    88. 4. Çikan pencerede frame ismi verilir ve kaydedilir. 5.Daha sonra alttaki frame seçeneginin içinde iken tekrar frames araci ile yine bu alani bölün.

    89. 6.Daha sonra lefet frames seçenegi ile sol tarafa bir frame daha ekleyin

More Related