Ustvarite osupljive odzivne tabele v WordPressu z wpDataTables

Ustvarjanje tabel v WordPressu je enostavno. Obstajajo tradicionalni načini za dodajanje tabel v WordPress s kodo, vendar je najbolj priročen način za izdelavo tabele (ali grafikona) z vtičnikom wpDataTables WordPress. Zelo enostavno je uvoziti mizo iz različnih zunanjih virov, jo oblikovati po svojih željah in dodati na vaše spletno mesto.


Osnovne tabele HTML

Tabele lahko dodate v WordPress s standardno Oznake HTML tabele. So precej naravnost naprej in uporabljajo naslednjo osnovno strukturo (samo ne pozabite, da jih vnesete na zavihek “besedilo” pri ustvarjanju objave):

Najprej Drugič Tretjič
Jack Jackson 25
Jane Jenson 30

Rezultat bo tabela, ki je podobna tej (upoštevajte, da je vsak slog za celice glave odvisen od vaše teme):

NajprejDrugičTretjič
JackJackson25
JenJenson30

Uporaba HTML za ustvarjanje tabel bo delovala in je v redu, če želite na svoje spletno mesto dodati samo eno ali dve tabeli. Če pa boste pogosto ustvarjali tabele, boste verjetno naleteli na nekaj težav.

  • Za napredne možnosti se boste morali naučiti kodiranje HTML
  • Dodajanje HTML-ja zamudno in dolgoročno ovira vašo storilnost, če ustvarite veliko tabel
  • Ta metoda je v postavitvi in ​​oblikovanju močno omejena (razen če niste napredni razvijalec)

Če uporabljate WordPress, lahko varno predpostavimo, da 1) uporabljate najnovejšo različico WordPress-a in 2) da je vaša tema odzivna. Ko z oznako tabele HTML vstavite tabele na svoje mesto WordPress, boste porabili veliko časa za prilagoditev postavitve.

Vaše spletno mesto je morda odzivno, vendar vaše tabele niso.

To bi seveda prekinilo odzivno lastnost vašega spletnega mesta. Vstavljanje podatkov na vaše spletno mesto je lahko tudi težava. Programska oprema za obdelavo preglednic, kot sta Google Spreadsheets ali Microsoft Excel, ima veliko orodij za uvoz, da pridobi podatke iz baze podatkov. Ko pa tipkate vsakega posameznega znaka – to ni zelo produktivno.

Prej smo ugotovili tri glavne težave pri vstavljanju tabel s HTML v WordPress. Brez skrbi – obstaja veliko boljši način za ustvarjanje tabel. Dovolite mi, da predstavim vtičnik, ki bo odpravil vse prej omenjene težave in prinesel številne uporabne funkcije.

Ustvarite boljše tabele z wpDataTables

wpDataTables Vtičnik za odzivne tabele

Za ustvarjanje tabel s programom WordPress toplo priporočamo wpDataTables. Ta popolnoma odziven premium vtičnik olajša ustvarjanje, prilagajanje in upravljanje tabel in grafikonov v WordPressu – kodiranje ni potrebno. Samo namestite in začnite graditi tabele in grafikone! Po našem skromnem mnenju nam zaupa več kot 14.300 ljudi (in so ga prej imenovali enega izmed naših WordPress vtičnikov v mesecu) kot eno najboljših načinov za dodajanje tabel na svoje spletno mesto s pogonom na WordPress..

Več o wpDataTables Ogled predstavitve v živo

Več o wpDataTables v Themeforest lahko izveste s klikom na zgornje gumbe ali nadaljujte z branjem, če želite izvedeti, zakaj se nam zdi tako super.

Več virov

wpDataTables Viri podatkov

WpDataTables vam omogoča, da uvozite iz različnih virov, odvisno od tega, kje želite shraniti svoje podatke. Za uvoz podatkov izberite Excel, CSV, Google Doc, XML, JSON, Serialized PHP Array ali poizvedbo MySQL. Obstajajo tudi možnosti za ročno ustvarjanje nove tabele, povezavo do vira podatkov v živo (ki do dinamične posodobitve tabele, ko jo naložite na stran) ali ustvarjanje poizvedbe po meri z orodjem GUI (grafični uporabniški vmesnik).

