TechBlogSD - Wszystko do WordPressa i tworzenia stron internetowych
Instrukcje WEB i WordPress, nowości, recenzje motywów i wtyczek

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

42

W naszym poprzednim artykule widzieliśmy, jak dodawać tabele w witrynie WordPress przy użyciu różnych metod. Edytor bloków Gutenberg ma wbudowany blok tabeli, dzięki czemu korzystanie z dodatkowej wtyczki jest przestarzałe. Jednak TablePress jest jedną z wtyczek umożliwiających użytkownikom łatwe dodawanie atrakcyjnych tabel na stronie WordPress. W tym artykule zapoznajmy się z funkcjami i sposobem korzystania z wtyczki TablePress.

Naucz się WordPressa: sprawdź ponad 400 bezpłatnych samouczków dotyczących WordPressa.

Dlaczego wtyczka TablePress?

Przejdź do opcji „Wtyczki > Dodaj nowy" w panelu administracyjnym WordPress i wyszukaj słowo kluczowe „Tabela”. Znajdziesz tysiące wtyczek do tworzenia różnych typów tabel, a wyszukiwanie „tablepress” pokaże wtyczkę TablePress na pierwszej stronie.

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Wtyczka WordPress TablePress

  • Jest to kompletna darmowa wtyczka autorstwa Tobiasa Bäthge. Chociaż rozszerzenia są oferowane jako osobne wtyczki premium, nie ma natrętnych banerów ani linków z prośbą o uaktualnienie z pulpitu nawigacyjnego.
  • Ponad 800 000 aktywnych instalacji z 5 gwiazdkami od prawie 4 000 użytkowników nie może być błędną oceną.
  • Przyzwoita dokumentacja i bardzo dobre wsparcie na forum.
  • Twórz jednolicie wyglądające tabele w witrynie, a także dostosuj wygląd dowolnej tabeli za pomocą niestandardowego kodu CSS.

Funkcje wtyczki TablePress

Wtyczka posiada następujące cechy, które wystarczają do tworzenia tabel dla większości ogólnych celów:

  • Tabele można tworzyć i osadzać na dowolnych stronach witryny jako skrócony kod.
  • Importuj tabele z Microsoft Excel w formatach XLS, XLSX i CSV. Możliwe jest również importowanie za pomocą ręcznego kopiowania i wklejania z formatu JSON/HTML.
  • Tabele można eksportować w formatach CSV, JSON i HTML.
  • Bezpośrednie wstawianie shortcode tabeli w edytorze wizualnym.
  • Poszczególne tabele można dostosować za pomocą niestandardowego CSS.
  • Z łatwością można tworzyć złożone tabele danych z polem wyszukiwania, stronicowaniem i filtrowaniem.

Jak korzystać z wtyczki TablePress?

Zainstaluj i aktywuj wtyczkę, aby zobaczyć menu administratora utworzone w sposób pokazany poniżej:

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Opcje menu wtyczki TablePress

Pozycję menu TablePress można modyfikować w sekcji „Opcje wtyczek”.

Wtyczka ma następujące sekcje:

  • Wszystkie tabele – pokazuje listę wszystkich utworzonych tabel.
  • Dodaj nowy – umożliwia utworzenie nowej tabeli.
  • Importuj – oferuje różne opcje importowania pojedynczych i wielu tabel.
  • Eksport – oferuje różne opcje eksportu jednej i wielu tabel.
  • Opcja wtyczki – poszczególne tabele można dostosować za pomocą CSS w tej sekcji.
  • Informacje – pokazuje szczegóły dotyczące wtyczki i inne szczegóły.

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Opcje wtyczki WordPress TablePress

Tworzenie tabeli w TablePress

Przejdź do zakładki „Dodaj nowy”, gdzie możesz wpisać podstawowe informacje, takie jak nazwa tabeli, krótki opis oraz wybrać liczbę kolumn i wierszy, aby utworzyć tabelę.

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Dodaj nową tabelę w TablePress

Następny ekran pokaże Ci wiele opcji w wielu sekcjach. Możesz łatwo zapoznać się z tymi opcjami, tworząc jedną lub dwie przykładowe tabele.

