WordPress dan Visualisasi Data

Diterbitkan: 2022-02-04

Apakah Anda memiliki banyak data yang ingin Anda sajikan di situs WordPress Anda dalam format grafik? Mungkin beberapa statistik atau data penjualan yang menunjukkan kepada klien bagaimana Anda telah meningkatkan lalu lintas ke situs web mereka selama beberapa bulan? Apa pun alasannya, menyajikan data dengan cara visual membuatnya jauh lebih mudah untuk mengomunikasikan poin inti dengan audiens Anda serta menjadi lebih menyenangkan… lagi pula, kecuali jika Anda seorang geek bilangan real, meneliti spreadsheet dengan deretan angka tidak ada ide yang sangat menyenangkan!

Anda mungkin menyukai ide untuk menyajikan data secara visual, tetapi pertanyaan kuncinya adalah 'bagaimana Anda melakukannya?'. Mungkin tergoda untuk membuat grafik atau diagram lingkaran di beberapa perangkat lunak desain grafis (seperti Canva) dan kemudian menempatkan gambar di situs web Anda. Itu pasti akan menyelesaikan pekerjaan tetapi bagaimana jika ada cara yang lebih baik?

Untungnya, ada, dan, sebagai WordPress, semuanya dimulai dengan sebuah plugin! Pada artikel ini, kita akan melihat beberapa opsi plugin yang tersedia untuk membantu Anda menampilkan data tersebut dengan cara yang ramah pengguna, menarik, dan mudah dibaca. Mari kita pergi!

Grafik Mudah

Plugin Easy charts adalah plugin populer dan gratis yang menyelesaikan pekerjaan. Itu belum diperbarui dalam beberapa saat tetapi ini tampaknya lebih karena terus berfungsi dengan baik 'apa adanya' daripada karena pengabaian yang signifikan.

Ini ditampilkan dengan baik dan cukup mudah untuk memulai. Setelah terinstal, langsung menuju ke tautan menu 'Tambah Baru' dari dalam area Admin Easy Charts.