Poizvedba MySQL je moj osebni najljubši, saj mi omogoča ogled in spreminjati podatki iz ustrezne baze podatkov. Če imate ekipo razvijalcev, ki dela na namiznem projektu, bi bilo sodelovanje zelo preprosto (več o tem kasneje)!

Izboljšana prilagoditev in odzivna postavitev

Oblikovanje mize še nikoli ni bilo lažje. Z nekaj potrditvenimi polji in nekaj izbirami barv lahko oblikujete vtičnik, da dopolni temo vašega spletnega mesta. Oglejte si vrhunske oblikovne funkcije, ki jih vtičnik lahko ponudi:

wpDataTables Styling po meri

Na voljo so tudi vgrajene možnosti za jezik vmesnika, oblikovanje časa / datuma, poravnave, prilagojeni JS / CSS in še več. Oh, in sem omenil, da je vtičnik tudi odziven mobilni telefon? Določite lahko, koliko prostora bo porabila tabela, ne glede na velikost zaslona!

Filtri za učinkovito iskanje

Možnosti razvrščanja in filtriranja wpDataTables

Ko ustvarjate novo tabelo (ali urejate izstopajočo), imate možnost omogočiti filtre. S filtri lahko niz rezultatov zmanjšate samo z želenimi predmeti. To je neverjetno uporabno za poizvedovanje po veliki bazi podatkov. Na primer, če imate zbirko podatkov knjižnice, nato filtrirate rezultate na podlagi predmet bi vam pomagalo, da boste knjigo našli hitreje.

Ker pa vsakič urejate filtre, se poveča število izračunov, ki jih opravi baza podatkov, s čimer se poveča pritisk strežnika. Zato imate sladko možnost, da filtre v celoti onemogočite.

Uredite bazo MySQL iz Frontenda

wpDataTables Dovoli urejanje v sprednjem delu

wpDataTables omogoča tudi neposredno urejanje baz podatkov s sprednje strani – torej s spletnega mesta WordPress v živo. Pri konfiguraciji tabele preprosto omogočite možnost na zavihku »Urejanje«. Lahko celo nastavite, kateri uporabniki lahko urejajo vrednosti v bazi podatkov – tako da so odprti za vse uporabnike, da predložijo ali določijo dostop do svoje vloge uporabnika.

Vizualizirajte podatke s pomočjo grafikonov

Vizualizacija je daleč učinkovitejše privlačenje pozornosti kot običajno besedilo. Konec koncev je videti verjeti. To je povečuje našo hitrost vnosa podatkov, v primerjavi s tradicionalnim branjem. Na primer, ko si ogledujete pregledno tabelo letnega poročila o dohodku, boste podatke skoraj vedno interpretirali hitreje v primerjavi z branjem podatkov v vseh dvanajstih mesecih.

slogi grafikona wpDataTables

wpDataTables vam pomaga ustvariti dinamične grafikone (prek Google Charts, HighCharts ali Chart.js) za vizualizacijo podatkov vaše tabele. To je še posebej uporabno za tabele z veliko številskih podatkov, na primer blogerji, ki delijo svoja mesečna poročila o dohodku.

Vseživljenjske posodobitve

Večina razvijalcev vtičnikov vam bo zagotovila eno leto posodobitev in podpore. Vendar je ta razvijalnik vključil življenjske posodobitve in šestmesečno podporo za enkratno plačilo (opomba – za nadaljnjo podporo boste morali obnoviti licenco).

Podrobna dokumentacija

Pri razlagi, kako uporabljati wpDataTables, razvijalci ne spremenijo kamna. Obstaja obsežna spletna dokumentacija in video vadnice, s pomočjo katerih boste lahko izkoristili vse zmogljivosti vtičnika!

To nam pove dve stvari:

  1. Razvijalec skrbi za svoje stranke – tako, da se vrnejo k nakupu izdelka
  2. Znana stranka = manj kolcanja = nižje podporne vozovnice = veseli kupci

Poleg tega lahko razvijalci z manj vstopnimi kartami namenijo več časa za izboljšanje vtičnika in uvajanje novejših funkcij!

