WP Table Manager: Styling av tabeller

1. Format

I verktygsfältet kan du ställa in stil för celler, såsom: teckensnitt, teckenstorlek, textstil, bakgrundsfärg för celler, textfärg, cellens horisontella och vertikala justering, ... Det kan tillämpas för en enskild cell eller flera celler

Du kan välja procentandel för tabellredigeraren. Det betyder att du kan zooma in/ut i tabellen, mellan 50 % och 200 %.

Radhöjd och kolumnbredd kan definieras i pixlar. Gå till Meny Format > Använd kolumn-/radstorlek och välj sedan Ändra kolumnstorlek / Ändra radstorlek . I popup-fönstret kan du välja intervall och ange pixelstorlek för kolumner eller rader. Klicka på Klar för att slutföra.

2. Teman och alternativ

I varje tabell hittar du för temaval i menyn Tema. Klicka bara på ett tema för att tillämpa det.

Att tillämpa ett tema kommer att ersätta all data och stil i din tabell. Så sättet att gå vidare är att tillämpa ett tema, sedan redigera data för att skapa ditt eget tema och sedan duplicera dina tabeller.

Alternativa färger

I samma menytema > Alternativa färger hjälper funktionen "Automatisk styling" dig att färglägga linjen i din tabell med för sidhuvudsstyling och sidfotsstyling . Du kan välja mallstilar eller skapa dina egna i plugin-inställningarna.

Och du kan ta bort den alternativa färgen genom att klicka på "Ta bort > Ta bort automatisk styling" i högerklicksmenyn. Färgen kommer sedan att tas bort efter din bekräftelse.

Tabelljustering

Tabelljustering handlar om att justera div-elementen som innehåller hela tabellen, till exempel centrera hela tabellen. Du hittar det under Meny Format > Tabelljustering .

Cellmarkering

En cellmarkering finns också tillgänglig som ett alternativ. Du kan aktivera den här funktionen i konfigurationen. Den är inaktiverad som standard. Du kan välja markeringsraden för att justera färg och opacitet för markeringen.

På varje cell i en tabell kan du se alternativet Lägg till verktygstips när du högerklickar på den.

Du kan ställa in verktygstipsets bredd i pixlar. Det tar dig till ett verktygstips med en redigerare att redigera.

Lägg till innehåll och spara, du är klar, verktygstipset visas på den offentliga sidan när du håller muspekaren över den.

4. Rad- och kolumnfrysning

Kolumnfrysning

Kolumnfrysning är tillgängligt i menyn Format > Responsiva alternativ . Du kan frysa upp till 5 kolumner. Det räknas från den första kolumnen.

För att frysa färg/rad finns det ett ytterligare alternativ som låter dig fixera tabellens höjd (eftersom din tabellbehållare kan ha en oändlig höjd).

När du har valt vilken kolumn som ska frysas kan du skrolla i tabellen och alltid visa den fasta kolumnen.

Radfrysning

Du hittar den under Menyformat > Tabellrubrik , härifrån kan du aktivera alternativet och ställa in att rader ska frysas (upp till 5 rader).

Om du vill ställa in tabellhöjden, gå tillbaka till Responsiva alternativ.

Sedan kommer den första raden att frysas i frontend efter inställningen.

5. Sortera och filtrera

Om du vill sortera eller filtrera din tabell, gå till Meny Format > Sortera och filter .

Sedan visas ett popup-fönster med sorterings- och filteralternativ.

Om du vill sortera en tabell, aktivera helt enkelt för sortering i frontend . Du kan välja en kolumn för standardsortering och dess riktning.

I det här fallet, välj till exempel kolumn A med ASC- riktning.

Det finns två alternativ för filtrering:

Inuti kolumnen: du kan filtrera data i rubriken för varje kolumn. Växlingsknappen hjälper dig att visa eller dölja sökfältet i rubriken.

Avancerat filterformulär: när alternativet är valt kan du söka och filtrera data i en tabell

Huvudsökning: När du aktiverar den här funktionen läggs ett sökfält till i användargränssnittet. Detta gör det möjligt för användare att enkelt söka igenom all data i tabellen.

6. Cellfyllning och kantradie

Du hittar kantikonen i verktygsfältet som hjälper till att justera utfyllnad och kantradie i cellen.

Observera att om du har tillämpat ett tema kommer en del anpassad CSS att läggas till automatiskt. Du kan naturligtvis fortfarande redigera det.

7. Anpassad CSS

Låt oss gå ett steg längre. Om du är en webbdesigner med CSS-kunskaper kan du lägga till CSS via Menyformat > Anpassad CSS.

CSS-koden är färgad med hjälp av kodspegel och kan skrivas med mindre CSS, det fungerar också!

Celler, rader och kolumner har koordinater för att identifiera var och en och tillämpa anpassad CSS på den. R är rad, C är kolumn.

8. Responsiva WordPress-tabeller

Är mina tabeller responsiva eller använder de scrollfunktionen på små enheter?

Dölja kolumner

WP Table Manager hanterar den responsiva designen med ett prioriteringsverktyg som ett alternativ. Som standard är den responsiva funktionen inaktiverad, det kommer att finnas ett överflöde (vilket dock fungerar utmärkt på mobiler). För att använda Dölj kolumner , gå till Menyformat > Responsiva alternativ.

Det responsiva läget är avancerat, du kan definiera en prioritet för att dölja kolumner på mobila enheter. När kolumner är dolda visas en mobilmeny med en kryssruta för att tvinga fram visning/döljning av kolumner.
Kolumnstorleken är fast under tabellredigeringen. Om storleken på alla kolumner är för stor för behållaren kommer det att bli ett överflöd och du kommer enkelt att kunna scrolla på mobila enheter.

Tabell med scroll (bättre för ett litet antal kolumner)

Tabell med dold kolumn (bättre för ett stort antal kolumner)

Upprepad rubrik

Detta är ett annat alternativ om du vill infoga en tabell i ett litet område på din webbplats. Du bör gå till Menyformat > Responsiva alternativ. Välj sedan Responsiv typ > Upprepad rubrik.

Det kommer att finnas alternativ att anpassa efter dina behov:

Responsiv brytpunkt (px): Välj ett brytpunktsvärde i pixlar för att definiera när tabellen ska växla till detta responsiva läge.
Responsiv maxhöjd (px): När det responsiva läget är aktiverat, definiera en maxhöjd, beroende på brytpunktsvärdet, för att undvika en mycket lång tabell.
Responsivt lägesformat: Använd en standardformatering för detta responsiva läge eller använd tabellfärgerna

Efter det kan du se hur tabellen kommer att se ut i frontend.

Om du använder upprepad rubrik och filteralternativet är aktiverat kan du filtrera genom att skriva i textrutan i mobilvyn.

9. Exportera till Excel

För att spara din tabell på din dator, gå till menyn Tabell och klicka på Exportera Excel . Filtypen blir då *.xlsx efter export till frontend.

10. Paginering

Du hittar den här funktionen under Menyformat > Sidnumrering i varje tabellversion. Använd växlingsknappen för att aktivera och välja antalet rader som ska visas på en sida.

11. Styling av cellernas kantlinjer

Du kan använda kantlinjer för din tabell, till exempel kantbredd, kantfärg och kantstil. Markera först cellområdet och klicka sedan på ikonen i verktygsfältet.

12. Skriv ut tabellen på frontend

Ibland behöver du skriva ut din tabell. Så för att visa knappen Skriv ut i gränssnittet bör du först gå till menyn Tabell och markera knappen Skriv ut.