Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Puchar WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Jak wyświetlić Twoją oś czasu na Facebooku w WordPress?

Uwaga redakcyjna: Otrzymujemy prowizję z linków partnerskich na WPBeginner. Prowizje nie mają wpływu na opinie i oceny naszych redaktorów. Dowiedz się więcej o Proces redakcyjny.

Czy chcesz wyświetlać twoje wpisy na osi czasu Facebooka w WordPress?

Dodając swoje aktualizacje z Facebooka do WordPressa, możesz utrzymać swoją witrynę świeżą i interesującą, jednocześnie zachęcając odwiedzających do śledzenia Cię na Facebooku.

W tym artykule pokażemy, jak łatwo wyświetlić twoją oś czasu na Facebooku w WordPress.

How to display your Facebook timeline in WordPress

Dlaczego warto wyświetlać Twoją oś czasu na Facebooku w WordPress?

Według naszych statystyk badań marketingowych, Facebook jest najpopularniejszą platformą mediów społecznościowych na świecie, z 2,9 miliardami miesięcznie włączających się użytkowników. To sprawia, że Facebook jest idealnym miejscem na dotarcie do nowych odbiorców i zaangażowanie osób, które już wiedzą o Twojej witrynie internetowej.

Jednak ludzie nie zobaczą twoich wpisów na Facebooku, jeśli po prostu przejdą na twoją witrynę.

Mając to na uwadze, zalecamy osadzanie Twojej osi czasu na Facebooku w WordPressie, aby więcej osób mogło cieszyć się Twoimi treściami. Jeśli ludziom spodoba się to, co widzą, mogą nawet zacząć śledzić Cię na Facebooku.

Jeśli użyjesz odpowiedniej wtyczki, kanał mediów społecznościowych będzie aktualizował się automatycznie po wpisaniu nowych treści na Facebooku. To sprawia, że jest to łatwy sposób na utrzymanie Twojej witryny internetowej świeżej i interesującej, nawet dla stałych odwiedzających.

W związku z tym zobaczmy, jak wyświetlić twoją oś czasu na Facebooku w WordPress. Możesz skorzystać z poniższych odnośników, aby przejść przez kolejne kroki:

Krok 1: Instalacja i konfiguracja wtyczki Custom Facebook Feed

Najprostszym sposobem na osadzanie twojej osi czasu na Facebooku w WordPressie jest użycie wtyczki Smash Balloon Facebook Feed.

Ta wtyczka pozwala osadzać albumy z Facebooka, komentarze, recenzje, wpisy społeczności i wiele więcej na twojej witrynie.

An example Facebook timeline, created using Smash Balloon

Na potrzeby tego przewodnika użyjemy aplikacji Custom Facebook Feed Pro, ponieważ umożliwia ona wyświetlanie zdjęć i filmów z twojej osi czasu na Facebooku.

Tymczasem darmowa wersja pozwala jedynie na umieszczanie tekstów i odnośników w twoich wpisach na Facebooku.

Po włączaniu należy przejść do Facebook Feed ” Ustawienia i wpisz klucz licencyjny w polu „Klucz licencyjny”.

Adding a license key to Smash Balloon

Informacje te znajdziesz na swoim koncie w witrynie internetowej Smash Balloon.

Po wpisz klucz, kliknij przycisk „Włączanie”.

Krok 2: Podłącz twoją stronę lub grupę na Facebooku do WordPressa

Następnie musisz połączyć swoją witrynę WordPress ze stroną na Facebooku lub osią czasu grupy. Zamierzamy użyć strony na Facebooku, ale kroki będą w dużej mierze takie same dla grup na Facebooku.

Aby uzyskać bardziej szczegółowe informacje na temat grup, zapoznaj się z naszym kompletnym przewodnikiem na temat tego, jak osadzać kanał grupowy Facebooka w WordPress.

Aby połączyć twoją stronę lub grupę na Facebooku z WordPressem, przejdź do Facebook Feed ” All Feeds, a następnie kliknij „Add New”.