Kako sestaviti odzivno tabelo s wpDataTables

Zdaj, ko veste, zakaj menimo, da je wpDataTables odličen vtičnik, pokažemo, kako ga uporabljati! Natančno so trije koraki za ustvarjanje nove tabele s pomočjo vtičnika wpDataTables.

1. Namestite wpDataTables

Vem, da bi to moralo biti očitno, vendar boste najprej morali namestiti wpDataTables. Ker gre za vrhunski vtičnik, ga je treba kupiti in prenesti s CodeCanyon-a (samo pojdite na svoje nakupe in prenesite samo »Namestljivo datoteko WordPress«).

Namestite vtičnik wpDataTables

Nato sledite navodilom na zaslonu, da končate namestitev in aktiviranje.

2. Ustvari tabelo podatkov

Če je vtičnik aktiven, bi morali imeti čisto nov element “wpDataTables”. Kliknite nanj in nato velik modri gumb Dodaj novo, da začnete ustvarjati novo tabelo.

wpDataTables Ustvari ali uvozi tabelo

Vaša prva možnost bo, kako želite ustvariti svojo mizo. Predstavljenih mora biti pet možnosti. Izbrali smo možnost uvoza iz CVS-ja, saj smo imeli preprosto preglednico, ki smo jo želeli uporabiti. Potem, ko kliknete Naprej, boste pozvani, da izberete in naložite datoteko.

wpDataTables Upravljanje preglednice

Ko naložite vir podatkov, boste lahko vnesli ime tabele po meri in uporabili možnosti za urejanje, dodajanje ali brisanje stolpcev in vrstic. Nato kliknite zeleni gumb, da končate ustvarjanje mize.

Nastavitve tabele wpDataTables

Zdaj ste v domačem raztežaju! S te strani lahko nastavite dodatne nastavitve za mize (neobvezno). Z možnostmi »Prikaz« omogočite odzivno strjevanje na manjših napravah, dodajte vodoravno drsno vrstico, omejite širino tabele itd. Pojdite na zavihek »Urejanje«, da omogočite sprednje urejanje ali omogočite orodja tabel (natisnete, kopirate ali izvozite hitre povezave). Najboljše od tega, da lahko svoje spremembe predogledate v živo med premikanjem. Ne pozabite samo klikniti Shrani (ali uveljavite) kljukico, če spremenite kakršne koli spremembe.

Ko končate, prenesite kratko kodo svoje tabele z vrha zaslona, ​​ker jo boste potrebovali za tretji in zadnji korak.

3. Vstavite svojo tabelo v objavo ali stran

wpDataTables Koda

Če želite uporabiti svojo tabelo, morate samo prilepiti bližnjico v vsebino v objavi ali strani (kot na zgornji sliki). Ta kratka koda se prikaže na sprednjem delu vašega spletnega mesta glede na to, kako ste oblikovali tabelo:

wpDataTables Tabela sprednjega dela

Pri nas lahko vidite, da smo omogočili orodja za tabele (za tiskanje, izvoz itd.), Filtriranje in sprednje vloge. Ampak to je to – vaša miza je pripravljena!

Želite sestaviti grafikon?

Grafike lahko sestavite tudi s pomočjo wpDataTables. Ko ustvarite tabelo, za začetek kliknite »Ustvari grafikon«.

wpDataTables Ustvari grafikon

Od tu navedite ime grafikona, izberite slog (med njimi lahko izbirate tone) in nadaljujte do naslednjega zaslona, ​​kjer boste izbrali podatkovno tabelo, ki jo želite uporabiti za ustvarjanje grafikona.

wpDataTables Dodeli podatke

Po izbiri tabele, ki jo želite uporabiti kot vir podatkov, stolpcem tabele dodelite dele grafikona. Odvisno od grafikona, ki ga izberete, je morda potrebno minimalno število vrednosti. V našem primeru smo izbrali črtni grafikon, ki je za grafikon potreboval vsaj dva stolpca (to sta palice). Ko razvrstite stolpce, preidete na naslednji korak.

wpDataTables Prilagodite grafikon

