burak-webdizayn

form olustur

JotForm ile sizlerde web siteleriniz için kolayca formlar oluşturabilirsiniz. İletişim
formları, dosya yükleme, anket, yıldız puanlama, derecelendirme vb. formları
kolayca oluşturabiliyorsunuz. Formlarınıza güvenlik kodu, e-posta kontrolü,
minimum-maksimum karakter sınırlaması, otomatik tamamlama gibi daha bir
çok ek özellikler tanımaktadır. Bunları sürükle bırak, ve özelliklerini değiştirme
penceresinden kolayca değiştirebiliyorsunuz. Web sitesine erişmek için burayı 
tıklayabilirsiniz,site türkçedir. Karşınıza ilk olarak bir tanıtım videosu gelecektir
fakat video ingilizcedir. Ama yaptıkları gayet basit olduğundan sadece izleme ile
anlaşılabilir. Konunun daha iyi özümsenmesi için gelin birlikte bir iletişim formu
yapalım…


 

JotFrom İle Adım Adım Form Oluşturma

1. İlk olarak siteyi buradan ziyaret ediyoruz. Karşımıza şöyle bir ekran gelecektir.
jottform acilis ekrani

2.Yukarıdaki ekranı X(çarpı) işaretinden kapadıktan sonra ise site şu şekilde açılmış olacaktır.
jotform site

3. Şimdi form oluşturmaya başlayabiliriz. Yukarıdaki resimde sarı çizgi ile belirtilen yerdeki Başlıkalanını boş alana sürükle bırak yapıyoruz. Karşımıza şöyle bir görüntü gelecektir.
başlık

4. Başlık yazısını düzenlemek için o alana tıklayınız ve İletişim Formu olarak değiştiriniz.
iletişim formu başlığı

5. Yazı kutusu alanını da aynı şekilde sürükle bırak yapınız ve alanın adını aynı şekilde tıklayın veAd Soyad olarak değiştiriniz.
yazı kutusu

6. E-posta alanınıda aynı şekilde sürükleyin ve adını e-posta yapın. Sonrasında da Metin Alanını sürükle bırak yapın ve adını Mesaj değiştirin.
mesaj alanı

7. Şimdi form elemanlarını ekledik ve bu elemanlara ekstra özellikler kazandıracağız. Yani zorunlu alanları belirleyeceğiz. Bunun için resimdeki ayar dişlisine tıklayın ve açılan yerden zorunluyuseçin.
ayar

8. Aynı şekilde e-posta alanı da yapın ve sonuç resimdeki gibi kırmızı yıldız (*) olmalıdır.
zorunlu

9. Şimdi ise yukarıdaki resimde gösterilen Özellikleri Göster alanına tıklayın. Buradan girilen e-posta adresinin e-posta yazım şekline uygun olup olmadığının kontrolünü yaptırma ayarını ayarlayacağız. Onun için aşağıdaki resimdeki gibi Değer Kontrolü alanını E-posta olarak seçiniz. Daha sonra Ayarları Kapat düğmesini tıklayınız.
zorunlu eposta ayar

10. Formu kaydetmek için sol üst köşedeki Kaydet düğmesine tıklayınız.
kaydet

11. Tıkladıktan sonra size iletişim kutusuna yazılan mesajların hangi e-posta adresine gönderileceğini soracaktır o alanı da aşağıdaki resimde ki gibi kendi adresinizi yazarak doldurunuz ve E-posta Adresimi Kaydet‘e basınız.

12. Aşağıdaki resimde görüldüğü üzere ilk olarak formu ön izlemek için Ön İzle butonuna tıklayın. Karşınıza aşağıdaki gibi pencere gelecektir.
ön izleme

13. Arkasından formu gördükten sonra kaynak kodu almak için de Form Kaynak alanına tıklayınız. Buradaki kodu da iletişim kodunu kullanacağınız ister HTML ister PHP veya vb. sayfaya yapıştırınız.
form kaynak

14. Şu an itibariyle form oluşturuldu tek olarak bir sayfaya yapıştırmak kaldı. Siz de deneme.htmladı altında bir html dosyası oluşturun ve kaynak kodunuzu aşağıdaki gibi yapıştırın.
kaynak kod

15. Kaydettiğiniz sayfayı girip çalıştırdığınız şu şekilde görüntüyü almış olmanız gerekecektir.
sonuç

Evet, sanırsam biraz resimli ve uzun bir anlatım oldu. Gayet sade olduğu için herkesin anladığını düşünüyorum. Umarım faydalı bir yazı olmuştur. Siz de kendiniz için formları bu şekilde hazırlayıp daha bir çok ayarları da panelinden yapabilirsiniz. Üye olup formlarınızı da saklayabilirsiniz. Güle güle kullanın şimdiden….

Tüm hakları saklıdır.Copyright © 2012 - 2013
Çizen: Mustafa Erdoğan , HTML&CSS Döken: Tugay Tekeci
Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
Ücretsiz kaydol