Czy chcesz wyświetlać swoje zdjęcia z Instagrama na pasku bocznym WordPress?
Twoje posty z Instagrama tworzą świetną treść dla Twojej witryny. Tworząc kanał Instagrama, możesz utrzymać swoją witrynę świeżą i interesującą, a jednocześnie promować swoje konto na Instagramie.
W tym artykule pokażemy Ci, jak wyświetlać swoje zdjęcia i filmy z Instagrama w widżecie paska bocznego WordPress.
Dlaczego warto dodać Instagram Feed do swojej witryny WordPress?
Z ponad miliardem miesięcznych aktywnych użytkowników, Instagram jest doskonałym miejscem do promowania swoich produktów, usług i postów na blogu.
W zależności od Twojej branży, Instagram może być nawet najważniejszą częścią Twojej strategii mediów społecznościowych. Na przykład, Instagram jest szczególnie popularny wśród najlepszych blogów modowych, stron kulinarnych, lifestylowych i fotograficznych.
Jednak ludzie nie zobaczą twoich postów na Instagramie, jeśli odwiedzą tylko twoją stronę internetową. To może utrudnić wzrost liczby użytkowników Instagrama i uzyskanie zaangażowania na zdjęciach i filmach.
W związku z tym warto dodać kanał Instagram do swojej witryny WordPress. Pokazując swoje najnowsze posty, możesz promować swoje konto na Instagramie w angażujący i przyciągający uwagę sposób.
Pozwoli to uzyskać więcej ruchu na Twojej stronie Instagram i zachęci odwiedzających do interakcji z Twoimi postami, pozostawiając komentarze, klikając przycisk „Udostępnij” i inne.
Kanał będzie również aktualizowany automatycznie za każdym razem, gdy zrobisz nowy post na Instagramie, więc jest to świetny sposób na utrzymanie świeżości Twojej strony.
To powiedziawszy, spójrzmy, jak łatwo wyświetlić zdjęcia z Instagrama w widżecie paska bocznego WordPress.
Jak zainstalować wtyczkę do zdjęć z Instagrama
Najlepszym sposobem na wyświetlanie zdjęć z Instagrama w pasku bocznym WordPress lub podobnym widżecie jest użycie Smash Balloon Social Photo Feed. Ta darmowa wtyczka pozwala pokazać zdjęcia z jednego lub więcej kont Instagram w pełni konfigurowalny kanał.
Po utworzeniu kanału możesz dodać go do paska bocznego za pomocą shortcode lub bloku.
W tym przewodniku będziemy używać darmowej wersji Smash Balloon, ponieważ ma wszystko, czego potrzebujesz, aby osadzić kanał Instagram. Jednak istnieje również wersja Pro, która pozwala na wyświetlanie kanałów hashtagów, dodawanie obrazów Instagram shoppable w WordPressie i więcej.
Zanim zaczniesz, będziesz musiał połączyć swoje konto na Instagramie ze stroną na Facebooku. Jeśli masz osobiste konto na Instagramie, to możesz również chcieć przekształcić je w konto biznesowe, ponieważ dzięki temu Smash Balloon może automatycznie wyświetlać twoje Instagramowe bio i nagłówek.
Aby uzyskać instrukcje krok po kroku, jak zrobić obie te rzeczy, sprawdź naszą sekcję FAQ na końcu postu.
Kiedy jesteś gotowy, przejdź do instalacji i aktywacji wtyczki Smash Balloon Social Photo Feed. Aby uzyskać więcej szczegółów, zobacz nasz przewodnik po tym, jak zainstalować wtyczkę WordPress.
Jak połączyć konto na Instagramie z WordPressem
Po aktywacji wtyczki nadszedł czas, aby połączyć swoje konto Instagram z WordPressem. Wystarczy przejść do Instagram Feed ” Ustawienia, a następnie kliknąć „Dodaj nowy.
Dzięki Smash Balloon Pro możesz tworzyć kanały z oznaczonych postów i hashtagów, a nawet stworzyć ścianę społeczną z treścią z wielu różnych stron, w tym YouTube, Facebooka i Twittera.
Ponieważ używamy darmowej wersji, wystarczy wybrać „Oś czasu użytkownika”, a następnie kliknąć „Dalej”.
Następnie trzeba będzie wybrać konto na Instagramie, z którego będą pobierane zdjęcia.
Aby zacząć, kliknij na „Dodaj źródło.
Na następnym ekranie wybierz, czy chcesz wyświetlać zdjęcia z osobistego czy biznesowego konta Instagram.
Jeśli zaznaczysz pole obok 'Personal,’ to Smash Balloon domyślnie nie będzie zawierał awatara i bio z Instagrama w nagłówku. Zawsze jednak możesz dodać awatar i bio ręcznie w ustawieniach wtyczki.
Po wybraniu „Personal” lub „Business”, przejdź dalej i kliknij „Zaloguj się za pomocą Facebooka”.
Możesz teraz sprawdzić konto Instagram, którego chcesz użyć i kliknąć „Dalej”.
Po tym, zaznacz pole obok strony na Facebooku, która jest połączona z Twoim kontem na Instagramie.
Mając to zrobione, przejdź dalej i kliknij 'Dalej’.
Smash Balloon pokaże teraz popup wymieniający wszystkie informacje, do których będzie miał dostęp i działania, które może wykonać.
Aby ograniczyć dostęp Smash Balloon do swojego konta na Instagramie, kliknij dowolny z przełączników, aby zmienić go z „Tak” na „Nie”. Tylko pamiętaj, że może to wpłynąć na zdjęcia i filmy, które możesz osadzić na swoim blogu lub stronie internetowej WordPress.
Mając to na uwadze, zalecamy pozostawienie wszystkich przełączników włączonych.
Kiedy jesteś gotowy, kliknij na 'Gotowe’.
Teraz zobaczysz popup z kontem Instagram, które właśnie połączyłeś z WordPressem.
Wystarczy zaznaczyć pole obok konta, a następnie kliknąć 'Dodaj’.
Smash Balloon przeniesie Cię teraz z powrotem do Instagram Feeds ” All Feeds automatycznie.
Aby utworzyć kanał, po prostu zaznacz pole obok swojego konta na Instagramie. Następnie kliknij 'Dalej’.
Wtyczka utworzy teraz kanał fotograficzny Instagram dla Twojej witryny, a następnie otworzy ten kanał w edytorze Smash Balloon.
Jak dostosować swój kanał zdjęć z Instagrama
Możesz użyć edytora, aby dostroić, jak zdjęcia z Instagrama wyglądają w Twojej witrynie.
Po prawej stronie zobaczysz podgląd swojego Instagram photo feed. Po lewej stronie znajdują się wszystkie ustawienia, których możesz użyć, aby dostosować kanał zdjęć.
Większość z tych ustawień jest samoobjaśniająca, ale szybko pokryjemy kilka kluczowych obszarów.
Aby rozpocząć, możesz zmienić układ paszy i dodać padding, wybierając „Układ paszy” z menu po lewej stronie. W miarę wprowadzania zmian podgląd będzie aktualizowany automatycznie, więc możesz wypróbować różne ustawienia, aby zobaczyć, co najlepiej działa dla twojego kanału fotograficznego Instagram.
Domyślnie Smash Balloon pokazuje tę samą liczbę postów na komputerach stacjonarnych i urządzeniach mobilnych.
Możesz wyświetlić podgląd, jak kanał Instagram będzie wyglądał na komputerach stacjonarnych, tabletach i smartfonach, używając rzędu przycisków w prawym górnym rogu. Testując różne układy, możesz stworzyć kanał Instagram, który wygląda świetnie, niezależnie od tego, z jakiego urządzenia korzysta odwiedzający.
Smartfony i tablety mają zazwyczaj mniejsze ekrany i mniejszą moc obliczeniową, więc możesz chcieć pokazać mniej zdjęć i filmów na urządzeniach mobilnych.
Aby to zrobić, po prostu wpisz inną liczbę w polu „Mobile” pod „Liczba postów”.
Domyślnie feed na Facebooku pokazuje mniej kolumn na smartfonach i tabletach, w porównaniu do komputerów stacjonarnych. To pomaga Twoim zdjęciom i filmom wygodnie zmieścić się na mniejszych ekranach.
Po przetestowaniu mobilnej wersji Twojegor witryna WordPress, możesz być niezadowolony z tego, jak kolumny wyglądają na smartfonach i tabletach. Jeśli tak jest, to możesz pokazać mniej kolumn, zmieniając liczby w sekcji „Kolumny”.
Kiedy jesteś zadowolony z dokonanych zmian, kliknij na link „Dostosuj”.
To przeniesie Cię z powrotem do głównego edytora Smash Balloon, gdzie możesz odkryć kolejny ekran ustawień, którym jest 'Schemat kolorów’.
Domyślnie Smash Balloon używa schematu kolorów odziedziczonego po twoim motywie WordPress, ale ma również motywy „Light” i „Dark”, których możesz użyć.
Inną opcją jest stworzenie własnego schematu kolorów poprzez wybranie 'Niestandardowego’, a następnie użycie elementów sterujących do zmiany koloru tła, edycji koloru przycisku, zmiany koloru tekstu i innych.
Domyślnie Smash Balloon dodaje nagłówek do twojego kanału, który jest twoim zdjęciem profilowym Instagram i nazwą twojej strony. Aby zmienić wygląd tej sekcji, kliknij „Header” w lewym menu.
Na tym ekranie możesz zmienić rozmiar i kolor nagłówka, a także pokazać lub ukryć swoje Instagram bio.
Czasami możesz chcieć pokazać inne zdjęcie profilowe. Na przykład twój awatar z Instagrama może kolidować z twoim motywem WordPress.
Aby to zrobić, po prostu kliknij „Dodaj obraz” pod „Pokaż niestandardowy awatar.
Następnie możesz wybrać obraz z biblioteki mediów WordPress lub przesłać nowe zdjęcie z komputera.
Podobnie, możesz pokazać inne bio. Na przykład możesz chcieć przedstawić swój kanał Instagram lub zachęcić ludzi do śledzenia cię po więcej wspaniałych treści.
Aby zastąpić bio Instagrama, po prostu wpisz w polu „Dodaj niestandardowe bio”.
Smash Balloon automatycznie analizuje Twoje zdjęcia z Instagrama i wyświetla je w najlepszej rozdzielczości. Chociaż zalecamy używanie tych domyślnych ustawień, możliwe jest, aby obrazy były większe lub mniejsze.
Aby zmienić rozmiar obrazu, kliknij „Posty” z lewego menu. Następnie wybierz opcję 'Images and Videos’.
Możesz teraz wybrać między miniaturą, średnim i pełnym rozmiarem za pomocą rozwijanego menu.
Jeśli jesteś niezadowolony z wyników, to możesz wrócić do tego ekranu w dowolnym momencie i wybrać opcję „Auto-detect (Recommended)” z rozwijanego menu.
Domyślnie Smash Balloon dodaje przycisk „Załaduj więcej” na dole swojego kanału Instagram, który pozwala odwiedzającym przewijać więcej zdjęć i filmów.
Ponieważ jest to tak ważny przycisk, możesz chcieć go dostosować, wybierając opcję „Load More Button” z menu po lewej stronie.
Tutaj możesz pomóc 'Load More wyróżnić się, zmieniając jego kolor tła, kolor tekstu i stan hover.
Możesz również zmienić etykietę przycisku, wpisując ją w pole 'Tekst’.
Inną opcją jest całkowite usunięcie przycisku poprzez kliknięcie przełącznika „Włącz”. W ten sposób możesz zachęcić ludzi do odwiedzenia swojego Instagrama, ograniczając liczbę postów, które mogą zobaczyć na swojej stronie.
Jeśli odwiedzający lubią to, co widzą, mogą zdecydować się na śledzenie Cię na Instagramie za pomocą przycisku „Follow on Instagram”, który Smash Balloon dodaje automatycznie.
Mając to na uwadze, możesz pomóc przyciskowi wyróżnić się, wybierając „Follow Button” w lewym menu.
Tutaj możesz zmienić kolor tła przycisku, stan hover i tkolor ext.
Domyślnie przycisk ma ogólną etykietę „Follow on Instagram”.
Możesz zastąpić to własnym komunikatem, wpisując w pole „Tekst”.
Kiedy jesteś zadowolony z tego, jak wygląda kanał Instagram, nie zapomnij kliknąć „Zapisz”, aby zapisać swoje zmiany. Teraz jesteś gotowy, aby dodać kanał Instagram do swojego widgetu paska bocznego WordPress.
Jak dodać swoje zdjęcia z Instagrama w widżecie paska bocznego WordPressa
Możesz dodać swój kanał do paska bocznego lub podobnej sekcji za pomocą bloku Instagram Feed.
Jeśli stworzyłeś więcej niż jeden kanał za pomocą Smash Balloon, to musisz znać kod kanału.
Po prostu przejdź do Instagram ” All Feeds, a następnie skopiuj wartość w kolumnie „Shortcode”.
Na poniższym obrazku będziemy musieli użyć instagram-feed feed=1.
Mając to zrobione, przejdź do Wygląd ” Widżety w desce rozdzielczej WordPress.
Następnie kliknij niebieski przycisk „+”.
W pasku wyszukiwania wpisz „Instagram Feed” i wybierz odpowiedni widget, gdy się pojawi.
WordPress ma wbudowany widget Instagrama, więc upewnij się, że wybierzesz ten, który pokazuje oficjalne logo Instagrama.
Po tym, po prostu przeciągnij widget na obszar, w którym chcesz pokazać kanał Instagram, taki jak pasek boczny lub podobna sekcja.
Widżet automatycznie pokaże jeden z kanałów, które utworzyłeś za pomocą Smash Balloon.
Aby zamiast tego pokazać inny kanał, wystarczy wpisać shortcode kanału w polu „Ustawienia Shortcode”, a następnie kliknąć „Zastosuj zmiany.
Możesz teraz kliknąć przycisk „Aktualizuj”, aby widget był żywy. Aby uzyskać więcej informacji, zapoznaj się z naszym przewodnikiem krok po kroku, jak dodawać i używać widżetów w WordPress.
Jeśli używasz motywu z blokami, to możesz dodać kanał Instagram do paska bocznego za pomocą edytora pełnoekranowego. Aby rozpocząć, po prostu przejdź do Wygląd ” Edytor.
W edytorze wystarczy kliknąć, aby wybrać sekcję paska bocznego, a następnie kliknąć przycisk „+”.
Następnie możesz zacząć wpisywać „Instagram Feed” i wybrać odpowiedni blok, gdy się pojawi.
Domyślnie edytor pełnej strony pokaże jeden z kanałów Instagrama, które stworzyłeś za pomocą Smash Balloon. Aby pokazać inny kanał, po prostu dodaj shortcode, wykonując ten sam proces opisany powyżej.
Kiedy jesteś zadowolony z tego, jak wygląda kanał Instagram, kliknij „Zapisz”, aby Twoje zmiany były na żywo.
Jak wyświetlić określone zdjęcie z Instagrama w WordPressie
Czasami możesz chcieć pokazać konkretny post z Instagrama na swojej stronie. Może to być twoje najpopularniejsze zdjęcie, evergreen post, a nawet konkurs w mediach społecznościowych, który obecnie prowadzisz.
W przeszłości mogłeś łatwo osadzić post z Instagrama w WordPressie za pomocą protokołu znanego jako oEmbed. Jednak Facebook zmienił sposób działania oEmbed, więc nie można już łatwo osadzać zdjęć z Instagrama w WordPressie.
Dobrą wiadomością jest to, że Smash Balloon może naprawić problem Facebooka i Instagrama oEmbed. Dzięki temu możesz łatwo osadzić konkretny post z Instagrama w dowolnej stronie, poście lub obszarze gotowym na widget, takim jak pasek boczny.
Aby włączyć tę funkcję, po prostu przejdź do Instagram Feed ” oEmbeds. Następnie możesz kliknąć przycisk „Włącz”.
Po tym przejdź do Wygląd ” Widżety i kliknij niebieski przycisk „+”.
W pasku wyszukiwania wpisz. 'Embed’, aby znaleźć właściwy blok.
Kiedy pojawi się blok 'Embed’, przeciągnij go na obszar, w którym chcesz pokazać zdjęcie.
W polu 'Embed’ po prostu wklej adres URL postu z Instagrama, który chcesz pokazać na swojej stronie. Następnie kliknij na 'Embed’.
WordPress będzie teraz pokazywał konkretny post z Instagrama.
Jeśli jesteś zadowolony z tego, jak to wygląda, a następnie kliknij „Aktualizuj”, aby uczynić go żywym.
Teraz, jeśli odwiedzisz swoją stronę, zobaczysz post z Instagrama na żywo.
Jeśli używasz motywu z blokiem, wtedy będziesz musiał dodać konkretne posty z Instagrama za pomocą edytora pełnej strony.
Aby to zrobić, po prostu włącz funkcję Smash Balloon’s oEmbed i uzyskaj adres URL postu Instagrama, wykonując ten sam proces opisany powyżej.
Po tym, otwórz edytor pełnowymiarowy, przechodząc do Wygląd ” Edytor w pulpicie nawigacyjnym WordPress. Gdy jesteś wewnątrz edytora pełnej strony, kliknij przycisk „+” w sekcji paska bocznego, a następnie wpisz „Embed.
Kiedy pojawi się odpowiedni blok, kliknij, aby dodać go do paska bocznego.
Następnie możesz dodać adres URL do postu, który chcesz osadzić i kliknąć przycisk 'Embed’.
Edytor pełnej strony będzie teraz pokazywał post z Instagrama.
Jeśli jesteś zadowolony z tego, jak to wygląda, a następnie kliknij „Zapisz”, aby opublikować to zdjęcie lub wideo na pasku bocznym z blokadą.
FAQ dotyczące wyświetlania postów z Instagrama w WordPressie
Smash Balloon ułatwia tworzenie niestandardowego kanału Instagram lub nawet wyświetlanie określonych postów z Instagrama w witrynie WordPress.
To powiedziawszy, oto niektóre z najczęściej zadawanych pytań dotyczących wyświetlania postów z Instagrama w witrynie WordPress.
Jak utworzyć konto biznesowe na Instagramie?
Smash Balloon może wyświetlać zdjęcia z osobistego lub biznesowego konta Instagram.
Jednak Smash Balloon nie może automatycznie pobrać awatara i bio Instagrama z osobistego konta Instagram. Zamiast tego będziesz musiał dodać awatar i bio ręcznie w ustawieniach wtyczki.
Mając to na uwadze, możesz sprawdzić, czy masz konto osobiste lub biznesowe, a następnie przełączyć się na konto biznesowe, jeśli to konieczne.
Aby to zrobić, po prostu odwiedź swoje konto na Instagramie i kliknij wyłożoną ikonę w menu bocznym.
Po tym, kliknij na „Ustawienia”.
Jeśli nie masz konta biznesowego, to na tym ekranie pojawi się „Przełącz na konto profesjonalne” jako ostatnia opcja.
Jeśli masz obecnie konto osobiste i chcesz przełączyć się na konto biznesowe, to po prostu kliknij na ten link.
Jak połączyć stronę na Facebooku z kontem na Instagramie?
Zanim będziesz mógł wyświetlać zdjęcia z Instagrama w WordPressie, najpierw będziesz musiał połączyć swoje konto na Instagramie ze stroną na Facebooku.
Aby to zrobić, przejdź do strony na Facebooku, której chcesz użyć, a następnie kliknij „Ustawienia” w lewym menu.
Gdy już to zrobisz, kliknij na 'Linked Account’. Teraz możesz wybrać 'Instagram’ i kliknąć przycisk 'Połącz’.
Facebook pokaże teraz wszystkie działania, które może wykonać, oraz informacje, do których może uzyskać dostęp.
Jeśli jesteś zadowolony z tego, a następnie kliknij na przycisk „Connect”.
Wystarczy pamiętać, że ludzie, którzy zarządzają swoją stronę Facebook może być w stanie zobaczyć swoje wiadomości Instagram i odpowiedzieć na nich. Jeśli ychcesz to zatrzymać i zachować prywatność swoich wiadomości, to kliknij, aby wyłączyć suwak.
Kiedy będziesz gotowy, aby przejść do następnego ekranu, kliknij na „Confirm.
To otwiera okienko, w którym możesz wpisać swoją nazwę użytkownika i hasło do Instagrama.
Po tym, kliknij przycisk „Zaloguj się”.
Po kilku chwilach zobaczysz komunikat, że Twoje konta na Instagramie i Facebooku są teraz połączone.
Mamy nadzieję, że ten artykuł pomógł Ci nauczyć się, jak wyświetlać zdjęcia z Instagrama w widżecie paska bocznego WordPress. Możesz także zobaczyć nasz przewodnik po tym, jak stworzyć niestandardowy kanał na Facebooku w WordPressie, lub zobaczyć nasz ekspercki wybór wtyczek dowodu społecznego dla WordPressa i WooCommerce.
Jeśli podobał Ci się ten artykuł, to zasubskrybuj nasz kanał YouTube dla tutoriali wideo WordPress. Możesz nas również znaleźć na Twitterze i Facebooku.
