Wszystkie nowoczesne strony internetowe są zaprojektowane tak, aby działały poprawnie na różnych szerokościach ekranów. W dawnych czasach tabele tworzono przy użyciu zwykłego kodu HTML. Ponieważ elastyczne projektowanie stron internetowych stało się nowym standardem, podstawowe tabele HTML z trudem nadążają za wymaganiami nowoczesnych witryn internetowych. Ponieważ proste tabele HTML nie są responsywne, zawarty w nich tekst jest niezwykle trudny do odczytania na ekranach telefonów komórkowych, dlatego używa się ich do tworzenia responsywnych tabel, które dostosowują swój układ w zależności od rozmiaru ekranu, na którym są przeglądane, Zapytania o media HTML i CSS muszą być używane w połączeniu ze sobą.
- Rozwiązanie 1: Tabele można tworzyć za pomocą Divi Builder.
- Rozwiązanie 2: Skorzystaj z plugin tabel, które domyślnie zawierają tę funkcjonalność!
- WP Table Manager
- Interfejs WP Table Manager
- Wniosek
Można tworzyć tabele z czytelnym układem na ekranach o dowolnej wielkości i zawierać pojedynczy zestaw informacji, który nie jest zbyt duży ani zbyt zróżnicowany, a można to osiągnąć za pomocą podstawowych metod HTML i CSS. Jeśli jednak tabela ma pomieścić znaczną ilość danych, nie jest łatwo zbudować czytelny układ na urządzeniach mobilnych lub ekranach o szerokości mniejszej niż 786 pikseli.
Jeśli projektant stron internetowych pracujący z HTML i CSS, aby tabela była responsywna na ekranach wszystkich rozmiarów, nie weźmie pod uwagę ilości danych, prawdopodobnie napotka problemy, które znacząco wpłyną na czytelność zawartości witryny. Oto kilka sugestii, które jako projektant witryny Divi możesz zastosować w praktyce, próbując ręcznie utworzyć responsywne tabele.
Zmniejszając rozmiar tabeli, aby pomieścić mniejszy ekran, będziesz musiał skonstruować wiele klas CSS, z których każda będzie ukierunkowana na określoną rozdzielczość ekranu.
Alternatywnym rozwiązaniem, które możesz zastosować, jest ukrycie określonych kolumn w tabeli, gdy rozmiar ekranu jest mniejszy.
W przypadku mniejszych ekranów w nagłówkach i stopkach tabeli można przewijać w poziomie lub w pionie.
Utwórz pojedynczą tabelę, którą można skalować w celu dopasowania do wszystkich rozmiarów ekranu, i powiększ tabelę, aby materiał był bardziej czytelny.
Rozwiązania te wymagają znacznego wysiłku, a wymagania mogą się różnić w zależności od treści i wielkości ekranu.
Rozwiązanie 1: Tabele można tworzyć za pomocą Divi Builder.
Elegant Themes przygotował samouczek pokazujący, jak konstruować responsywne tabele przy użyciu wbudowanych funkcji Divi. Sprawdź to tutaj. Dodano możliwość przewijania w poziomie kolumn, które przepełniają kontener tabeli, dzięki czemu tabela lepiej reaguje na dane wprowadzane przez użytkownika. Możesz dowiedzieć się więcej, przechodząc na stronę samouczka:
Rozwiązanie 2: Skorzystaj z plugin tabel, które domyślnie zawierają tę funkcjonalność!
Stworzenie responsywnej tabeli dla Twojej witryny Divi nie jest już problemem, dzięki mnóstwu DARMOWYCH rozwiązań plugin dostępnych w repozytorium. Jednak znalezienie plugin do tabel, które mają wbudowane opcje responsywności mobilnej, jest trochę trudne. Popularne plugin takie jak wpDataTables, nie mają tej funkcji jako bezpłatnej opcji.
W tym artykule uważamy, że jest to jedna z najlepszych plugin WP Tabe Builder.
WP Table Manager
WP Table Manager to jedyna plugin do tabel WordPress, która zapewnia cały interfejs arkusza kalkulacyjnego do zarządzania tabelami. Utwórz tabelę, wybierz motyw i rozpocznij edycję tabel zaraz po ich utworzeniu. Skorzystasz z kompleksowego zestawu zaawansowanych funkcji edycji tabel, w tym edycji komórek HTML, kopiowania tabel, obliczeń i synchronizacji z Excelem, Arkuszami Google i Office 365; jest to tak proste, jak kliknięcie komórki i edycja danych z pomocą wizualnego edytora tekstu lub bez niego, aby użytkownik końcowy mógł modyfikować tabelę.
WP Table Manager pozwala projektować atrakcyjne, responsywne tabele za pomocą prostego interfejsu wizualnego. Korzystanie z niego jest bezpłatne. Po aktywacji zostaniesz przekierowany do przewodnika konfiguracji. Postępuj zgodnie z procedurami i dokonaj niezbędnych zmian według własnych upodobań. Jak za dotknięciem czarodziejskiej różdżki stworzyłeś piękny stół, który pięknie prezentuje się na każdym urządzeniu dowolnej wielkości. Następnie wystarczy skopiować krótki kod i wkleić go na stronie, na której ma się on pojawić. Konstruktor oferuje obecnie siedem elementów (tekst, obraz, lista, przycisk, ocena w gwiazdkach, niestandardowy kod HTML i krótki kod), które można przeciągać i upuszczać do obiektów zastępczych tabel za pomocą funkcji przeciągania i upuszczania. Można je wykorzystać do budowy różnego rodzaju tabel, takich jak tabele porównawcze produktów, tabele cenowe, tabele listowe itp.; to jest plugin Table, którą odkryliśmy podczas naszego dochodzenia jako najbardziej przyjazną dla nowicjuszy. Należy pamiętać, że aktualna wersja nie posiada pola wyszukiwania ani żadnego innego typu funkcji filtrowania. Dodatkowo, jeśli zamierzasz wprowadzać lub zarządzać wieloma zbiorami danych, może to nie być idealna opcja. W przypadku tego typu zastosowań, Visualizer lub Tablepress są doskonałym wyborem.
Interfejs WP Table Manager
Możesz dołączyć krótki kod do modułu kodu lub modułu tekstowego w Divi.
Motyw DIVI zawiera WP Table Manager .
plugin WP Table Manager odpowiada na zarządzanie szczegółami dotyczącymi obsługi tabel;
- Po włączeniu opcji filtrowania w tabeli możesz przeszukiwać dane w każdej kolumnie i filtrować całą tabelę. Działa również na ogromnych tabelach, łącznie z paginacją
- Strzałki w górę i w dół widoczne w każdej kolumnie porządkują dane w tabeli. Porządkowanie danych w tabelach działa również w przypadku dużych tabel, łącznie z paginacją.
- Po utworzeniu tabeli zawierającej wszystkie potrzebne dane możesz pozwolić użytkownikom na sortowanie, ale możesz także ustalić domyślną kolejność. Może to być bardzo przydatne, gdy informacje zmieniają się w czasie, ponieważ możesz sortować biegaczy po wyścigu według kolejności przybycia.
- Paginacja jest potrzebna, jeśli chcesz wyświetlić dużą tabelę na interfejsie swojej witryny, jednocześnie zachowując zasoby serwera. Wybierz zadaną liczbę wierszy tabeli na każdej stronie.
Istnieje również otwarty sposób zarządzania dokumentami Excela za pomocą importera plików Excel WP Table Manager . Można jednak importować i przekształcać dane programu Excel tylko jako edytowalną tabelę HTML lub importować plik Excel z jego stylem obejmującym kolory, tła, rozmiar kolumny i łącza.
Zarządzaj tabelą Excela i publikuj ją na swojej stronie WordPress! Możesz przesłać plik Excel do tabeli za pomocą zarządzania multimediami WordPress lub klienta FTP. Następnie wybierz plik Excel i rozpocznij synchronizację w ustawieniach tabeli.
Synchronizację między tabelą WordPress a plikiem Excel można przeprowadzać regularnie, od jednej minuty do jednego dnia. Można również zdefiniować automatyczne opóźnienie synchronizacji, aby uniknąć niechcianych aktualizacji publicznych tabel WordPress lub zaoszczędzić zasoby serwera dla ogromnej tabeli.
Po zaimportowaniu tabeli wszystkie dane mogą zostać zaktualizowane; to jest zwykła tabela HTML, którą można edytować jak plugin ! Arkusz kalkulacyjny WordPressa.
Z drugiej strony, po utworzeniu przejrzystej tabeli zawierającej wszystkie potrzebne dane, możesz wyeksportować ją jako konwencjonalny plik Excel i na amp ponownie uruchomić później zaktualizowany arkusz Excela. Twoi użytkownicy mogą teraz wyeksportować tabelę jako arkusz Excel w interfejsie WordPress.
WP Table Manager synchronizuje się również z Office 365 za pośrednictwem OneDrive.
Dostępne jest narzędzie do importowania i eksportowania plików OneDrive Excel; oszczędzaj czas, importując i modyfikując pliki na bieżąco. Bądź jeszcze bardziej produktywny dzięki synchronizacji plików OneDrive! Wybierz plik Excel Office 365, który chcesz zsynchronizować, dostosować automatycznie i udostępnić w Twojej witrynie.
WP Table Manager pomaga budować i importować tabele z bazy danych; zawiera teraz narzędzie do generowania tabel z wybranej zawartości bazy danych witryny internetowej, która wcześniej była niedostępna. Wybierane są tabele i kolumny z bazy danych, stosowane są konfigurowalne filtry, a tabelami zarządza się poprzez interfejs WP Table manager . Kiedy baza danych jest aktualizowana, Twoja tabela jest automatycznie zwiększana! Ponadto masz do dyspozycji opcje sortowania, filtrowania, automatycznego projektowania i paginacji.
Jeśli nie jesteś programistą, możesz wizualnie połączyć dowolny materiał bazy danych ze swoją tabelą HTML. Wszystkie tabele w Twojej bazie danych są prezentowane podczas generowania nowej tabeli z zawartości bazy danych.
Baza danych Twojej witryny może przeprowadzić proste wyszukiwanie i wybrać tabele i kolumny; jest to całkiem korzystne w przypadku ogromnej bazy danych. Ponadto dostępny jest kreator, który pomoże Ci krok po kroku z tabelą z bazy danych.
Na ostatnim etapie, przed podglądem tabeli z bazy danych, możesz napisać własne zapytanie na określonych tabelach bazy danych. Obsługujemy niektóre funkcje, takie jak WYBIERZ, ZAMIEŃ, ZMIEŃ NAZWĘ, POKAŻ, WYJAŚNIJ, OPISZ.
Tabela bazy danych czasami zawiera wiele wierszy; dlatego ta opcja może pomóc w wyświetleniu tabeli mieszczącej się na ekranie. Poza tym możesz ustawić predefiniowaną ilość wierszy tabeli na każdej stronie. Co więcej, możesz także wybrać kolumnę, aby domyślnie posortować całą tabelę.
Połączenie z tabelą bazy danych WordPress nie ogranicza się tylko do tabel WordPress. Można połączyć wszystkie tabele, które nie pochodzą z WordPressa, ale są zainstalowane w tej samej bazie danych.
Wśród ogromnej ilości danych na Twoim stole możesz utworzyć kilka niestandardowych reguł, aby skoncentrować się na konkretnym obiekcie. Jeśli jesteś z tym zaznajomiony, możesz pobawić się operatorami baz danych, takimi jak >, <, LIKE, IN…
Tabele z utworzonej bazy danych można edytować jak każdą inną tabelę (jeśli użytkownik ma dostęp do tej przydatnej funkcji); jest to całkiem wygodne, gdy można zbiorczo edytować niektóre dane z bazy danych, jak na amp kilka dat po publikacji, co zajęłoby trochę czasu, gdyby było robione pojedynczo.
Wniosek
Tabele to jeden z najskuteczniejszych sposobów prezentacji zestawu informacji. Jednak dla osoby mniej technicznej tworzenie tabel na stronie internetowej jest wyzwaniem. Korzystając z tych plugin , w kilku prostych krokach możesz z łatwością tworzyć tabele czytelne na dowolnym urządzeniu. Co więcej, responsywne tabele z pewnością zapewnią pozytywne ogólne doświadczenia osobom odwiedzającym Twoją witrynę. Spróbuj więc i daj nam znać, jakie są Twoje doświadczenia w sekcji komentarzy poniżej.