Displaying your Facebook timeline in WordPress

Smash Balloon pozwala tworzyć różne kanały, aby dodać kalendarz wydarzeń z Facebooka w WordPress, wyświetlać zdjęcia, osadzać oś czasu i nie tylko.

Ponieważ chcemy wyświetlić naszą oś czasu na Facebooku w WordPress, musisz kliknąć „Oś czasu”, a następnie kliknąć „Dalej”.

How to add a Facebook timeline to your WordPress website

Następnie możesz wybrać stronę lub grupę na Facebooku, którą chcesz dodać do swojej witryny.

Wystarczy kliknąć „Utwórz nowy”, aby rozpocząć.

Adding a Facebook group or page timeline to WordPress

Na następnym ekranie wybierz, czy chcesz osadzać oś czasu ze strony czy grupy.

Po podjęciu tej decyzji, kliknij „Połącz z Facebookiem”.

Connecting a Facebook page or group to WordPress

Spowoduje to otwarcie wyskakującego okienka, w którym możesz logować się na swoje konto na Facebooku i wybierać strony lub grupy, z których chcesz korzystać.

Następnie kliknij „Dalej”.

Embedding a Facebook page or group in WordPress

Gdy to zrobisz, Facebook pokaże wszystkie informacje, do których Smash Balloon będzie miał dostęp i działania, które może wykonać na twojej stronie lub grupie na Facebooku.

Aby ograniczyć dostęp Smash Balloon do twojego konta na Facebooku, po prostu kliknij dowolny przełącznik, aby zmienić go z „Tak” na „Nie”. Pamiętaj tylko, że może to ograniczyć treści z Facebooka, które pojawiają się na twoim blogu lub witrynie internetowej WordPress.

Mając to na uwadze, należy pozostawić wszystkie przełączniki włączone, gdy tylko jest to możliwe.

Giving Smash Balloon permission to access your Facebook page or group

Następnie kliknij przycisk „Gotowe”.

Po kilku chwilach powinieneś zobaczyć komunikat potwierdzający, że twój witryna internetowa WordPress została odnośnikiem do Facebooka. Teraz nadszedł czas, aby kliknąć „OK”.

Linking WordPress and Facebook

Smash Balloon automatycznie przeniesie cię z powrotem do kokpitu WordPress.

W tym momencie zobaczysz wyskakujące okienko z grupą lub stroną, którą właśnie połączyłeś z WordPressem.

Wystarczy wybrać przycisk opcji obok tego źródła, a następnie kliknąć przycisk „Dodaj”.

Adding a Facebook page timeline to WordPress

Jeśli przypadkowo zamknąłeś wyskakujące okienko, nie martw się. Wystarczy odświeżyć kartę, aby ponownie otworzyć wyskakujące okienko.

Teraz wybierz twoją stronę lub grupę na Facebooku i kliknij „Dalej”.

Choosing a Facebook page or group as your timeline source

Na tym etapie możesz wybrać motyw dla twojej osi czasu na kanale Facebook. Wszystkie te motywy są w pełni konfigurowalne, więc możesz dostosować projekt w zależności od tego, jak chcesz wyświetlać oś czasu na swojej witrynie internetowej WordPress.

Jeśli nie jesteś pewien, którego użyć, możesz po prostu wybrać „Domyślny” i zmienić go później w następnym kroku.

Choosing a Facebook Feed theme

Teraz możesz wybrać szablon, który posłuży jako punkt wyjścia dla twojej osadzanej osi czasu.

Używamy szablonu domyślnego, ale możesz wybrać dowolny szablon. Ponownie, możesz również zmienić szablon później, jeśli nie będziesz z niego zadowolony.

Choosing a template for your embedded Facebook timeline

Gdy będziesz gotowy, kliknij przycisk „Dalej”.

Krok 3: Dostosuj swój osadzany Facebook Feed.

