Droptables : Стіл для стилізації

1. Формат у табл

На панелі інструментів ви можете встановити стиль для комірки, наприклад: шрифт, розмір шрифту, стиль тексту, колір фону для комірки, колір тексту, горизонтальне та вертикальне вирівнювання комірки,... Його можна застосувати до однієї або кількох клітинок.

Висоту рядка та ширину стовпця можна визначити в пікселях. Будь ласка, перейдіть до меню Формат > Застосувати розмір стовпця/рядка , потім виберіть Змінити розмір стовпця/Змінити розмір рядка . У спливаючому вікні ви можете вибрати діапазон і встановити px для стовпців або рядків. Натисніть Готово , щоб завершити.

2. Тема та варіанти сортування

У кожній таблиці ви можете знайти опцію вибору теми в меню Тема . Просто натисніть на тему, щоб застосувати її.

У тій самій темі меню > Альтернативні кольори функція «Автоматичне оформлення» допомагає розфарбувати лінію в таблиці за допомогою стилю заголовка та нижнього колонтитула . Ви можете вибрати стилі шаблону або створити власні в налаштуваннях плагіна.

Параметр sortable дозволяє виконувати сортування даних AJAX на інтерфейсі. Ви можете переглянути меню Формат > Сортувати .

Вирівнювання таблиці полягає у вирівнюванні div, який містить всю таблицю, наприклад, у центрі всієї таблиці. Ви можете знайти в меню Формат > Вирівнювання таблиці .

Підсвічування клітинки також доступне як опція. У конфігурації можна ввімкнути параметри «Рядок», «Стовпець» або «Обидва» . За замовчуванням він вимкнено. Ви можете налаштувати колір і непрозорість виділення.

3. Додайте підказку до комірок

Також доступна підказка під час наведення курсора миші на клітинку (потрібно активувати з параметрів компонента). У кожній комірці таблиці ви можете побачити опцію підказки, клацнувши по ній правою кнопкою миші.

Ви можете встановити ширину підказки в пікселях. Це призведе до підказки з редактором для редагування.

Додайте вміст і збережіть, коли ви готові, підказка відображатиметься на загальнодоступній стороні при наведенні миші.

4. Адміністрування ACL та Frontend

Можна керувати своїми таблицями з інтерфейсу Joomla. У диспетчері меню Joomla додайте пункт «Нове меню», виберіть тип « Управління таблицями» і виберіть « Droptables інтерфейс» - «За замовчуванням» як шаблон.

Ось те, що ви можете побачити Droptables Manager з інтерфейсу.

Ви можете використовувати Joomla User Group ACL для керування діями редакції таблиці. перше, щоб налаштувати, кому дозволено переглядати таблиці, вам слід перейти на вкладку Ролі користувачів Droptables .

Ви можете встановити власника таблиці в меню Таблиця > Доступ до таблиці.

5. Заморожування рядків і стовпчиків

Заморожування стовпців

Закріплення стовпців доступне в меню Формат > Параметри реагування . Ви можете закріпити до 5 стовпців. Відраховується від першого стовпця.

Щоб закріпити стовпець/рядок, є додаткова опція, яка дозволяє фіксувати висоту таблиці (оскільки ваш контейнер може мати нескінченну висоту).

Коли ви вибрали стовпець для закріплення, ви зможете прокручувати таблицю та завжди відображати фіксований стовпець.

Заморожування рядків

Ви можете знайти його в меню Формат > Заголовок таблиці , звідси ви можете увімкнути опцію та встановити закріплення рядків (до 5 рядків).

Якщо ви хочете встановити висоту таблиці, поверніться до адаптивних опцій.

Тоді перший рядок буде заморожений на лицьовій панелі відповідно до налаштування.

6. Фільтрація даних стовпців

Опція фільтрації доступна в меню Формат > Фільтри . Ви можете активувати його, натиснувши, щоб увімкнути поля фільтрації загальнодоступних даних.

Приклад фільтрів:

7. Заповнення клітинок і радіус межі

Ви можете знайти значок рамки на панелі інструментів, який допомагає налаштувати відступ і радіус межі в комірці.

8. Користувацький CSS

Давайте підемо на крок далі. Якщо ви веб-дизайнер з навичками редагування CSS, ви зможете додати CSS у меню Формат > Спеціальний CSS .

Комірки, рядки, стовпці мають координати для ідентифікації кожної з них і застосування до них користувацького CSS. R – рядок, C – стовпець. Ось рядок 1 (r1), стовпець 4 (c4) = dtr1 dtc4

Код CSS розфарбовується за допомогою дзеркала коду. Код CSS може бути менше коду, він теж працює!

9. Чуйні таблиці Joomla

Чи реагують мої таблиці чи використовують прокрутку на невеликих пристроях?

Приховування холодів

Droptables обробляють адаптивний дизайн за допомогою пріоритетного інструменту, як варіант. За замовчуванням функція адаптивного реагування вимкнена, буде переповнення (хоча це чудово працює на мобільних пристроях). Щоб скористатися приховування стовпців , вам слід перейти в меню «Формат» > «Адаптивні параметри».

Адаптивний режим розширений, ви можете визначити пріоритет для приховування стовпців на мобільних розмірах.
Коли стовпці приховано, буде показано мобільне меню з прапорцем, щоб примусово відображати/приховувати стовпці. Під час редакції таблиці розмір стовпця фіксується. Якщо розмір усіх стовпців завеликий для контейнера, у вас буде переповнення, і ви зможете легко прокручувати на мобільних пристроях.

Таблиця з прокруткою (краще для невеликої кількості стовпців)

Таблиця з прихованим стовпцем (краще для великої кількості стовпців)

Повторний заголовок

Це ще один варіант, якщо ви хочете вставити таблицю на невеликій ділянці вашого сайту. Вам слід перейти до меню Формат > Параметри реагування. Потім виберіть «Тип відповіді» > «Повторний заголовок».

Існують варіанти налаштування відповідно до вашого попиту:

• Адаптивна точка зупинки (px): виберіть значення точки зупинки в пікселях, щоб визначити, коли таблиця переключиться на цей адаптивний режим
• Максимальна висота чутливості (px): Коли активовано режим реагування, залежно від значення точки зупинки, визначте максимальну висоту, щоб уникнути дуже довгої таблиці
• Стиль адаптивного режиму: застосуйте стиль за замовчуванням для цього адаптивного режиму або використовуйте кольори таблиці

Після цього ви зможете побачити, як буде виглядати стіл на фронтенді.

10. Завантажити таблицю

Щоб поділитися своєю таблицею з громадськістю, перейдіть до меню «Таблиця» та встановіть прапорець біля опції «Експортувати Excel» . Тип файлу буде *.xlsx під час завантаження через інтерфейс.

11. Пагінація

Цю функцію можна знайти в меню Формат > Розбиття в кожній редакції таблиці. Використовуйте перемикач, щоб увімкнути та вибрати кількість рядків для відображення на сторінці.

12. Формат для окремих комірок 

Ви можете встановити формат: час дати, валюти, число для однієї клітинки в Droptables . Спочатку ви повинні вибрати a/multi cell(s). Потім перейдіть до меню Формат > Дата і час.

Після цього валюти та номер можна зробити таким же чином.

13. Роздрукуйте таблицю на інтерфейсі

Іноді вам потрібно роздрукувати таблицю. Отже, щоб відобразити кнопку «Друк» у інтерфейсі, спершу вам слід перейти до таблиці меню та поставити прапорець біля кнопки «Друк» .