WordPress'te Duyarlı Bir Tablo Nasıl Yapılır?

WordPress'te güzel, duyarlı bir tablo oluşturmanın bir yolunu mu arıyorsunuz? Cevabımız bizde!

İnternete erişmenin pek çok yolu olduğundan, kullanıcılarınız muhtemelen sitenizi farklı cihazlarda ziyaret ediyordur. Ancak, daha küçük ekranlı mobil cihazlar verilerinizi doğru şekilde görüntülemeyebilir. Bu nedenle, duyarlı bir tablonun nasıl oluşturulacağını bilmek çok önemli olabilir.

Neyse ki, Formidable Forms eklentimizin yardımıyla bu işlem basit olabilir. En yeni duyarlı tablolar özelliğimizi kullanarak, her tür cihaz için okunması kolay tablolar oluşturabilirsiniz.

Bu makalede, biçimlendirmenizi farklı boyuttaki tarayıcılar için uyarlanabilir hale getirmenin bazı avantajlarını açıklayacağız. Ardından, yalnızca üç adımda nasıl duyarlı bir tablo oluşturacağınızı göstereceğiz. Hemen dalalım!

Neden duyarlı bir tablo yapmak isteyebilirsiniz?

Tablolar her türlü bilgiyi düzenlemek için kullanılabilir. Örneğin, bir iş panosu web sitesi oluşturmanın etkili bir yolu olabilirler.

Ancak, masanızın görünümü bazı cihazlardan etkilenebilir. Daha küçük ekranlar ve tarayıcı pencereleri, garip, neredeyse okunamayan tablolara veya yatay kaydırmaya neden olabilir. Bu, sitenizin kullanım kolaylığını olumsuz etkileyebilir. Ancak standart HTML tablolarıyla yapmak kolay değil.

Bu yüzden tablolarınızı duyarlı hale getirmek için bir seçenek ekledik. Bu özelliği seçtiğinizde, tarayıcı penceresi 760 pikselden daha küçük olduğunda tablonuzdaki her sütun tam bir satır olarak görüntülenecektir.

Bu özellik sayesinde siteniz en uygun görünümü sağlayacak şekilde otomatik olarak ayarlanacaktır. Böylece kullanıcılarınız, cihazlarından bağımsız olarak tablolarınızda başarılı bir şekilde gezinebilecekler.

Neyse ki, Formidable Forms bu özelliği eklemeyi de kolaylaştırıyor. Bu eklenti ile herhangi bir ekran boyutuna uyum sağlayabilen bir tablodan sadece birkaç adım uzaktasınız!

WordPress'te duyarlı bir tablo nasıl yapılır (3 adımda)

Başlamadan önce, bu premium bir özellik olduğundan Formidable Forms Pro + Views'un kurulu olduğundan ve etkinleştirildiğinden emin olun. Eklentimizi kullanarak, mevcut en iyi WordPress tablo eklentilerinden birini seçeceksiniz.

1. Adım: Yeni bir veri kaynağı oluşturun ve Görüntüle

Duyarlı bir tablo oluşturmanın ilk adımı bir veri kaynağı oluşturmaktır. Bu, tablonuzu doldurmanız için bilgi sağlayacak formdur. Formidable → Forms → Add New'e giderek bir veri kaynağı oluşturabilirsiniz:

Ardından, bir form oluşturmak için alanları sürükleyip bırakın. Bu izlenecek yol için temel bir üyelik listesi kullanacağız. Son tablonun üç sütun görüntülemesini istiyoruz: ad, yaş ve konum. Bu nedenle, bu alanların her birini veri kaynağımıza dahil edeceğiz.

Bitirdikten sonra çalışmanızı kaydedin. Daha sonra sitenizin kullanıcılarından yanıt toplayabilirsiniz. Alternatif olarak, zaman kazanmak istiyorsanız girişlerinizi içe aktarabilirsiniz.

İşiniz bittiğinde, bir tablo Görünümü oluşturmanız gerekecek. Bunu Formidable → Views → Add New seçeneğine giderek yapabilirsiniz. Ardından, görünüm türünüz olarak Tablo'yu seçin.

Bir sonraki ekranda, Formdan Girdileri Kullan altında daha önce oluşturduğunuz veri kaynağı formunu seçin. Görünümünüzü de adlandırmanız gerekir:

Son olarak, Görünüm oluştur'a tıklayın. Bu sizi bir sonraki adımda dolduracağımız bir sonraki ekrana getirecektir.