Wtyczka Smash Balloon Custom Facebook Feed daje wiele sposobów na dostosowanie wyglądu osi czasu na twojej witrynie. Mając to na uwadze, zobaczmy różne zmiany, które możesz wprowadzić na swojej osi czasu na Facebooku.

Na stronie Facebook Feed ” All Feeds znajdź swój kanał na osi czasu, a następnie kliknij przycisk „Edytuj”, który wygląda jak mały ołówek.

Editing the Smash Balloon Facebook feed

Spowoduje to otwarcie edytora Smash Balloon Facebook Feed, który wyświetla podgląd osi czasu grupy lub strony na Facebooku po prawej stronie.

Po lewej stronie znajdują się wszystkie ustawienia, których można użyć do zmiany wyglądu osi czasu. Większość z tych ustawień nie wymaga wyjaśnień, ale szybko omówimy każdy obszar.

Customizing the Facebook timeline feed

Jeśli nie jesteś zadowolony z wyglądu kanału, możesz wypróbować inny szablon, klikając opcję menu „Szablon”.

Następnie wybierz przycisk „Zmień”.

The Smash Balloon social media templates

Następnie możesz zmienić sposób wyświetlania twoich wpisów, klikając „Układ kanału”.

Na tym ekranie można przełączać się między układami listy i muru. Podczas wprowadzania zmian podgląd będzie aktualizowany automatycznie, dzięki czemu możesz wypróbować różne układy, aby zobaczyć, który wygląda najlepiej dla twojej osi czasu na Facebooku.

Changing the layout for your Facebook social media feed

Można również zmienić wysokość kanału i liczbę wpisów wyświetlanych przez Smash Balloon na komputerach stacjonarnych, smartfonach i tabletach.

Jeśli zmienisz liczbę wpisów, możesz podglądać, jak twój kanał będzie wyglądał na komputerach stacjonarnych i urządzeniach mobilnych, korzystając z rzędu przycisków w prawym górnym rogu.

Testing your social media feed on mobile

Podczas testowania mobilnej wersji twojej witryny internetowej WordPress możesz również zmienić liczbę kolumn wyświetlanych przez Smash Balloon na komputerach stacjonarnych, tabletach i smartfonach.

Na przykład na poniższym obrazku dzielimy treść na 4 kolumny na komputerach stacjonarnych, 3 kolumny na tabletach i 2 kolumny na urządzeniach mobilnych.

Dzięki temu twoja oś czasu może wygodnie zmieścić się na ekranie, niezależnie od rodzaju urządzenia, z którego korzysta odwiedzający.

Changing the number of columns on smartphones and tablets

Gdy będziesz zadowolony z układu, kliknij odnośnik „Dostosuj”.

Spowoduje to powrót do głównego edytora Smash Balloon, dzięki czemu można przejść do następnej opcji menu, którą jest „Schemat kolorów”.

Changing the color scheme of your social media feed

Domyślnie twoja oś czasu będzie używać tych samych kolorów, co twój motyw WordPress, ale ten ekran pozwala również przełączać się między układami „Jasny” i „Ciemny”.

Możesz nawet stworzyć własny schemat kolorów, wybierając opcję „Dostosuj”, a następnie korzystając z ustawień, aby zmienić kolor odnośnika, kolor tła, kolor tekstu w WordPressie i inne.

Changing the colors of your embedded Facebook timeline

Domyślnie Smash Balloon dodaje nagłówek do twojego feedu, który jest twoim zdjęciem na okładkę, zdjęciem profilowym i nazwą twojej strony na Facebooku.

Aby zmienić wygląd tej sekcji, kliknij „Nagłówek” w menu po lewej stronie.

Adding a cover photo and header to an embedded Facebook timeline

Na tym ekranie można zmienić kolor tła, rozmiar nagłówka, ukryć lub pokazać twoje zdjęcie profilowe na Facebooku i nie tylko.

Można również przełączać się między domyślnym nagłówkiem „Wizualnym” a nagłówkiem „Tekstowym”.

Adding a header to the Facebook timeline