Anda akan melihat bahwa Anda dapat menambahkan data dalam baris dan kolom (seperti yang Anda lakukan di Excel atau spreadsheet lainnya. Sebagai bonus, ada panel pratinjau bagi Anda untuk melihat hasil dengan cepat.

Konfigurasi dirinci. Anda dapat mempersonalisasi gaya, tipografi, teks, warna, dan lainnya untuk mendapatkan tampilan yang Anda inginkan. Ada beberapa cara data Anda dapat disajikan… yang Anda pilih akan sangat bergantung pada jenis data yang Anda presentasikan.

  • Grafik batang
  • Bagan Area
  • Bagan Batang Bertumpuk
  • Bagan Area Bertumpuk
  • Grafik Batang Persen
  • Grafik Persen Area
  • Pie chart
  • Bagan Donat
  • Tingkatkan Bagan Batang
  • Bagan Air Terjun
  • Bagan Garis
  • Bagan Area Kutub

Ketika Anda telah membuat bagan Anda, Anda akan diberikan kode pendek yang kemudian dapat Anda tempelkan ke dalam posting atau halaman. Atau, Anda dapat menambahkan bagan Anda langsung dari dalam editor visual, jika Anda menggunakannya, dengan bantuan tombol cepat-masukkan "Bagan Mudah".

Plugin ini dikembangkan menggunakan pustaka Javascript uvCharts dan membuat bagan dengan transisi SVG dan CSS3. Sebagai bonus keren, Anda juga dapat mengunduh bagan apa pun yang Anda buat sebagai file gambar. Terakhir, Anda juga akan melihat bahwa grafiknya responsif… suatu keharusan di dunia desain web yang mengutamakan seluler saat ini.

Visualisasi

Plugin Visualizer adalah pilihan populer lainnya untuk membuat bagan dan diagram yang terlihat bagus dan responsif untuk situs web Anda. Dengan lebih dari 40.000 instalasi dan banyak ulasan bagus, ini adalah pilihan yang sangat baik.

Setelah menginstal dan mengaktifkan plugin, Anda akan melihatnya terdaftar di menu WordPress. Klik "Visualizer -> Tambahkan bagan baru" untuk menambahkan bagan pertama Anda.

Jendela sembulan akan muncul yang membawa Anda melalui proses pemilihan opsi yang sempurna untuk persyaratan bagan khusus Anda.

Anda memiliki 6 template gratis untuk dipilih:

  • Meja
  • Pai/Donat
  • Garis
  • Daerah
  • Geografis
  • Batang

Anda dapat mengunggah CSV data Anda secara lokal atau mengimpor data dari file CSV jarak jauh atau Google Spreadsheet. Anda mungkin ingin mengunduh file CSV template terlebih dahulu, namun untuk memeriksa apakah data Anda terstruktur dengan cara yang dimengerti oleh plugin. Atau, Anda dapat mengimpor data dari sumber JSON jarak jauh atau menambahkan data secara manual.

Di tab Pengaturan, Anda akan menemukan berbagai opsi yang memungkinkan Anda mengubah gaya bagan Anda sebelum menerbitkannya.

Setelah membuat bagan, Anda dapat menyalin kode pendek yang terkait atau mengekspornya sebagai CSV atau gambar. Plugin Visualizer menggunakan Google Visualization API, DataTables.net dan ChartJS untuk mencapai hal di atas.

wpDataTables

Plugin wpDataTables adalah pilihan bagus lainnya untuk membuat tabel dan bagan data untuk ditampilkan di situs WordPress Anda. Ini adalah plugin premium tetapi menawarkan versi gratis yang ringan yang mungkin menyediakan fitur yang cukup untuk banyak proyek.

Setelah diinstal dan diaktifkan, buka "wpDatatables -> Buat Bagan" untuk memulai.

Anda dapat menggunakan wizard dan mengikuti langkah-langkah untuk membuat bagan pilihan Anda. Tetapkan nama untuk bagan, pilih mesin render dan jenis visualisasi, lalu dapatkan data sumber yang harus berupa tabel yang dibuat dengan plugin yang sama.

Mari kita lihat proses ini sedikit lebih detail untuk memeriksa fungsi yang tidak ditawarkan oleh plugin yang disebutkan sebelumnya. Klik "Buat Tabel" untuk memulai.

Seperti yang Anda lihat, Anda bisa membuatnya dari awal atau menarik isi tabel dari sumber yang ada. Untuk contoh ini, kami akan memilih untuk membuat dari sumber yang ada. Setelah diklik maka kita akan diminta untuk memilih “Input data source type”.

Dalam versi gratis, kita dapat menggunakan format file CSV, Excel, XML atau JSON atau menyediakan objek serial PHP.

Host situs web Anda dengan Pressidium

GARANSI UANG KEMBALI 60 HARI

LIHAT RENCANA KAMI

Ini adalah fitur hebat karena menawarkan pilihan untuk menyajikan data dari database Anda. Ini bukan yang termudah untuk dilakukan, tetapi hei, kami siap menghadapi tantangan!

Dalam contoh ini, katakanlah kita ingin melihat beberapa statistik yang menunjukkan jumlah posting terhadap halaman.

Kode PHP yang menampilkan array serial akan terlihat seperti ini:

 <?php include('wp-blog-header.php'); header("HTTP/1.1 200 OK"); $return_array = array(); $posts_query = new WP_Query( array( 'post_type' => 'post', 'post_status' => 'publish' ) ); $pages_query = new WP_Query( array( 'post_type' => 'page', 'post_status' => 'publish' ) ); $posts = $posts_query->found_posts; $pages = $pages_query->found_posts; $return_array[] = array( 'Type' => 'Posts', ' Count' => $posts ); $return_array[] = array( 'Type' => 'Pages', 'Count' => $pages ); echo serialize( $return_array ); ?>

Menurut dokumentasi resmi yang disediakan oleh wpDataTables, entri larik induk akan diuraikan sebagai baris, kunci larik anak akan diuraikan sebagai tajuk kolom, dan nilai larik anak sebagai nilai sel.

Kami menyimpan kode dalam file yang kami beri nama test.php dan, untuk tujuan contoh ini, kami akan menempatkannya di folder root instalasi WordPress kami.

Kembali ke admin area, kita akan mengisi path file seperti ini:

Kami menyimpan perubahan dan voila.

Sekarang kita dapat mengatur tabel sebagai sumber bagan, memilih jenis bagan dan menyimpan bagan. Sederhana seperti itu! Langkah terakhir adalah mengikuti Wizard hingga kesimpulannya yang akan melibatkan penyesuaian pengaturan yang tersedia untuk mendapatkan desain yang Anda inginkan untuk bagan Anda. Setelah itu, Anda bebas mempublikasikannya.

Kesimpulan

Sangat berguna untuk dapat menampilkan data secara visual di situs web. Namun, banyak pengguna WordPress tidak menyadari bahwa ini adalah hal yang relatif mudah dilakukan dengan bantuan plugin. Semoga di atas telah memberi Anda beberapa gagasan tentang opsi yang tersedia untuk Anda. Selamat membuat grafik!