Sıcak harita tablolarına örnekler ve WordPress’te nasıl yapılacağı

Çevrimiçi bir sıcak harita tablosu her gördüğünüzde, bunun oldukça lüks ve karmaşık bir şey olduğunu düşünmelisiniz, değil mi? Aslında değil. Uzaktan, birçok sayısal veri ile oynamanız ve masanın sıcak haritası için hücreler yapmak için karmaşık teknik şeyler yapmanız gerekiyor gibi görünüyor. Ancak, doğru aracınız varsa, gerçeklikten uzaktır. Bu makalede, tablolar ve grafikler oluşturmak için WPDatatables, WordPress #1 eklentisi ile nasıl sıcak bir harita tablosu oluşturulacağını tartışacağım. Ne tür bir ısı haritası masası yapabiliriz? Aşağıdaki örnek gibi:

Evet, bu çok uzun bir ekran görüntüsü. Dinamik sıcak harita tablosunu burada görebilirsiniz. Siz veya ziyaretçileriniz için veri değerlerini daha kolay karşılaştırmak için bir sıcak harita tablosu oluşturmak için kaynak verilerinize bağlı olarak birkaç seçeneğiniz vardır. Ancak öğreticiye gitmeden önce, bu makalenin doğrudan atlayabileceğiniz iki bölümü olduğunu söylemek istiyorum:
Sıcak harita tablosu nasıl yapacağınızı öğreten öğretici
Kendinizi ayarlamanız için size ilham vermek için harita tablosu örneğini ısıtın
WPDatatables ile Bir Isı Haritası Tablosu Nasıl Oluşturulur 1. Veri kaynağınız yoksa sıfırdan bir tablo oluşturun, başından beri “Tablo Oluşturma” seçeneği ile bir ısı haritası tablosu oluşturabilirsiniz. veri değeri manuel olarak.
Bir veri tablosu oluşturmaya başlamak için WordPress yönetici panelinizi açın, wpdatatables’ı açın -> bir tablo oluşturun, üçüncü seçeneği “bir tablo kılavuzu oluştur” ve “İleri” yi tıklayın.

14 sütun yapacağınız bir masa yapısı oluşturmanıza yardımcı olacak bir sihirbaz adımı gösterilecektir: dönemler, yıllar ve diğerleri ayın isimleridir (Ocak, Şubat …). Dönem sütunu için, sütun türünü “tek satır dizesi” olarak bırakacaksınız ve diğerleri için “Tamsayı” sütunu türünü ayarlayacaksınız. Tabloyu yapılandırmayı bitirdikten sonra “Tablo Oluştur” u tıklayın. “Standart bir editörde açma” veya “Excel gibi bir editörde aç” seçeneği ile açılır. Masa yapısı yapılır. Şimdi sayısal veri değerinizi Excel gibi standart editörler veya editörler aracılığıyla gireceksiniz.

2. Excel, CSV, JSON, Google e -tablo, XML, PHP serileştirilmiş dizi veya veritabanındaki tablodaki (SQL kaynağı) birçok veri kaynağında verileriniz varsa, veri kaynaklarından tabloların sıcak bir haritası yapın, Sihirbaz masasında ikinci seçeneği kullanın. Mevcut veri kaynaklarıyla bağlantılı veri tabloları oluşturmaya başlamak için WordPress Yönetici Panelinizi Açın, WPDATATABLES’i açın -> Bir tablo oluşturun, ikinci seçeneği seçin “Mevcut veri kaynağına bağlı bir veri tablosu oluşturun.” ve “İleri” yi tıklayın.
Hangi kaynağa sahip olduğunuza bağlı olarak, talimatları izleyeceksiniz:

WPDatatables ile MySQL tabanlı bir tablo nasıl oluşturulur
Google elektronik tablolarından WordPress’te bir tablo oluşturun
Excel’den WordPress’te bir tablo oluşturun
CSV verilerinden tablo nasıl oluşturulur
JSON girişinden WordPress’te bir tablo oluşturun
XML girişli WordPress’te bir tablo oluşturulur
PHP serisi dizisine dayalı WordPress’te bir tablo oluşturun
Bu tablo için, CSV’yi buradan indirebileceğiniz bir veri kaynağı olarak kullanıyoruz. CSV’yi “Giriş Veri Kaynağı Türü” olarak seçeceksiniz ve ardından Gözat düğmesinin üstünde, daha önce indirdiğiniz ve sunucunuza yüklediğiniz kaynağı bulun. WPDatatables’ın yüklediğiniz CSV dosyasını okuyacağı ve tablo oluşturulması için Değişikliği Kaydet’i tıklayın. Bir tablo oluşturduktan sonra, iki seçenekten biriyle WordPress tablosunu gerektiği gibi ayarlayabilir ve yapılandırabilirsiniz. Bizim durumumuzda, ilk olarak “Tablo” ın üzerindeki filtreyi, tablo ayarlarındaki “Sıralama ve Filtreleme sekmesindeki” filtreyi etkinleştirir ve ardından her sütun için gelişmiş filtreyi yapılandırırız. Dönem sütunu için, diğer tüm sütunlar için ‘filtre kutusu seç’ ve ‘filtre numaralarını’ ayarladık. Ardından, tablo ayarlarındaki “Ekran” sekmesindeki “Duyarlama” seçeneğini etkinleştirir ve her sütun ayarındaki tabletler ve mobil cihazlar için “Ay” sütunu veya tablonun üzerindeki sütun listesi düğmesinde daha hızlı olan değerleri gizleriz.
Tablo verilerinin renk paletini kolay ve sezgisel bir şekilde ayarlamak için koşullu biçimlendirme kullanırız. İlk sütun için, hücre 2 içeriyorsa, “Set CSS CSS sınıfı” içeriyorsa, mavi arka planın üzerinde beyaz bir yazı tipi rengine sahip olacak şekilde “mavi-beyaz metin” olur.
Ardından, bu sınıfları şunun gibi tablo ayarlarında “Ayarla” sekmesindeki “CSS Custom” sütununda oluşturduk:

.wpdt-c .wpdatablewrapper .wpDatatable-1 TD.Blue {Arka Plan-Color: #0083C2! Önemli;}

.wpdt-c .wpdatablewrapper .wpDatatable-1 TD.White-Text {color: #fffff! Önemli;}

Bunun gibi:
.WpDatable-1’deki 1 numaralı tablo kimliğiniz olduğunda, diğer tüm sütunlar için tablonuz için değiştirmeniz gerektiğinde, maksimum sıcaklık tablosu için tablodaki değere göre farklı renkleri ayarlamak için aynı koşulu ayarladık. İkinci Tablo “Düşük Sıcaklık” Koşullu formattaki koşullar hariç, “Maximus Sıcaklığı” tablosu ile aynı yaklaşımı kullanıyoruz. Bu daha düşük bir sıcaklık değeri olduğundan, bu durumu kullanıyoruz.
Ardından, bu sınıfları şunun gibi tablo ayarlarında “Ayarla” sekmesindeki “CSS Custom” sütununda oluşturduk:

.wpdt-c .wpdatablewrapper .wpdatable-2 TD.White-Text {color: #fffff! Önemli;}

.wpdt-c .wpdatablewrapper .wpdatable-2 TD.Black-Text {Color: #000000! Önemli;}

.WpDatatable2’deki 2 numara tablo kimliğinizdir, bu nedenle tablonuz için değiştirmeniz gerekir. İşte burada! Artık küçük bir sözleşme baskısı okuyormuş gibi görünmeden veri değerlerini kolayca karşılaştırabileceğiniz bir sıcak harita var. Tabloda sıcak bir harita yapmanın kolay ve sezgisel bir yoluysa, bir sonraki bölüme bakın. Şimdi yapmanız gereken, ön uçtaki sayfanızda görünmektir. Diğer eklentiler gibi, kullanıcı sayfalarında veya yayınlarda tabloları görüntülemek için kısa kodlar kullanırız. Kısa kodlar eklemek, özellikle Elementors, WP Bakery veya Gutenberg gibi popüler sayfa yapımcıları kullanıyorsanız çok kolaydır.
Çalışanların Katılım Uygulamaları için Isı Haritaları Örnekleri
Sıcak harita görüntü kaynağı
Öğrenme Platformunun Kaynağı Görüntüsü
Grafik tasarım ilham kaynağı. Dataviz Ansiklopedisi

Görüntü kaynağı

Hava kirliliği ısı haritası

Amerika’daki belirli şehirler için ortalama sıcaklık görüntü kaynağı 2019 Kadınlar Dünya Kupası Tahmin Tahmin Görüntüsü Kaynağı

Yaygınlık kaynağı tablo görüntüsü
Stok getirilerinin kaynağı

Ürün gelir istatistiklerinin kaynağı

Takım Tablosu Resmi Kaynağı

Görüntü Kaynağı WPDatatables ile sıcak bir harita tablosu oluşturulacağınızla ilgili bu makaleyi okumak isterseniz, bir tablonun nasıl tasarlanacağına dair bu makaleyi okumalısınız.

Ayrıca Alternatif DataTables, JavaScript Tablo Kütüphanesi, Bir Anket Tablosu Oluşturma ve WordPress Fiyat Tablo eklentisi gibi birkaç ilgili konu hakkında yazıyoruz.

Sıcak harita tablolarına örnekler ve WordPress'te nasıl yapılacağı