2. Adım: Tablo ayarlarınızı özelleştirin

Artık tablo oluşturucuda masanızın temel ayarlarını özelleştirmeye başlayabilirsiniz. Önceki adımdan sonra, şimdi aşağıdaki ekrana bakıyor olmalısınız:

Tablonuzda hangi alanları görüntülemek istediğinize karar verin. Örneğin, formunuz bir ad ve soyadı isterse, kullanıcılarınızın gizliliğine saygı göstermek için yalnızca adı görüntülemek isteyebilirsiniz.

Hazır olduğunuzda, Görünüm oluştur'u tıklayın. Ardından, Tablo görünümünüz için ana düzenleme ekranını görmelisiniz:

Ardından, soldaki menüden Tablo Ayarları bölümüne gidin. Satır Stili açılır menüsünün altında, Tabloyu duyarlı yap etiketli küçük bir onay kutusu görmelisiniz:

Bu kutuyu işaretlemezseniz, tablonuz ekranınızın boyutuna sığacak şekilde değişmeyecektir. Örneğin, özelliği olmayan küçük bir ekranda yukarıdaki tablomuz şöyle görünür:

Gördüğünüz gibi, masa özgün tasarımını korumuştur. Bu, garip bir şekilde geniş bir tablo oluşturur ve akıllı telefonları olanlar için okuması daha zor olabilir.

Başvuru için, aynı tabloyu mobil uyumlu hale getirmek için kutuyu işaretlediğimizde tablo öğelerine şu şekilde olur:

Sütunlar şimdi tüm satırları kaplıyor ve tablo genişliğinden daha uzun. Böylece, daha küçük pencereleri olan kullanıcılar, her bir grubun bilgilerini bir kerede kolayca görebilecekler.

3. Adım: Tablonuzu şekillendirin ve yayınlayın

Artık tablonuzu duyarlı hale getirdiğinize göre, bazı stil öğeleri de eklemek isteyebilirsiniz. Örneğin, önceki duyarlı tablo örneklerimizde Zebra Stripes tablo satır stili kullanılmıştır.

Hangi tablo stili seçeneklerini seçerseniz seçin, masanız tüm ekran boyutlarına uyum sağlayacaktır. Örneğin, Grid stilini kullanan yukarıdaki duyarlı tablo örneklerinden aynı veriler:

Mobil kullanıcıları barındırmanın başka bir yolu, duyarlı tablonuza birkaç sayfa eklemektir. Bu, ziyaretçinizin uzun süre kaydırma ihtiyacını azaltabilir. Gelişmiş Ayarlar'a gidin ve Sayfa Boyutu altında sayfa başına istediğiniz gönderi sayısını girin.

Artık tabloyu birden çok sayfaya ekleyebileceksiniz:

Tablo yapmanız gerektiğinde bu ayarları göz önünde bulundurmanızı öneririz. Ne tür veriler görüntülediğiniz önemli değil, yanıt verme, daha fazla kişinin web sitenize erişmesine yardımcı olmanın basit bir yolu olabilir.

Çözüm

Bugünlerde çok sayıda mobil internet kullanıcısı olduğu için, web sitenizi oluştururken onların kullanıcı deneyimlerini göz önünde bulundurmak isteyebilirsiniz. Bu, özellikle tablo tasarımı gibi biçimlendirme araçları söz konusu olduğunda doğru olabilir. Neyse ki, duyarlı bir tablo oluşturmak basit bir işlem olabilir.

Bu yazıda size üç adımda nasıl responsive tablo yapacağınızı gösterdik:

1. Yeni bir tablo veri kaynağı ve yeni bir görünüm oluşturun.
2. Duyarlılığı dahil etmek için ekran ayarlarınızı özelleştirin.
3. Masanız için diğer stil öğelerini düşünün.

Duyarlı bir tablo seçeneği eklemek, Formidable Forms'u güçlü bir eklenti yapan birçok yönden yalnızca biridir. Bugün diğer etkileyici özelliklerimizden bazılarına göz atın!

Müthiş Görünümler hakkında daha fazla bilgi edinin

• Ultimate WordPress Tablo Eklentisi
  Daha fazla oku

  Müthiş Görünümler: En İyi WordPress Özel Uygulama Eklentisi
  Daha fazla oku

  6 En İyi WordPress Veri Görselleştirme Eklentisi
  Daha fazla oku