Chcesz całkowicie usuwać nagłówek? Wystarczy kliknąć przełącznik „Włącz”, aby go wyłączyć.

Następnie można zmienić wygląd poszczególnych wpisów na osi czasu, wybierając opcję „Styl wpisu” z menu po lewej stronie.

How to add a Facebook timeline to your WordPress website

W zależności od twojego szablonu, możesz mieć do wyboru różne układy.

Można wybrać układ miniaturki, połowy szerokości lub pełnej szerokości.

The post style layout settings

Układ miniaturek pokazuje twoje wpisy na Facebooku z małymi obrazkami.

Przykład tego można zobaczyć na poniższym obrazku.

A post with a thumbnail layout

Czy zamiast tego chcesz wyświetlać większe obrazki?

Następnie możesz wybrać pół szerokości jako twój układ wpisów.

A Facebook post with a half width layout

Wreszcie, jeśli chcesz wyświetlać swój kanał na Facebooku z największymi możliwymi obrazkami, możesz wybrać układ o pełnej szerokości.

Oto przykład tego, jak będzie to wyglądać na twojej witrynie internetowej WordPress:

A Facebook post with a full width layout

Gdy jesteś zadowolony z ogólnego układu, nadszedł czas na dopracowanie konkretnych treści w każdym wpisie.

Aby rozpocząć, kliknij „Styl wpisu”.

Styling the individual posts inside an embedded Facebook feed

Na tym ekranie można wybrać układ zwykły lub pudełkowy.

Jeśli wybierzesz opcję „Boxed”, możesz utworzyć kolorowe tło dla każdego wpisu. Może to pomóc twoim wpisom na Facebooku odróżnić się od reszty witryny internetowej, a także sprawić, że tekst będzie łatwiejszy do odczytania.

Using the boxed post style in your Facebook feed

Można również zwiększyć promień obramowania, aby utworzyć zakrzywione rogi lub dodać cień ramki, aby wyróżnić treść.

Jeśli wybierzesz opcję „Regularny”, możesz zmienić grubość i kolor linii oddzielającej poszczególne wpisy w mediach społecznościowych.

Smash Balloon's regular post style

Możesz również dostosować poszczególne części każdego wpisu, wracając do głównego ekranu ustawień.

Ponownie wybierz „Styl wpisu”, ale tym razem wybierz „Edytuj poszczególne elementy”.

Na tym ekranie zobaczysz wszystkie różne treści, które Smash Balloon dołącza do każdego wpisu na osi czasu, takie jak autor wpisu, tytuł wydarzenia, pole udostępnionego odnośnika i inne.

Aby usunąć treść z twoich wpisów, wystarczy kliknąć, aby odznaczyć jej pole.

How to edit individual elements inside a Facebook feed

Możesz także zmienić rozmiar i kolor tych poszczególnych elementów. Wystarczy kliknąć nazwę elementu, taką jak „Autor wpisu” lub „Tekst wpisu”.

Następnie można użyć ustawień, aby dostosować tę treść. Można na przykład zmienić wielkość litery lub utworzyć nowy kolor.

The Smash Balloon post editor settings

Domyślnie Smash Balloon nie dodaje przycisku „Lubię to” na Facebooku do twojego kanału. Aby zwiększyć liczbę twoich obserwujących na Facebooku, możesz dodać ten przycisk, wybierając „Like Box” z menu po lewej stronie edytora.

Następnie wystarczy kliknąć przycisk „Włącz”, aby zmienił kolor na niebieski.

Adding a Facebook Like button to your WordPress website

Domyślnie Smash Balloon dodaje ten przycisk poniżej osi czasu, ale można to zmienić, otwierając menu rozwijane „Pozycja” i wybierając zamiast tego „Góra”.

Na tym ekranie można również zmienić wygląd sekcji „Lubię to”, w tym dodać własne wezwanie do działania i dodać zdjęcie na okładkę strony.