Oferta SEO: Zoptymalizuj swoją witrynę dzięki specjalnej 14-dniowej bezpłatnej wersji próbnej Semrush Pro.

Sekcja informacji o tabeli

Tutaj możesz wyświetlić podstawowe szczegóły wprowadzone na ekranie tworzenia wraz z krótkim kodem do tabeli.

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Sekcja informacji o tabeli

Zawartość tabeli

Tutaj musisz wprowadzić rzeczywistą zawartość swojej tabeli w wierszach i kolumnach; pierwszy wiersz jest domyślnie uważany za nagłówek tabeli, który można zmienić w sekcji "Opcje tabeli".

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Sekcja zawartości tabeli

Manipulacja tabelą

Ta sekcja oferuje następujące funkcje:

  • Dodaj wiersze i kolumny do swojej tabeli.
  • Ukrywaj, pokazuj, usuwaj, duplikuj i wstawiaj wiersze i kolumny.

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Sekcja Manipulacji Stołem

  • Kliknij przycisk „Wstaw link” i wybierz komórkę tabeli, aby otworzyć domyślne wyskakujące okienko linku do wstawiania WordPress. Możesz także bezpośrednio dodawać linki za pomocą znaczników kotwicy HTML.
  • Podobnie jak w przypadku linków, kliknij „Wstaw obraz” i kliknij komórkę, aby wstawić obrazy z biblioteki multimediów WordPress. Możesz także bezpośrednio dodawać obrazy za pomocą tagu HTML img.
  • Zaawansowany edytor umożliwia dodawanie sformatowanych treści za pomocą prostego edytora.

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Zaawansowany edytor TablePress

  • Użyj opcji rowspan i colspan, aby połączyć komórkę w wierszu i kolumnach.

Atrybuty Rowspan i Colspan nie mogą być używane w zaawansowanych tabelach danych przy użyciu biblioteki JavaScript do sortowania.

Opcje stołu

Tutaj możesz zdefiniować nagłówek, stopkę, różne kolory dla alternatywnych wierszy i podświetlić wiersz po najechaniu myszą. Możesz również wyświetlić nazwę i opis tabeli nad lub pod tabelą.

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Opcje stołu TablePress

Dodaj dodatkowe klasy CSS, aby dostosować wygląd tabeli, musisz użyć tych klas CSS na poziomie motywu i zdefiniować style.

Funkcje biblioteki DataTables JavaScript

Po włączeniu pierwszego wiersza tabeli jako nagłówka w sekcji „Opcje tabeli”, tabelę można przekonwertować na tabelę danych, włączając funkcje w tej sekcji.

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Tworzenie tabel danych za pomocą TablePress

  • Sortowanie na podstawie dowolnej kolumny po prostu klikając na kolumnę.
  • Wyszukiwanie / Filtrowanie – pozwala wyświetlić pole wyszukiwania w prawym górnym rogu tabeli, a użytkownicy mogą filtrować wyniki wpisując słowo kluczowe. Jest to bardzo przydatna funkcja, zwłaszcza gdy masz wiele wierszy, a treść nie jest widoczna z powodu paginacji.
  • Paginacja – włącz paginację, aby pokazać tylko określone wiersze z linkami „poprzedni / następny” w prawym dolnym rogu tabeli. Możesz także zezwolić użytkownikowi na filtrowanie i przeglądanie określonej liczby wierszy.
  • Włącz przewijanie w poziomie, jeśli masz wiele kolumn w tabeli, i dodaj polecenia niestandardowe, jeśli wiesz, jak korzystać z zaawansowanych tabel danych.

Po uzupełnieniu opcji przejrzyj podgląd tabeli i zapisz zmiany. Możesz także usunąć, skopiować i wyeksportować tabelę z tego samego ekranu.

Wstawianie tabeli do posta lub strony

Każda tabela w TablePress będzie miała unikalny identyfikator, który można zobaczyć w sekcji „Informacje o tabeli”. Możesz użyć tego jako shortcode w edytorze Gutenberg lub wstawić kod tabeli w edytorze Classic za pomocą ikony TablePress.

Przeglądanie wszystkich tabel

