Chcesz osadzać kod iFrame we wpisie lub na stronie WordPress?
Ramki iFrame to łatwy sposób na wyświetlanie filmów lub innych treści na twojej witrynie bez konieczności ich przesyłania. Wiele platform zewnętrznych, takich jak YouTube, udostępnia kod iFrame, który można po prostu wkleić na twoją witrynę internetową.
W tym artykule pokażemy, jak łatwo osadzać kod iFrame w WordPress.
Co to jest iFrame?
Ramka iFrame (skrót od inline frame) pozwala osadzać filmy lub inne treści na twojej witrynie bez konieczności ich hostowania. Pozwala to zaoszczędzić przepustowość i przestrzeń dyskową, dlatego nigdy nie należy przesyłać filmów bezpośrednio do WordPressa.
Oprócz poprawy szybkości i wydajności twojego WordPressa, iFrame będzie aktualizować się automatycznie, jeśli oryginalna treść ulegnie zmianie. Oznacza to, że odwiedzający zawsze zobaczą najnowszą wersję treści.
Osadzanie treści chronionych prawem autorskim za pomocą ramki iFrame również nie narusza praw autorskich, więc może pomóc w ochronie przed pozwami sądowymi.
Powiedziawszy to, zobaczmy, jak można łatwo osadzać kod iFrame w WordPress. Po prostu użyj szybkich odnośników, aby przejść bezpośrednio do metody, której chcesz użyć:
Metoda 1: Osadzanie iFrame przy użyciu kodu źródłowego w WordPress (szybko i łatwo)
Wiele dużych witryn hostujących filmy ma opcję „Osadzanie”, która zapewnia dostęp do kodu iFrame, który należy dodać do twojej witryny.
Jeśli witryna internetowa ma jakiekolwiek ustawienia „Udostępniania” lub „Osadzania”, jest to często najszybszy i najłatwiejszy sposób na osadzanie treści.
Dokładne kroki będą się różnić w zależności od platformy, ale spójrzmy na YouTube jako przykład. Aby osadzać filmy z YouTube w WordPress, wystarczy kliknąć przycisk „Udostępnij” pod filmem, którego chcesz użyć.
Następnie zobaczysz wyskakujące okienko z różnymi opcjami udostępniania.
Wystarczy kliknąć przycisk „Osadzaj”.
YouTube wyświetli teraz kod iFrame.
Domyślnie YouTube zaznacza pole „Pokaż kontrolki odtwarzacza”, ale zalecamy również włączenie trybu zwiększonej prywatności. Tryb ten pozwala odwiedzającym oglądać osadzane treści na twojej witrynie internetowej WordPress bez wpływu na ich przeglądanie w YouTube.
Następnie kliknij przycisk „Kopiuj”.
Teraz możesz wkleić ten kod do dowolnego wpisu lub strony w twojej witrynie. W tym przewodniku dodamy go do utwórz nową stronę w edytorze bloków WordPress.
Wystarczy otworzyć stronę, a następnie kliknąć przycisk „+”. W wyskakującym okienku, które się pojawi, zacznij wpisywać „HTML”, aby znaleźć własny blok HTML.
Gdy pojawi się odpowiedni blok, kliknij, aby dodać go do twojej strony.
Następnie wystarczy wkleić kod iFrame YouTube do bloku.
Możesz teraz opublikować swoją stronę, aby zobaczyć film z YouTube na żywo na swoim blogu WordPress.
Metoda 2: Osadzanie iFrame za pomocą wtyczki WordPress (działa na wszystkich witrynach internetowych)
Nie każda witryna internetowa innej firmy udostępnia gotowy kod osadzania. Jeśli nie możesz znaleźć żadnych ustawień „Udostępnij” lub „Osadzaj”, możesz łatwo utworzyć swój własny kod iFrame za pomocą wtyczki iFrame.
Najpierw należy zainstalować i włączyć wtyczkę iFrame. Aby uzyskać więcej informacji, zobacz nasz przewodnik krok po kroku, jak zainstalować wtyczkę WordPress.
Po włączaniu wtyczka zacznie działać od razu, bez konieczności konfiguracji. Po prostu przejdź do strony lub wpisu, w którym chcesz osadzać treści i dodaj blok Shortcode.
Następnie dodaj następujący krótki kod:
[iframe src="URL goes here"]
Wystarczy zastąpić „URL goes here” adresem URL treści, którą chcesz osadzać na swojej witrynie.
Jako przykład, dodajmy mapę Google w WordPress, ponieważ jest to łatwy sposób dla sklepów, restauracji i innych miejsc, aby dodać wskazówki dojazdu w formularzu kontaktowym.
Wskazówka: W zależności od źródła, może być konieczne kliknięcie „Udostępnij” lub podobnego ustawienia, aby zobaczyć bezpośredni, możliwy do osadzenia adres URL treści.
Następnie wystarczy wyświetlić podgląd lub opublikować wpis.
Teraz powinieneś zobaczyć treść osadzaną na twojej witrynie internetowej.
Aby zobaczyć wszystkie dostępne parametry, można zajrzeć na stronę wtyczki iFrame.
Metoda 3: Ręczne utworzenie kodu iFrame w WordPress (bez wtyczki)
Jeśli nie chcesz używać specjalnej wtyczki WordPress, możesz utworzyć kod iFrame ręcznie. Aby to zrobić, należy otworzyć stronę lub wpis, a następnie dodać blok HTML w edytorze treści WordPress.
Najpierw wklej następujący kod do twojego bloku HTML:
<iframe src="URL goes here"></iframe>
Po prostu zastąp „URL goes here” bezpośrednim adresem URL treści, którą chcesz osadzać.
Tutaj osadzamy mapę Google:
Możesz dodać dodatkowe parametry, aby zmienić wygląd treści na twojej witrynie internetowej. Na przykład, ustawiamy szerokość na 600 pikseli i wysokość na 200 pikseli:
<iframe src="URL goes here" width="600" height="300"></iframe>
Jest to przydatne, gdy trzeba wyświetlić osadzaną treść na mniejszej przestrzeni. Na przykład, możesz chcieć zmienić rozmiar treści po przetestowaniu mobilnej wersji twojej witryny internetowej WordPress.
Jakie są alternatywy dla iFrame?
Korzystanie z iFrames ma pewne wady.
Nie wszystkie witryny internetowe pozwalają na umieszczenie ich treści w ramce iFrame i może być konieczne ręczne dostosowanie treści, aby wyglądała dobrze w dostępnej przestrzeni.
Innym problemem jest to, że witryny HTTPS mogą używać iFrames tylko dla treści z innych witryn HTTPS. Analogicznie, witryny HTTP mogą używać iFrames tylko dla treści z innych witryn HTTP.
Dlatego wiele platform, takich jak WordPress, preferuje oEmbed.
Często można użyć oEmbed do osadzania filmów i innych treści, po prostu wklejając adres URL do wpisu WordPress. WordPress automatycznie zmieni rozmiar oEmbed, aby dopasować go do dostępnej przestrzeni, dzięki czemu zawsze będzie wyglądał idealnie na komputerach stacjonarnych, smartfonach i tabletach.
Ważne: WordPress nie obsługuje już domyślnie oEmbed dla wpisów na Facebooku i Instagramie. Aby uzyskać więcej informacji na ten temat, zapoznaj się z naszym pełnym przewodnikiem na temat poprawki problemu Facebooka i oEmbed w WordPress.
Jeśli chcesz wyświetlać kanały społecznościowe na swojej witrynie internetowej, zalecamy użycie wtyczki mediów społecznościowych zamiast iFrames.
Na przykład Smash Balloon ułatwia osadzanie treści z Facebooka, Instagrama, Twittera i YouTube.
Oto kilka poradników dotyczących dodawania kanałów mediów społecznościowych za pomocą Smash Balloon:
- Jak osadzać rzeczywiste tweety we wpisach na blogu WordPress?
- Jak osadzać filmy z TikTok w WordPress?
- Jak osadzać listę odtwarzania YouTube w WordPress (najlepsza metoda)
Mamy nadzieję, że ten artykuł pomógł ci dowiedzieć się, jak łatwo osadzać kod iFrame w WordPress. Możesz również zapoznać się z naszym przewodnikiem na temat tego, jak zezwolić na PHP we wpisach i na stronach WordPress a, a także zobaczyć nasze wybory ekspertów dotyczące najlepszych wtyczek galerii YouTube dla WordPressa.
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.
Aileen Herring
It was really really helpful
WPBeginner Support
Glad it was helpful
Administrator
M. Faisal.
thanks for your article of how to easily embed iframe code in wordpress.
Now i am trying to embed iframe code in wordpress for google map.
i am success it for solving this problem.
Thanks and regards.
WPBeginner Support
Glad our guide was helpful
Administrator
Kathleen
Thanks for this. When embedding a YouTube video, how can I add a title to the iframe for screen readers, for accessibilty purposes?
WPBeginner Support
You would need to check with the support for the iframe you’re trying to embed for title options available.
Administrator