Duża liczba obserwujących to świetny dowód społeczny, który zachęci więcej osób do dołączenia do twojej grupy na Facebooku. Mając to na uwadze, warto kliknąć, aby włączyć przełącznik „Pokaż fanów”.

Customizing the Facebook like button

Gdy jesteś zadowolony z wyglądu przycisku „Lubię to”, możesz przejść do ustawień przycisku „Wczytuj więcej”.

Przycisk „Wczytywanie więcej” daje odwiedzającym łatwy sposób na przewijanie większej ilości twojej osi czasu na Facebooku, więc Smash Balloon domyślnie dodaje go do kanału.

To dobry początek, ale ponieważ jest to tak ważny przycisk, warto pomóc mu się wyróżnić, zmieniając jego kolor tła, stan najechania kursorem i etykietę.

Można również zmienić tekst wyświetlany na przycisku, wpisując go w polu „Tekst”.

Customizing the Load More button in WordPress

Jeśli wolisz usuwać przycisk Wczytywanie więcej, kliknij przełącznik „Włącz”.

Domyślnie Smash Balloon pozwala odwiedzającym przeglądać zdjęcia i filmy na Twojej osi czasu bez opuszczania witryny internetowej.

Odwiedzający może po prostu kliknąć dowolne zdjęcie lub film, aby otworzyć wyskakujące okienko (okno) lightbox, jak widać na poniższym obrazku.

Smash Balloon's lightbox feature

Odwiedzający może następnie za pomocą strzałek przewijać wszystkie zdjęcia i filmy na twojej osi czasu na Facebooku.

Jeśli chcą polubić zdjęcie, zostawić komentarz lub udostępnić obrazek znajomym na Facebooku, mogą kliknąć odnośnik „Skomentuj na Facebooku”.

Visiting a post in your embedded Facebook timeline

Spowoduje to otwarcie nowej karty i przeniesienie odwiedzającego bezpośrednio do wpisu na Twojej stronie na Facebooku.

Istnieje kilka różnych sposobów na dostosowanie funkcji lightbox Smash Balloon. Aby zobaczyć twoje opcje, kliknij „Lightbox” (okno) w menu po lewej stronie.

Customizing Smash Balloon's lightbox feature

Tutaj można zmienić kolor tekstu (okna) lightbox, odnośników i tła.

Domyślnie (okno) lightbox pokazuje wszystkie komentarze, które ludzie zostawili na twoich zdjęciach i filmach. Jeśli wolisz ukryć te komentarze, możesz kliknąć przełącznik „Pokaż komentarze”, aby zmienić kolor z niebieskiego (włączony) na szary (wyłączony).

Disabling social media comments on your WordPress website

Funkcja lightbox pozwala użytkownikom przewijać twoje zdjęcia i filmy bezpośrednio na witrynie internetowej WordPress.

Może się jednak zdarzyć, że wolisz zachęcić ludzi, by zamiast tego przeszli na twoją stronę na Facebooku. W takim przypadku można wyłączyć funkcję lightbox, klikając przełącznik „Włącz”.

How to disable the Smash Balloon lightbox feature

Teraz odwiedzający będzie musiał kliknąć odnośnik „Zobacz na Facebooku”, aby przyjrzeć się bliżej dowolnemu zdjęciu lub filmowi.

Kiedy będziesz zadowolony z wyglądu osi czasu na Facebooku, nie zapomnij kliknąć „Zapisz”, aby zapisać twoje zmiany.

Saving your custom social media timeline

Krok 4: Osadzanie twojej osi czasu na Facebooku w WordPressie

Teraz możesz dodać oś czasu do swojej witryny internetowej za pomocą bloku, widżetu lub krótkiego kodu. Aby to zrobić, wystarczy kliknąć przycisk „Osadzanie” u góry strony edytora kanałów Facebooka.

Następnie zobaczysz trzy opcje dodania twojej osi czasu na Facebooku: za pomocą krótkiego kodu, dodając ją do strony lub dodając ją jako widżet.

The Smash Balloon Facebook Embed options