Wszystkie stoły utworzone za pomocą TablePress można zobaczyć w menu „TablePress > Wszystkie stoły”. Możesz wykonywać czynności, takie jak kopiowanie, eksportowanie i usuwanie, zarówno w poszczególnych tabelach, jak i zbiorczo.

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Opcje w zakładce Wszystkie tabele

Importowanie tabel

Chociaż tworzenie stołu jest łatwe na ekranie, przy dużych stołach będzie to żmudne zadanie. W takich sytuacjach możesz tworzyć tabele za pomocą arkusza kalkulacyjnego Excel w formacie XLS, XLSX lub CSV i importować je na swoją witrynę WordPress w zakładce „Importuj” wtyczki TablePress. Przejdź do zakładki „Importuj”, aby zobaczyć poniższe opcje:

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Importuj opcje tabeli w TablePress

  • Źródło importu może pochodzić z pliku na komputerze lokalnym, z adresu URL, z pliku na serwerze lub z ręcznego wprowadzania danych.
  • W zależności od źródła prześlij plik z komputera lokalnego lub podaj wymagane szczegóły.
  • Wybierz format pliku, jeśli używasz XLSX, a następnie wybierz opcję „XLSX –” z menu rozwijanego. Chociaż XLSX jest nadal opcją beta, działa idealnie, jak testowaliśmy.
  • Wybierz, czy chcesz utworzyć nową tabelę, czy zmodyfikować lub dołączyć istniejącą tabelę. Wybranie opcji zamiany i dołączenia spowoduje wyświetlenie listy rozwijanej wszystkich istniejących tabel, z której można wybrać tabelę.
  • Kliknij przycisk „Importuj” i rozpocznij importowanie tabeli.

Wtyczka umożliwia importowanie wielu tabel w postaci pliku zip. Na przykład, jeśli masz pięć tabel arkusza kalkulacyjnego XLSX, umieść wszystkie pliki w jednym folderze i skompresuj je w formacie zip. Wystarczy przesłać plik zip, aby utworzyć pięć tabel.

Eksportowanie tabel

Podobnie jak w przypadku importu, wszystkie istniejące tabele można wyeksportować do formatu CSV, JSON lub HTML na komputer lokalny. Wtyczka umożliwia również wybór wielu tabel i eksportowanie jako plik zip.

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Eksportowanie tabel w TablePress

Formaty CSV i HTML eksportują tylko zawartość tabeli, a format JSON zawiera również opcje tabeli.

Dostosowywanie tabel w TablePress

Do tej pory widzieliśmy opcje domyślne, a w zakładce "Opcje wtyczek" możesz wprowadzić niestandardowy CSS, aby kontrolować wszystkie tabele w sposób jednolity lub kontrolować wyświetlanie poszczególnych tabel.

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Dodawanie niestandardowego CSS w TablePress

Poniżej znajdują się selektory do zdefiniowania Twojego stylu:

  • .tablepress – wszystkie tabele TablePress powinny mieć tę klasę.
  • .tablepress-id – służy do stylizowania określonej tabeli.
  • .column-id – służy do stylizacji kolumny tabeli.
  • .row-id – służy do stylizacji wiersza tabeli.

Poniżej znajduje się przykładowa tabela utworzona za pomocą TablePress, załóżmy, że id wynosi 3, a niektóre style dostosowywania są podane na podstawie tego przykładu:

Poniższy kod CSS należy dodać w obszarze tekstowym w obszarze „Opcje wtyczek > Niestandardowy CSS” i upewnić się, że zaznaczono opcję „Załaduj te polecenia „Niestandardowe CSS”, aby wpłynąć na styl tabeli”.

Zmień szerokość drugiej kolumny na 200px:

.tablepress-id-3 .column-2 { width: 200px; }

Zmień kolor tła wiersza 2 na czerwony:

.tablepress-id-3 .row-2 td { Background-color: red; }

Zmień kolor alternatywnych wierszy:

.tablepress-id-3 .odd td { background-color: red; } .tablepress-id-3 .even td { background-color: blue; }

Zmień kolor wiersza po najechaniu:

