Tüm modern web siteleri, çeşitli ekran genişliklerinde doğru şekilde çalışacak şekilde tasarlanmıştır. Eski günlerde tablolar düz HTML kullanılarak oluşturuldu. Esnek web tasarımı yeni standart haline geldikçe, temel HTML tabloları modern web sitelerinin taleplerini karşılamakta zorlandı. Basit HTML tabloları duyarlı olmadığından, içerdikleri metnin mobil ekran boyutlarında okunması son derece zordur; bu nedenle, düzenlerini görüntülendikleri ekran boyutuna göre uyarlayan duyarlı Tablolar geliştirmek için kullanılırlar. HTML ve CSS medya sorguları birbirleriyle birlikte kullanılmalıdır.
- Çözüm 1: Divi Builder kullanılarak tablolar oluşturulabilir.
- Çözüm 2: Varsayılan olarak bu işlevi içeren tablo plugin yararlanın!
- WP Table Manager
- WP Table Manager Arayüzü
- Çözüm
Çok büyük veya çok çeşitli olmayan tek bir bilgi kümesi için tüm ekran boyutlarında okunabilir bir düzende tablolar oluşturulabilir ve bu, temel HTML ve CSS yaklaşımlarıyla gerçekleştirilebilir. Ancak tablonun önemli miktarda veri tutması amaçlanıyorsa, mobil cihazlarda veya genişliği 786 pikselden az olan ekranlarda okunabilir bir düzen oluşturmak kolay değildir.
Bir tabloyu tüm ekran boyutlarında duyarlı hale getirmek için HTML ve CSS ile çalışan web tasarımcısı veri miktarını dikkate almazsa, büyük olasılıkla site içeriğinin okunabilirliğini önemli ölçüde etkileyen sorunlarla karşılaşacaktır. Bir Divi web sitesi tasarımcısı olarak, duyarlı tabloları manuel olarak oluşturmaya çalışırken uygulamaya koyabileceğiniz bazı önerileri burada bulabilirsiniz.
Daha küçük bir ekrana uyum sağlamak için tablonun boyutunu küçültürken, her sınıfın belirli bir ekran çözünürlüğünü hedeflediği birden fazla CSS sınıfı oluşturmanız gerekecektir.
Yapabileceğiniz alternatif bir çözüm, ekran boyutu daha küçük olduğunda belirli sütunları tablodan gizlemektir.
Daha küçük ekranlar için tablonun üstbilgilerine ve altbilgilerine yatay veya dikey kaydırmalar ekleyebilirsiniz.
Tüm ekran boyutlarına uyacak şekilde ölçeklendirilebilecek tek bir tablo oluşturun ve materyali daha okunaklı hale getirmek için tabloyu yakınlaştırın.
Bu çözümler önemli miktarda çaba gerektirir ve gereksinimler içeriğe ve ekran boyutuna bağlı olarak farklılık gösterebilir.
Çözüm 1: Divi Builder kullanılarak tablolar oluşturulabilir.
Elegant Themes, Divi'nin yerleşik özelliklerini kullanarak duyarlı tabloların nasıl oluşturulacağını gösteren bir eğitim hazırladı. Buradan kontrol edin. Tablo kapsayıcısının dışına taşan sütunlara yatay kaydırma özellikleri ekleyerek tablonun kullanıcı girişine daha duyarlı olmasını sağladılar. Eğitim sayfasına giderek daha fazla bilgi edinebilirsiniz:
Çözüm 2: Varsayılan olarak bu işlevi içeren tablo plugin yararlanın!
Depoda bulunan çok sayıda ÜCRETSİZ plugin çözümü sayesinde Divi web siteniz için duyarlı bir tablo oluşturmak artık sorun değil. Ancak yerleşik mobil yanıt verme seçeneklerine sahip tablo plugin bulmak biraz zor. WpDataTables gibi popüler plugin bu özelliğe ücretsiz bir seçenek olarak sahip değildir.
Bu yazıda WP Tabe Builder plugin en iyilerinden birini ele alıyoruz.
WP Table Manager
WP Table Manager tabloları yönetmek için eksiksiz bir elektronik tablo arayüzü sunan tek WordPress tablo plugin . Bir tablo oluşturun, bir tema seçin ve tabloları oluşturmayı bitirir bitirmez düzenlemeye başlayın. HTML hücre düzenleme, tablo kopyalama, hesaplama ve Excel, Google E-Tablolar ve Office 365 ile senkronizasyon dahil olmak üzere kapsamlı, güçlü tablo düzenleme özelliklerinden yararlanacaksınız; Son kullanıcının bir tabloyu değiştirmesi, bir hücreye tıklamak ve görsel bir metin düzenleyicinin yardımıyla veya olmadan verileri düzenlemek kadar basittir.
WP Table Manager basit bir görsel arayüz kullanarak çekici, duyarlı tablolar tasarlamanıza olanak tanır. Kullanımı ücretsizdir. Etkinleştirdikten sonra kurulum kılavuzuna yönlendirileceksiniz. Prosedürleri takip edin ve beğeninize göre gerekli ayarlamaları yapın. Sanki sihirle, her boyuttaki her cihazda güzel bir şekilde görüntülenen güzel bir masa yarattınız. Daha sonra tek yapmanız gereken kısa kodu kopyalayıp sayfanın görünmesini istediğiniz yere yapıştırmak. Oluşturucu şu anda sürükle ve bırak özelliğini kullanarak tablo yer tutucularına sürükleyip bırakabileceğiniz yedi öğe (Metin, Resim, Liste, Düğme, Yıldız Derecelendirmesi, Özel HTML ve Kısa Kod) sunmaktadır. Bunlar, ürün karşılaştırma tabloları, fiyatlandırma tabloları, liste tabloları vb. gibi çeşitli tablo türlerini oluşturmak için kullanılabilir; Bu, araştırmamız sırasında acemi dostu olduğunu keşfettiğimiz Table plugin . Lütfen mevcut sürümün bir arama alanına veya başka herhangi bir filtreleme işlevine sahip olmadığını unutmayın. Ayrıca çok sayıda veri seti girmeyi veya yönetmeyi düşünüyorsanız bu ideal bir seçenek olmayabilir. Bu tür bir kullanım senaryosu için, Visualizer veya Tablepress mükemmel seçimlerdir.
WP Table Manager Arayüzü
Kısa kodu Divi'deki bir kod modülüne veya bir metin modülüne ekleyebilirsiniz.
DIVI Teması WP Table Manager içerir.
WP Table Manager plugin tabloların işlenmesi söz konusu olduğunda ayrıntıların yönetilmesine yanıt verir;
- Tablonuzda filtre seçeneği etkinleştirildiğinde, her sütunda veri arayabilir ve tablonun tamamını filtreleyebilirsiniz. Ayrıca sayfalandırma dahil büyük tablolarda da çalışır
- Her sütunda sunulan yukarı ve aşağı oklar tablo verilerinizi düzenleyecektir. Tablo veri sıralaması, sayfalandırma da dahil olmak üzere büyük tablolarda da çalışır.
- Tablonuzu ihtiyacınız olan tüm verilerle oluşturduktan sonra kullanıcıların sıralama yapmasına izin verebilirsiniz, ancak aynı zamanda varsayılan bir sıralama da oluşturabilirsiniz. Yarıştan sonra koşucuları varış sırasına göre sıralayabileceğiniz için bilgiler zaman içinde değiştiğinde bu oldukça faydalı olabilir.
- Sunucu kaynaklarınızı korurken web sitenizin ön yüzünde büyük bir tablo görüntülemek istiyorsanız sayfalandırmaya ihtiyaç vardır. Her sayfada önceden belirlenmiş miktarda tablo satırı seçin.
Ayrıca WP Table Manager Excel dosya içe aktarıcı aracılığıyla excel belgelerini yönetmenin açık bir yolu da vardır. Ancak, Excel verilerini yalnızca düzenlenebilir bir HTML tablosu olarak içe aktarabilir ve dönüştürebilirsiniz veya Excel dosyasını renkleri, arka planları, sütun boyutunu, bağlantıları içeren stiliyle içe aktarabilirsiniz.
Excel tablonuzu yönetin ve WordPress web sitenizde yayınlayın! Tabloya bir Excel dosyasını WordPress medya yönetimi veya bir FTP istemcisi aracılığıyla yükleyebilirsiniz. Daha sonra Excel dosyanızı seçin ve tablo ayarlarından senkronizasyonu başlatın.
WordPress tablonuz ile Excel dosyası arasındaki senkronizasyon, bir dakika ile bir gün arasında düzenli olarak yapılabilir. Otomatik senkronizasyon gecikmesi, istenmeyen WordPress genel tablo güncellemelerini önlemek veya büyük bir tablo için sunucu kaynaklarından tasarruf etmek için de tanımlanabilir.
Bir tabloyu içe aktardıktan sonra tüm veriler güncellenebilir; bu sadece bir plugin gibi düzenlenebilen sıradan bir HTML tablosudur! WordPress elektronik tablosu.
Öte yandan, istediğiniz tüm verileri içeren düzenli bir tablo oluşturduktan sonra, bunu geleneksel bir Excel dosyası olarak dışa aktarabilir ve amp güncellenmiş Excel sayfasını daha sonra yeniden çalıştırabilirsiniz. Kullanıcılarınız artık tabloyu WordPress ön ucunda bir Excel sayfası olarak dışa aktarabilir.
WP Table Manager ayrıca OneDrive aracılığıyla Office 365 ile de senkronize olur.
OneDrive Excel dosyası içe ve dışa aktarma aracı mevcuttur; Çalıştırırken dosyalarınızı içe aktararak ve değiştirerek zamandan tasarruf edin. OneDrive dosya senkronizasyonu ile daha da üretken olun! Senkronize etmek, otomatik olarak ayarlamak için bir Office 365 Excel dosyası seçin ve dosya web sitenizde yayınlansın.
WP Table Manager veritabanından tablolar oluşturmanıza ve içe aktarmanıza yardımcı olur; artık daha önce mevcut olmayan çeşitli web sitesi veritabanı içeriklerinden tablolar oluşturmaya yönelik bir araç içeriyor. Veritabanındaki tablolar ve sütunlar seçilir, yapılandırılabilir filtreler uygulanır ve tablolar WP Table manager arayüzü aracılığıyla yönetilir. Veritabanı güncellendiğinde tablonuz otomatik olarak artırılır! Ayrıca sıralama, filtreleme, otomatik tasarım ve sayfalandırma seçenekleri de hizmetinizdedir.
Geliştirici değilseniz, herhangi bir veritabanı materyalini HTML tablonuza görsel olarak bağlayabilirsiniz. Veritabanı içeriğinden yeni bir tablo oluşturulurken veritabanınızdaki tüm tablolar sunulur.
Web sitenizin veritabanı basit bir arama yapabilir ve tablolarınızı ve sütunlarınızı seçebilir; bu geniş bir veritabanında oldukça faydalıdır. Ayrıca, veritabanındaki tablo konusunda size adım adım yardımcı olacak bir sihirbaz da burada.
Son aşamada tabloyu veritabanından önizlemeden önce, belirtilen veritabanı tablolarına özel sorgunuzu yazabilirsiniz. SEÇ, DEĞİŞTİR, YENİDEN ADLANDIR, GÖSTER, AÇIKLA, AÇIKLA gibi bazı işlevleri destekliyoruz.
Bir veritabanı tablosu bazen birçok satırla birlikte gelir; dolayısıyla bu seçenek ekranınıza uygun bir tablo görüntülemenize yardımcı olabilir. Ayrıca, her sayfada tablonun önceden tanımlanmış satır sayısını ayarlayabilirsiniz. Üstelik tüm tabloyu varsayılan olarak sıralamak için bir sütun da seçebilirsiniz.
WordPress veritabanı tablosu bağlantısı yalnızca WordPress tablolarıyla sınırlı değildir. WordPress'ten olmayan ancak aynı veritabanına kurulu olan tüm tablolar birbirine bağlanabilir.
Tablonuzdaki devasa veriler arasında belirli bir nesneye odaklanmak için birkaç özel kural oluşturabilirsiniz. Eğer aşina iseniz >, <, LIKE, IN gibi veritabanı operatörleriyle oynayabilirsiniz.
Oluşturduğunuz veritabanındaki tablolar diğer tablolar gibi düzenlenebilir (eğer kullanıcının bu mantıklı özelliğe erişimi varsa); Bu, amp tek tek yapıldığında biraz zaman alacak olan birkaç yayın sonrası tarih gibi bazı veritabanı verilerini toplu olarak düzenlemek için oldukça kullanışlıdır.
Çözüm
Tablolar bir dizi bilgiyi sergilemenin en etkili yollarından biridir. Ancak daha az teknik bir kişi için bir web sayfasında tablo oluşturmak zorlu bir iştir. Bu plugin kullanarak, yalnızca birkaç basit adımda kolayca herhangi bir cihazda okunabilen tablolar oluşturabilirsiniz. Dahası, duyarlı tabloların site ziyaretçilerinize genel olarak olumlu deneyimler sunacağı kesindir. Öyleyse bunu bir deneyin ve aşağıdaki yorum bölümünde deneyiminizi bize bildirin.