Droptables: Stylingová tabulka

1. Formátování v tabulce

Na panelu nástrojů můžete nastavit styl buňky, jako například: písmo, velikost písma, styl textu, barvu pozadí buňky, barvu textu, horizontální a vertikální zarovnání buňky atd. Lze jej použít na jednu buňku nebo více buněk.

Výšku řádku a šířku sloupce lze definovat v pixelech. Přejděte do nabídky Formát > Použít velikost sloupce/řádku a poté vyberte Změnit velikost sloupce / Změnit velikost řádku . V rozbalovacím okně můžete vybrat rozsah a nastavit velikost pixelů pro sloupce nebo řádky. Kliknutím na Hotovo dokončete.

2. Možnosti motivu a řazení

V každé tabulce najdete výběru motivu v nabídce Téma . Stačí na motiv kliknout a použít ho.

Ve stejné nabídce Téma > Alternativní barvy vám funkce „Automatické stylování“ pomůže obarvit čáru v tabulce pomocí záhlaví a zápatí . Můžete si vybrat styly šablony nebo si vytvořit vlastní v nastavení pluginu.

Parametr sortable umožňuje třídit data pomocí AJAXu na frontendu. Můžete to vidět v nabídce Formát > Seřadit .

Zarovnání tabulky spočívá v zarovnání divu, který obsahuje celou tabulku, například vystředění celé tabulky. Najdete to v nabídce Formát > Zarovnání tabulky .

konfiguraci můžete povolit možnosti Řádek, Sloupec nebo Obě . Ve výchozím nastavení je tato možnost zakázána. Můžete upravit barvu a neprůhlednost zvýraznění.

3. Přidání popisku k buňkám

K dispozici je také popisek při najetí myší na buňku (je nutné jej aktivovat v možnostech komponenty). Popisek po kliknutí pravým tlačítkem myši.

Šířku popisku můžete nastavit v pixelech. Zobrazí se vám popisek s editorem pro úpravy.

Přidejte obsah a uložte, hotovo, popisek se zobrazí na veřejné straně po najetí myší.

4. Správa ACL a frontendu

Tabulky je možné spravovat z frontendu Joomly. Ve správci nabídek Joomly přidejte položku Nové menu , vyberte typ jako šablonu vyberte Droptables

Zde je to, co můžete vidět z frontendu ve Správci Droptables .

Pro ovládání akcí editace tabulek můžete použít ACL skupiny uživatelů Joomla. Nejprve nastavte, kdo má povoleno prohlížet tabulky, na Role uživatelů v Droptables .

Vlastníka tabulky můžete nastavit z nabídky Tabulka > Přístup k tabulce.

5. Zmrazení řádků a sloupců

Zmrazení sloupce

Zmrazení sloupců je k dispozici v nabídce Formát > Responzivní možnosti . Můžete zmrazit až 5 sloupců. Počítá se od prvního sloupce.

Pro zmrazení barev/řádků existuje další možnost, která umožňuje opravit výšku tabulky (protože váš kontejner tabulky může mít nekonečnou výšku).

Jakmile vyberete sloupec, který chcete zmrazit, budete moci v tabulce posouvat a vždy zobrazit pevný sloupec.

Zmrazení řádků

Najdete ji v nabídce Formát > Záhlaví tabulky , kde můžete zapnout možnost a nastavit zmrazení řádků (až 5 řádků).

Pokud chcete nastavit výšku tabulky, vraťte se prosím k responzivním možnostem.

První řádek bude po nastavení na frontendu zmrazen.

6. Filtrování dat ve sloupcích

Možnost filtrování je k dispozici v nabídce Formát > Filtry . Můžete ji aktivovat kliknutím na pro povolení filtrování veřejných dat.

Příklad filtrů:

7. Odsazení buněk a poloměr ohraničení

Ikonu ohraničení najdete na panelu nástrojů, která pomáhá upravit odsazení a poloměr ohraničení buňky.

8. Vlastní CSS

Pojďme ještě o krok dál. Pokud jste webdesignér se znalostmi CSS edicí, budete moci přidat CSS v nabídce Formát > Vlastní CSS .

Buňky, řádky a sloupce mají souřadnice pro identifikaci každé z nich a použití vlastního CSS. R je řádek, C je sloupec. Zde je to řádek 1 (r1), sloupec 4 (c4) = dtr1 dtc4

CSS kód je obarvený pomocí zrcadlení kódu. CSS kód může být méně kódovaný, funguje to také!

9. Responzivní tabulky Joomla

Jsou mé tabulky responzivní, nebo na malých zařízeních používají rolování?

Skrytí sloupců

Droptables zvládají responzivní design pomocí nástroje pro prioritizaci, který je k dispozici jako volitelná možnost. Ve výchozím nastavení je responzivní funkce zakázána a dojde k přetečení (což ale na mobilních zařízeních funguje skvěle). Chcete-li použít Skrytí sloupců , přejděte do nabídky Formát > Responzivní možnosti.

Responzivní režim je pokročilý, můžete definovat prioritu pro skrytí sloupců na mobilních zařízeních. Pokud jsou sloupce skryté, zobrazí se mobilní nabídka se zaškrtávacím políčkem pro vynucení zobrazení/skrytí sloupců.
Velikost sloupce je během editace tabulky pevně stanovena. Pokud je velikost všech sloupců pro kontejner příliš velká, dojde k přetečení a na mobilních zařízeních budete moci snadno posouvat.

Tabulka s posuvníkem (lepší pro malý počet sloupců)

Tabulka se skrytým sloupcem (lepší pro velký počet sloupců)

Opakovaná hlavička

Toto je další možnost, pokud chcete vložit tabulku do malé oblasti na vašem webu. Měli byste přejít do nabídky Formát > Responzivní možnosti. Poté vyberte Responzivní typ > Opakovaná hlavička.

Budou k dispozici možnosti přizpůsobení dle vašich požadavků:

• Responzivní zarážka (px): Vyberte hodnotu zarážky v pixelech, která definuje, kdy se tabulka přepne do tohoto responzivního režimu.
• Responzivní maximální výška (px): Když je aktivován responzivní režim, v závislosti na hodnotě zarážky definuje maximální výšku, aby se zabránilo příliš dlouhé tabulce.
• Styl responzivního režimu: Použijte pro tento responzivní režim výchozí styl nebo použijte barvy tabulky.

Poté si můžete prohlédnout, jak bude tabulka vypadat na frontendu.

10. Stáhnout tabulku

Chcete-li tabulku sdílet s veřejností, přejděte do Tabulka a zaškrtněte tlačítko Exportovat do Excelu . Typ souboru při stahování na frontendu bude *.xlsx.

11. Stránkování

Tuto funkci najdete v nabídce Formát > Stránkování v každé verzi tabulky. Pomocí přepínače ji povolíte a vyberete počet řádků, které se na stránce zobrazí.

12. Formátování jednotlivých buněk 

Droptables můžete nastavit formát: Datum a čas, Měny a Číslo pro jednu buňku (buňky) . Nejprve byste měli vybrat buňku (buňky). Poté přejděte do nabídky Formát > Datum a čas.

Poté lze stejným způsobem provést zadávání měn a čísel

13. Tisk tabulky na frontendu

Někdy potřebujete tabulku vytisknout. Abyste tedy na frontendu tlačítko Tisk nabídky Tabulka a zaškrtnout možnost Tlačítko Tisk