.tablepress-id-3 .row-hover tr:hover td { background-color lightgrey; }

Ogólne problemy

Istnieje kilka podstawowych problemów, które zauważyliśmy podczas korzystania z TablePress:

  • Responsywność tabel na urządzeniach mobilnych, które można rozwiązać instalując rozszerzenie wtyczki.
  • Wstawianie tabel w stopce lub pasku bocznym witryny – można temu zaradzić za pomocą tagów szablonów z „$query” jako ciągiem lub tablicą. Na przykład poniżej znajduje się przykład pobierania danych tabeli dla tabeli id=1:
<?php tablepress_print_table( array( 'id' => '1', 'use_datatables' => true, 'print_name' => false) ); ?>

Jeśli napotkasz inny konkretny problem w swojej witrynie, zapoznaj się z forum, aby sprawdzić, czy został on rozwiązany, i zapoznaj się z dokumentacją przed zgłoszeniem zapytania do pomocy technicznej. Zauważyliśmy, że większość problemów została rozwiązana w jednym z tych miejsc.

Uwaga: Wstawianie tagów HTML do komórek tabeli nie jest obsługiwane, chociaż możesz użyć tagu obrazu, tagu linku, użyć zaawansowanego edytora i rozszerzenia do dodawania linków.

Rozszerzenia do prasy stołowej

Chociaż podstawowe potrzeby można zaspokoić dzięki darmowej wersji wtyczki, możesz pobrać dodatkowe rozszerzenia ze strony TablePress Extensions, aby ulepszyć funkcje tabel. Ponownie w ramach wkładu do społeczności autor oferuje wszystkie rozszerzenia za darmo i kilka nazwisk jako premium z prośbą o darowiznę. Spośród wszystkich rozszerzeń stwierdziliśmy, że „ Responsywne tabele ” to te, których możesz potrzebować, aby tabela była widoczna na urządzeniach mobilnych. Każde rozszerzenie można pobrać i zainstalować, przesyłając plik zip za pośrednictwem pulpitu administratora WordPress w sekcji „Wtyczki> Dodaj nowy> Prześlij wtyczkę”. Możesz także użyć FTP, aby przesłać wyodrębniony folder wtyczek w „/wp-content/plugins/”.

Poniżej znajduje się przykładowa tabela stworzona w stylu flip za pomocą rozszerzenia tabel responsywnych.

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Responsywny stół obrotowy

SEO dla prasy stołowej

Najważniejszym aspektem tworzenia tabel za pomocą wtyczki TablePress jest SEO – tabele są bardziej przyjazne dla wyszukiwarek, zwłaszcza w Google. Poniżej znajduje się przykład wyniku wyszukiwania Google przedstawiającego zawartość tabeli w bardziej atrakcyjny sposób z łączną liczbą elementów:

Samouczek dotyczący wtyczki TablePress dla użytkowników WordPress

Tabela TablePress w wynikach wyszukiwania Google

Google pokazuje wynik z tabelą, jeśli Twoja strona uzyskuje wystarczający ruch dla słów kluczowych w treści tabeli. Chociaż metaopis strony nie jest wyświetlany, zauważyliśmy, że widok tabeli przyciąga więcej użytkowników niż zwykły tekst.

Streszczenie

TablePress to darmowa wtyczka WordPress do tworzenia tabel dla Twojej witryny. Możesz wstawić tabele w dowolnym miejscu na stronie za pomocą shortcode. Możliwe jest, aby tabele były responsywne dzięki dodatkom.

Plusy

  • Darmowe i regularne aktualizacje
  • Prosty interfejs użytkownika
  • Zaawansowane tabele danych
  • Responsywne na telefonach komórkowych

Cons

  • Przesyłanie tabeli wymaga dużej ilości zasobów
  • Brak optymalizacji wydajności do ładowania CSS / JS tylko na stronach z tabelami
  • Brak szablonów

Źródło nagrywania: www.webnots.com
Leave A Reply

Ta strona korzysta z plików cookie, aby poprawić Twoje wrażenia. Zakładamy, że nie masz nic przeciwko, ale możesz zrezygnować, jeśli chcesz. Akceptuję Więcej szczegółów