Jeśli chcesz wyświetlić oś czasu Facebooka na stronie, kliknij przycisk „Dodaj do strony”.

Następnie wybierz stronę, na której chcesz wyświetlać oś czasu Facebooka. Następnie kliknij „Dodaj”.

Selecting a page to display the Smash Balloon Facebook Timeline in

Zostaniesz przekierowany do edytora bloków dla tej strony.

Kliknij przycisk „+ Dodaj blok” w dowolnym miejscu na stronie i wybierz blok „Facebook Feed”.

Adding the Smash Balloon Facebook Feed block in the Gutenberg editor

Następnie wystarczy wybrać utworzoną wcześniej oś czasu na Facebooku z menu rozwijanego.

Po zakończeniu kliknij przycisk „Aktualizuj”, aby wprowadzić zmiany.

Selecting a Facebook Feed to a page in the WordPress block editor

Jeśli chcesz wyświetlić oś czasu Facebooka w obszarze widżetu, takim jak panel boczny, kliknij opcję „Dodaj do widżetu” w wyskakującym okienku osadzania Feeda.

Następnie zostaniesz przekierowany do edytora widżetów WordPress. Tutaj wystarczy kliknąć przycisk „+ Dodaj widżet” w wybranym obszarze widżetów i wybrać widżet „Facebook Feed”.

Adding the Smash Balloon Facebook Feed in the WordPress widget editor

Po zakończeniu wybierz utworzoną wcześniej oś czasu na Facebooku z menu rozwijanego.

Możesz teraz sprawić, by widżet stał się aktywny, klikając przycisk „Aktualizuj”. Aby uzyskać więcej informacji, zapoznaj się z naszym przewodnikiem krok po kroku na temat dodawania i korzystania z widżetów w WordPress.

Selecting a Facebook Feed to display in the page using the WordPress widget editor

Jeśli te dwie metody nie działają, możesz osadzać oś czasu Facebooka za pomocą metody krótkiego kodu. Aby uzyskać szczegółowy opis, zapoznaj się z naszym przewodnikiem na temat dodawania krótkiego kodu w WordPress.

Dodatkowo, jeśli korzystasz z motywu blokowego, możesz użyć Full-Site Editor, aby dodać „Custom Facebook Feed” w dowolnym miejscu na twoim motywie.

Możesz przeczytać nasz kompletny przewodnik dla początkujących na temat pełnej edycji witryny WordPress, aby uzyskać więcej informacji.

Mamy nadzieję, że ten artykuł pomógł ci dowiedzieć się, jak wyświetlić twoją oś czasu na Facebooku w WordPress. Możesz również zapoznać się z naszym przewodnikiem na temat tworzenia formularzy kontaktowych w WordPress lub zobaczyć nasze wybory ekspertów dotyczące najlepszych wtyczek Instagram WordPress .

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.

Ujawnienie: Nasze treści są wspierane przez czytelników. Oznacza to, że jeśli klikniesz na niektóre z naszych linków, możemy otrzymać prowizję. Zobacz jak WPBeginner jest finansowany, dlaczego to ma znaczenie i jak możesz nas wspierać. Oto nasz proces redakcyjny.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Najlepszy zestaw narzędzi WordPress

Uzyskaj BEZPŁATNY dostęp do naszego zestawu narzędzi - zbiór produktów i zasobów związanych z WordPressem, które każdy profesjonalista powinien mieć!

Reader Interactions

11 komentarzyZostaw odpowiedź

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Nabeel says

    This is really awesome plugin to add Facebook feed at WordPress website in footer area or in widget area to show your Facebook feeds and activities at your WordPress website. thanks to developer.

Zostaw odpowiedź

Dziękujemy za pozostawienie komentarza. Pamiętaj, że wszystkie komentarze są moderowane zgodnie z naszymi polityka komentarzy, a Twój adres e-mail NIE zostanie opublikowany. NIE używaj słów kluczowych w polu nazwy. Przeprowadźmy osobistą i konstruktywną rozmowę.