dreamweaver etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
dreamweaver etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

30 Ocak 2013 Çarşamba

Dreamweaver ile Mail Doğrulama

Siteniz için oluşturdugunuz iletişim formlarında e-mail doğrulama yöntemini dreamweaver form validation özelliğini kullanarak sitenize gelen kullanıcıya doğru mail girme zorunlulugunda oldugunu hatırlatabilirsiniz.E-mail doğrulama işlemini dreamweaver kullanarak iletişim formunuza basit bir şekilde uygulayabilirsiniz.

Öncelikle Tag inspector panel ine tıklayarak behaviors sekmesinden + işaretine tıklayarak
validate form yani form dogrulama seçeneğine tıklayalım.

dreamweaver mail dogrulama

Resimde de görüldüğü gibi Validate Form seçeneğine tıkladığımız da form doğrulama işlemini başlatmış oluruz.

dreamweaver mail dogrulama

Gerekli işlemleri form dogrulama kutusunda düzenleyebilirsiniz,Yani required kutsunu onayladıgınız zaman seçtiginiz input için bilgi girilmesi zorunlu olacak ve ayrıca email adresi olarak ayarladıgınız zaman email adresi düzeninde girilmesini zorunlu duruma getirmiş olursunuz.

dreamweaver mail dogrulama




Ve Sonuç;
iletişim formununa mail adresi yerine herhangi bir şey yazdgınızda direk mail adresi girmeniz konusunda sizi otomatik olarak uyaracaktır.

dreamweaver mail dogrulama

Böylelikle dreamweaver sayesinde email doğrulatma işlemini form validation seçeneğini kullarak kendi formumuza uygulayabiliriz.

5 Eylül 2012 Çarşamba

JavaScript Lightbox Kullanımı

javascript_lightbox
Lightbox ; hemen hemen içerisinde resim barındıran bütün websitelerinde kullanılan oldukça popüler bir javascript uygulamasıdır. Bir başka deyişle Lightbox herhangi bir resmin üzerine tıklayınca resmin büyümesidir.Örnegin yeni bir websitesi tasarlıyorsunuz ve galeri sayfası veya  kücük resimlerden olusan bir alan ayırdınız.Burada sitenize gelen ziyaretçiler sitedeki resimlere tıkladıgında resim büyürerek daha detaylı bir görünüme sahip olur.Bir anlamda sitenizde javascript lightbox kullanarak html sayfanızı  dinamikleştirmiş olursunuz.Şimdi gelelim javascript lightbox kullanımına;

Öncelikle Lightbox u indireceğimiz  siteye giriş yapalım  ve Download kısmından Lightbox v2.51 versiyonunu indirelim . Lightbox u indirdikten sonra lightbox rar lı  dosyasının içinde

  • Css
  • Images
  • Js 
3 tane dosya olacak. Bu 3 dosyayı sitenizin bulundugu kök dizine atınız.Veya kendi klasörlerinizin içine ekleyeniz.Örnegin kendinizin bir css klasörü varsa o css klasörünün içine Css dosyalarını ekleyebilirsiniz.
 Dosyaları ekledikten sonra ; Şimdi Html dosyamıza bu dosyaların yollarını gosterelim.

Öncelikle Css dosyasını yolunu gösterelim ;

  •  <link href="css/lightbox.css" rel="stylesheet" media="screen" />

Sonra Javascript ve JQuery dosyalarını ekleyelim ;


  • <script src="js/jquery-1.7.2.min.js"></script>
  • <script src="js/lightbox.js"></script>
 

Bu dosyaları html sayfamıza cagırdıktan sonra .Lightbox u aktif etmemiz için son kodumuzu ekleyerek lightbox işlemini halletmiş olacağız.

Lightbox efektini aktif etmek için  resme link verirken rel="lightbox" niteligini eklememiz gerekir.

  •  <a href="images/1.jpg" rel="lightbox">

Dreamweaver Cs 5 programında kullandıgım ve sonucu sizinde daha iyi gorebilmeniz acısından bütün kodların bir arada yer aldıgı ekran goruntusunu paylasmak istiyorum. Uygularken herhangi bir hata ile karsılasmamanız acısından ve daha rahat uygulayabilmeniz amacıyla bu resime bakarak lightbox uygulamasını daha rahat kullanabilirsiniz.

javascript_lightbox

Son olarak js lightbox un mucidi Lokesh Dhakar teşşekür ederek yazımı sonlandırmak istiyorum, Daha detaylı bilgi almak için  http://lokeshdhakar.com/ sitesini ziyaret edebiliriniz.

4 Ağustos 2012 Cumartesi

Dreamweaver Cs5 Site Tanımlama

dreameweaver cs5  logo


Dreamweaver programını kullanarak site olustururken , ilk yapmamız gereken işlerden biri site tanımlamadır. Eğer ayrıca local host üzerinden sitenizi test etmek istiyorsanız mutlak suretle sitenizi tanımlamanız gerekir.

Öncelikle "Site"  sekmesine gelin ve ordan " New Site" sekmesine tıklayarak yeni bir site olusturarak site tanımlama işlemine başlayalım.

Ardından karsımıza cıkan resimde ki gibi sekmeyle karsılasacagız

dreamweaver_site_tanımlama

  • Site Name : Tanımlamıs olacagımız sitenin adını verecegiz.Sitenize hangi ismi vermek istiyorsanız onu girebilirisiniz.

  • Local Site Folder : Local Site Folder da ise web siteniz için olusturacagınız sayfalar resimler dosyalar vs. nerede tutacagınızı belirleyeceginiz yerdir.Kısacası sitenizin dosyalarının tutulacagı yerdir.
Burayı tamamladıktan Sonra Servers Kısmına gelelim. Server Kısmında localhost tan yani Xampp veya Wampp gibi programlar kullanıyorsak yada php mysql web uygulamaları kullanarak site olusturuyorsak tanımlamamız gerekir.

dreamweaver_site_tanimlama

Basic ayarlardan hemen server'ı tanımlayalım ;

Server Name : Serverımıza verecegimiz ismi girelim istedigimiz bir ismi girebiliriz

Connecting Using: Burada local /network u secelim çünki kendi bilgisayarımızdan baglantı olusturacagız.

Server Folder : locate site folder olusturdugumuz dosya yolunun aynısını buraya ekliyoruz.

Web URL : Web url miz ise tarayıcıda girecegimiz adrestir . Burada localhost uzantılı ve site adımızla birlikte olmalıdır.

Örnek olarak ; http://localhost/tourism/index.html

dreamweaver_site_tanımlama

Advanced Settings kısmında ise ;


Default Images Folder : burada locate site folder içine bir tane images folder olusturacagız ve bunu default images folder olarak tanımlayacagız site için olusturdugumuz resimleride images folder kısmında bulunduracagız.

Site-Wide Media Quey File : Burada siteniz için olustaracagınız media dosyalarını eklemek için olusturacagınız dosyanın yolunu gostereceksiniz.

Web URL : web url yi yukarıda ayarlamıstık aynı sekilde olacak.

Bu kadar ayarlamaları yaptıktan sonra daha fazla detaya girmeden save diyerek dreamweaver cs5  site tanımlama işlemini bitiriyoruz.
//Luckyorange//