Zdaj pa za zabavni del. Uporabite možnosti za slog in dodajanje funkcij v grafikon. Na voljo je več možnosti za odzivno širino, višino, ozadja, obrobe, pisave, nalepke, barve, prikaz / skrivanje naslova, nasvete z orodji za letenje in še več.

Ko končate z urejanjem, kliknite naslednjo in kopirajte kratko kodo grafikona. Preprosto ga prilepite v vsebino vaše objave ali strani, shranite in pojdite na sprednji del svojega spletnega mesta, da si ogledate grafikon!

Dodajte več funkcij tabele WordPress

Želijo več? Obstaja več razširitve in dodatke za wpDataTables da dodate še več možnosti tabel in grafikonov za svoje WordPress spletno mesto.

wpDataTables Napredni filtri

Zmogljivi filtri: Nastavite kaskadne (sestavljene od leve proti desni) filtre, fasetirano filtriranje (za ozke rezultate uporabite več filtrov), onemogočite prikaz tabel, dokler uporabnik ne izbere filtrov, doda funkcije za iskanje v živo in še več. Pri nastavitvi tabele samo omogočite in konfigurirajte možnost.

Graditelj poročil: Ustvarite lastna poročila Word ali Excel po meri na podlagi podatkovnih tabel. To je še posebej koristno, če uporabnikom omogočite urejanje vnaprej (tako da zbirate podatke, lahko znova zaženete in natisnete poročila) ali če morate redno obnavljati poročila (npr. Mesečne račune ali časovne kartice).

wpDataTables Oblikovni obrazci

Oblikovne oblike: Dodajte podporo priljubljenemu oblikovalcu obrazcev Formidable Forms Pro. Uporabite Obrazljive obrazce za ustvarjanje obrazca za zbiranje podatkov (kot je anketa) in nato samodejno ustvari tabelo na podlagi predložitev uporabnikov, pri čemer vsako polje pretvori v stolpec.

Teži oblike: Vključite vloge Gravity Forms z wpDataTables, da boste samodejno ustvarili tabele WordPress na podlagi uporabniških podatkov. Razširitev doda nov vir podatkov pri ustvarjanju tabele, tako da je enostavno povezavo do določenega Gravity Form in vizualiziranje podatkov.

Preizkusite wpDataTables zase

wpDataTables Peskovnik v živo

Večina razvijalcev vam predstavi predstavitev v živo, s katero lahko občutite, kaj lahko vtičnik naredi. Prikažejo pa vam le izhod, tj. Pogled “sočelje” – ki temelji na vnaprej določenih vhodih. Tukaj večina demo vtičnikov vtičnikov manjka – ne omogočajo dostopa do nastavitev in orodij vtičnika – tj..

wpDataTables pa vam ponuja popoln peskovnik na njihovem predstavitvenem mestu, kjer lahko poskusite pred nakupom. Vsi trgovci z avtomobili to počnejo – zloglasna testna vožnja. Skozi peskovnik lahko preizkusite funkcije vtičnika glede na vsebino vašega srca in si ogledate izhod v realnem času.

Oglejte si predstavitev wpDataTables

Želite prenesti kopijo, da preizkusite svojo namestitev? wpDataTables ponuja lite različico, ki jo lahko zgrabite iz skladišča WordPress.org. Nima vseh odličnih, vrhunskih funkcij, ki smo jih obravnavali zgoraj, vendar je odličen način, da preverite, ali je vtičnik prava rešitev za vaše potrebe.

Pridobite wpDataTables Lite

In če vam je všeč, lahko greste naprej in ga kupite s popolnim brezskrbnostjo. Zakaj? Ker ste izdelek že preizkusili in uporabili.

Zaključek

wpDataTables je eden tistih nepogrešljivih vtičnikov za WordPress spletna mesta, ki se ukvarjajo z ogromno količino podatkov. Ne glede na to, ali ustvarjate šolski projekt ali letno poročilo podjetja, tabele in njihova vizualizacija igrajo ključno vlogo pri predstavitvi podatkov.

Pridobite wpDataTables za WordPress

Ste že preizkusili wpDataTables? Ali imate kakršna koli vprašanja, kaj lahko ta vtičnik naredi? Spodaj pustite komentar – radi bi se oglasili od vas!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me