Jeden z naszych czytelników zapytał nas ostatnio, jak podzielić wpisy na karty, aby zaoszczędzić miejsce i ułatwić użytkownikom znalezienie tego, czego szukają.
W WPBeginner pomogliśmy wielu właścicielom witryn internetowych ulepszyć organizację treści za pomocą układów z kartami.
Dodanie treści na karcie pozwala upakować więcej informacji o twoich produktach i usługach na jednej stronie, poprawiając komfort użytkowania i utrzymując wszystkie szczegóły w jednym wygodnym miejscu. W rezultacie zmniejszysz bałagan na stronie i ułatwisz nawigację odwiedzającym.
W tym artykule pokażemy ci, jak dodać treść w kartach do twoich wpisów i stron WordPress, aby odwiedzający mogli łatwo znaleźć to, czego potrzebują.
Kiedy należy używać treści w kartach w WordPressie?
Korzystanie z kart pozwala dodać więcej szczegółów na małej przestrzeni lub podzielić duże fragmenty treści w celu lepszej organizacji i wygody użytkownika.
Załóżmy, że masz sklep internetowy. Możesz dodać karty dla opisów produktów, recenzji, specyfikacji technicznych i innych. Takie rozdzielenie pomaga dostarczyć wszystkie szczegóły twoim klientom w jednym miejscu i sprawia, że strona jest interaktywna.
Podobnie można zobaczyć treść w kartach na stronach wtyczek WordPress. org. Strona jest podzielona na różne sekcje za pomocą kart, takich jak szczegóły, recenzje, instalacja, pomoc techniczna i informacje o rozwoju.
Treść na kartach pomaga zatrzymać użytkowników na Twojej witrynie internetowej WordPress. Nie musisz odsyłać ludzi do innej strony, aby uzyskać wszystkie szczegóły dotyczące twoich produktów i usług.
To powiedziawszy, zobaczmy, jak można dodać treść w kartach do stron i wpisów WordPress.
Oto 2 metody, których użyjemy, aby to zrobić:
- Dodawanie treści na kartach za pomocą Landing Page Buildera
- Dodawanie treści w kartach za pomocą wtyczki WordPress
Metoda 1: Dodawanie treści na kartach za pomocą Landing Page Buildera
Najlepszym sposobem na dodanie treści na karcie w WordPressie jest użycie SeedProd. Jest to najlepszy kreator stron docelowych i witryn internetowych WordPress. SeedProd jest przyjazny dla początkujących i zawiera kreator typu „przeciągnij i upuść”, gotowe szablony i wiele opcji konfiguratora.
W tym poradniku użyjemy licencji SeedProd Pro, ponieważ zawiera ona zaawansowane bloki do dodawania treści w kartach. Istnieje również wersja SeedProd Lite, której można używać za darmo.
Najpierw musisz zainstalować i włączyć wtyczkę SeedProd. Jeśli potrzebujesz pomocy, zapoznaj się z naszym przewodnikiem na temat instalacji wtyczki WordPress.
Po włączaniu zostaniesz przekierowany do ekranu powitalnego SeedProd w twoim kokpicie WordPress. Następnie wpisz swój klucz licencyjny, który znajdziesz w obszarze konta SeedProd.
Następnie możesz przejść do SeedProd ” Landing Pages z twojego panelu administracyjnego WordPress.
Następnie wystarczy kliknąć przycisk „Utwórz nową stronę docelową”.
Z tego miejsca SeedProd pokaże ci wiele szablonów stron docelowych, z których możesz wybierać.
Wybierz szablon, którego chcesz użyć. Wystarczy najechać kursorem na szablon i kliknąć pomarańczową ikonkę zaznaczenia.
Otworzy się teraz wyskakujące okienko, w którym należy wpisz tytuł twojej strony w polu „Nazwa strony” oraz uproszczoną nazwę w polu „Adres URL strony”.
Następnie wystarczy kliknąć przycisk „Zapisz i rozpocznij edycję strony”.
Spowoduje to uruchomienie kreatora przeciągnij i upuść SeedProd. Możesz teraz dodawać różne bloki do twojego szablonu i edytować istniejące elementy.
Aby dodać treść w kartach, wystarczy przeciągnąć blok „Karty” w sekcji Zaawansowane i upuścić go na szablonie strony.
Następnie można dostosować blok kart w SeedProd.
Można na przykład kliknąć przycisk „Dodaj nowy utwórz”, aby dodać dowolną liczbę kart. Ponadto dostępne są opcje edycji wielkości liter, odstępów między tekstem i wyrównania treści w każdej karcie.
Następnie możesz kliknąć dowolną kartę, aby edytować ją dalej i dodać szczegóły.
Można na przykład zmienić tytuł każdej karty, dodać treść i zmienić ikonkę karty.
Poza tym, SeedProd zapewnia również zaawansowane opcje konfiguratora.
Wystarczy kliknąć kartę „Zaawansowane” w menu po twojej lewej stronie. Tutaj możesz zmienić układ kart, typografię, kolor, kolor tła, obramowanie i wiele więcej.
Po wprowadzeniu zmian w bloku kart i dostosowaniu własnej strony docelowej, nie zapomnij kliknąć zielonego przycisku „Zapisz” u góry.
Następnie możesz przejść do karty „Ustawienia strony”.
Następnie możesz kliknąć przełącznik „Status strony” i zmienić status z Wersja robocza na Opublikuj.
Możesz kliknąć przycisk „Zapisz”, aby zapisać twoje zmiany i zamknąć kreator stron.
Teraz wystarczy przejść na twoją witrynę internetową, aby zobaczyć treść w zakładkach na stronie WordPress w działaniu.
Metoda 2: Dodawanie treści w kartach za pomocą wtyczki WordPress
Jeśli nie chcesz korzystać z kreatora stron docelowych, możesz użyć dedykowanej wtyczki WordPress, aby dodać treść w postaci kart do twoich wpisów i stron.
Najpierw musisz zainstalować i włączyć wtyczkę Tabs Responsive. Aby uzyskać więcej informacji, zapoznaj się z naszym przewodnikiem na temat instalacji wtyczki WordPress.
Po włączaniu możesz przejść do Tabs Responsive ” Add New Tabs z kokpitu WordPress i zacząć od wpisz nazwę dla twojej karty.
Następnie możesz przewinąć w dół, aby dodać dowolną liczbę kart, klikając czerwony przycisk „Utwórz nowe karty”.
Ponadto każdą kartę można edytować indywidualnie, zmieniając jej tytuł, dodając opis, używając innej ikony karty i edytując lokalizację ikonki.
Poza tym, wtyczka oferuje również różne „Ustawienia kart” w menu po twojej prawej stronie.
Można na przykład wybrać, czy ma być wyświetlany tytuł karty, wybrać różne opcje dla tytułu i ikonki, zmienić położenie ikonki, wyświetlić obramowanie karty, wybrać kolor tekstu i wiele więcej.
Po wprowadzeniu zmian możesz teraz używać kart w dowolnym wpisie na blogu lub stronie za pomocą krótkiego kodu wygenerowanego przez wtyczkę.
Wystarczy kliknąć przycisk „Opublikuj”.
Następnie możesz dodać karty na dowolnej stronie lub wpisie za pomocą krótkiego kodu [TABS_R id=130]. Upewnij się tylko, że zastąpiłeś numer identyfikatora w krótkim kodzie numerem identyfikatora twojej karty.
Możesz łatwo znaleźć identyfikator karty i krótki kod, przechodząc do Tabs Responsive ” All tabs i kopiując kod w kolumnie Tabs Shortcode.
Następnie wystarczy utworzyć nowy wpis lub edytować istniejący.
Gdy jesteś w edytorze bloków Gutenberg, dodaj blok krótkiego kodu, aby wpisz krótki kod.
Następnie możesz wyświetlić podgląd twojego wpisu lub strony na blogu. Jeśli wszystko się zgadza, możesz kliknąć przycisk „Opublikuj” lub „Aktualizuj”, aby zapisać wpisy w twoim wpisie.
Teraz przejdź na twoją witrynę internetową, aby zobaczyć treść w zakładkach w działaniu.
Mamy nadzieję, że ten artykuł pomógł ci dowiedzieć się, jak dodać treść w kartach do wpisów i stron WordPress. Możesz również zapoznać się z naszym przewodnikiem po prostym WooCommerce i naszą ekspercką listą najlepszych wtyczek WordPress dla witryn internetowych dla firm.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Ahmed Abo Rwash
It’s excellent, professional, and valuable. Thank you
WPBeginner Support
You’re welcome!
Administrator
Alexander
Hi, I need to display posts as tabs, I need the post title to be the tab label and the post content to be the tab content, any recommendations on how to do it?
WPBeginner Support
For what it sounds like you’re wanting, you would want to go through some of the options from our guide below:
https://www.wpbeginner.com/wp-tutorials/how-to-display-recent-posts-in-wordpress
Administrator
msiddiqui
very simply explain u r no 1 in WordPress
WPBeginner Support
Glad you like our content
Administrator
navya
I am beginner in wp.Can anyone help me to solve my problem?
in my site there is part of ou story as like history,fo eg. if click on 2018 tab i wanto get the corresponding description about 2018.How to do this in wp.Thank you in advance
Dan Acton
I love this, Not the end of the world if this option is not available, just would like to be able to edit a current set of tabs using the same interface in which I created them. Is this possible instead of having to paste new content in between the shortcodes?
Andi Sutrisnya
How to stop playing video in tab when switching to another tab if i have video in every tab? Please help me
dany
thanks bro this helpful
Lena
Is it possible to have just a button on the users editor which automatically creates a new tab where he/she can write her content in?
I’m planning a Content sharing platform …
David
Hi,
I’m looking for vertical tabs that have the option of adding a link for each tab so that each tab has an address.
Can you suggest a tab plugin that has this option or a tutorial that explains how to add this functionality.
Thanks for any help
David
Soni
This is a helpful article.
I would like to know about the tabbed content in wpbeginner homepage. Could this plugin create the same tabbed content?
Or you use another plugin to create that tabbed content?
I think that tab is great.
Ssekito
Kindly show me how to post content under the different tabs i have put on my blog.
Thanks
WPBeginner Support
Your blog is hosted on WordPress.com. Please see our guide on the difference between self hosted WordPress.org vs free WordPress.com blog.
Administrator
Ssekito
Thanks for the reply!
I am actually a beginner of wordpress blog and i want to first get familiar with it so that i upgrade to wordpress.org with bluehost as my host.
I want to monetize my blog as i am into affiliate marketing! I currently want to add content just below each pages i created on the menu bar and some social share buttons though am finding it challenging!
Please guide me this.
Thanks.
Sase Antic
Helpful info on tabs in WordPress!
However, is there a solution in this plugin or any other WP plugin to add tabs at the whole site (site-wide) and not just in posts and pages?
For example: I need one „tabs group” consisted of 3 tabs, and I like to add it sitewide (the same content / tabs at all pages and posts; like menu / submenu but with tabs functionality).
Is this possible?
Otherwise, it’s a lot of work to add the same „tabs group” to all pages and posts one by one.
Thanks in advance for the reply!
uvie
what if i need the tab to display contents in the form of widgets.how can i achieve that
Tony
This looks like a great tabs plugin – but, it would be even greater if I can added also to Pages not just posts. I looked all over, but does not appear in editor of Pages – any chance of that?
Sameer
Hello,
Is it possible to create tables inside tabs in wordpress blog pages. Please see this page: , Please help me to create something like this one in wp.
WPBeginner Support
Yes, it is possible. You will need to generate the HTML code required for the table in the content area of each tab.
Administrator
Weiwei
if in the content , there are more pages, what should I do?
WPBeginner Staff
If you cannot figure out why you would need them, then this means that you don’t really need them on your website. We write about a lot of cool things that users can add to their websites. If users find something useful, then they can add it to their site.
Shah
I’m very new to building a website. I think being so far advanced, your assumption of how well someone like me can understand and follow your instructions, is highly exaggerated. I still don’t understand what tabs are for. I know you explained it, and even showed us where we can see them in action, but I still don’t understand why I need to have tabs. It would be great if you were more deliberate in giving us, slower people, more examples. Thanks!
Heather Lewis
This is a helpful article. I will use this plugin whenever it’s necessary. I think this is much better compared with the one I am using in terms of design. Thank you for sharing.
vinayak
hi and thanks for providing a post where i could add tabbed content in my blog.
i was looking for a plugin that could do this.
Amjaru
Is the content in the tabs searchable or does the short code prevent the content from being searched?
WPBeginner Staff
It will still be searchable.
Knitwit23
can you show us a post where this is in use?
KonaGirl
Will this plugin make a tabbed menu hierarchy? If it does, then do I remove the menu tabs prior to adding this plugin?
WPBeginner Staff
It is used inside posts and pages to display content in tabs.
Sally Bennett
It would be very useful if you explained what 'tabs’ are to a complete novice
WPBeginner Staff
Tabs are like tabs in a folder or a telephone index book. Allowing users to browse different sections by clicking on the tab title. You can see them in action here.