Jak dodać GIF-y z Giphy w WordPress (2 proste metody)

Dodawanie animowanych GIF-ów to świetny sposób na pokazanie osobowości w swoich postach na blogu. W WPBeginner często używamy ich, aby nasze poradniki były bardziej przystępne.

Jednak przesyłanie dużych plików GIF może znacznie spowolnić Twoją witrynę. Wolna witryna szkodzi doświadczeniu użytkownika i rankingom SEO.

Na szczęście możesz osadzać GIF-y bezpośrednio z Giphy, aby rozwiązać ten problem. Oszczędza to przepustowość i sprawia, że strony ładują się szybko.

W tym przewodniku podzielimy się dwoma prostymi sposobami dodawania GIF-ów z Giphy w WordPressie.

Plusy i minusy używania animowanych obrazów GIF w WordPress

Używanie animowanych GIF-ów (Graphics Interchange Format) może być zabawnym i angażującym sposobem na ulepszenie Twoich treści.

Są idealne do dodawania animowanych reakcji, memów i odniesień do popkultury na Twojej stronie WordPress. Może to pomóc zwiększyć liczbę wyświetleń stron i zmniejszyć współczynnik odrzuceń Twojego bloga.

Istnieją jednak pewne wady. Pliki GIF są duże. Mogą zajmować dużo miejsca w bibliotece multimediów WordPress, spowalniać Twoją stronę i zużywać przepustowość. To zła wiadomość dla doświadczenia użytkownika i może również wpłynąć na Twoje pozycje w wyszukiwarkach i ruch.

Właśnie tutaj z pomocą przychodzi Giphy. Udostępnianie animowanych obrazków GIF za pośrednictwem Giphy pozwoli zaoszczędzić przepustowość Twojego planu hostingowego. Będzie to miało również mniejszy wpływ na czas ładowania i wydajność Twojego WordPressa.

Co więcej, Giphy ma dużą kolekcję zabawnych i przystępnych GIF-ów, co czyni go świetnym do dodania odrobiny humoru i osobowości do Twoich treści.

Mając to na uwadze, przyjrzyjmy się 2 przyjaznym dla początkujących sposobom wykorzystania GIF-ów z Giphy w WordPressie. Po prostu kliknij poniższe linki, aby przejść do preferowanej metody:

Metoda 1: Jak dodać GIF-y z Giphy za pomocą kodu osadzania (bez wtyczki)

Jedną z opcji jest dodanie GIF-a do strony lub wpisu za pomocą jego kodu osadzania Giphy. 

Ponieważ używasz kodu osadzania, nie potrzebujesz żadnych specjalnych wtyczek WordPress. Jednak uzyskanie kodu osadzania wymaga kilku dodatkowych kroków. 

Jeśli chcesz dodać tylko niewielką liczbę GIF-ów do swojej witryny, te dodatkowe kroki mogą nie stanowić problemu. Jednak jeśli planujesz używać wielu GIF-ów, warto zainstalować wtyczkę, która ułatwi ten proces. 

Aby dodać GIF za pomocą kodu osadzania, przejdź do witryny Giphy.com. Następnie znajdź GIF, którego chcesz użyć.

Możesz teraz kliknąć przycisk „Osadź”.

Giphy wyświetli teraz kod osadzania dla tego GIF-a.

W tym momencie możesz wybrać między „Responsywne wyłączone” a „Responsywne włączone”.

Zalecamy wybranie opcji „Responsywne włączone”. Zapewnia to, że animowany GIF poprawnie skaluje się i wygląda świetnie na urządzeniach mobilnych, a także na ekranach komputerów.

Na przykład, responsywne motywy WordPress automatycznie dostosowują się do rozmiaru ekranu użytkownika. 

Mając to na uwadze, dobrym pomysłem jest wybranie opcji „Responsywne Włączone”.

Po podjęciu decyzji skopiuj kod osadzania, klikając przycisk „Kopiuj kod”.

Teraz czas przełączyć się do obszaru administracyjnego WordPress. Tutaj po prostu otwórz edytor Gutenberg dla strony lub wpisu, w którym chcesz osadzić swojego GIF-a.

Twoim następnym zadaniem jest utworzenie nowego bloku Niestandardowy HTML. Aby rozpocząć, kliknij ikonę „+”. 

Następnie w wyskakującym okienku wpisz „Niestandardowy HTML”, aby znaleźć odpowiedni blok. Po kliknięciu bloku Niestandardowy HTML, WordPress doda ten blok do Twojej strony.

Teraz możesz po prostu wkleić kod osadzania swojego GIF-a do bloku Niestandardowy HTML. 

Powinno to wyglądać tak.

Zanim opublikujesz tego GIF-a, możesz sprawdzić, jak będzie wyglądał dla Twoich odwiedzających. Aby to zrobić, po prostu kliknij przycisk „Podgląd” u góry ekranu. WordPress wyświetli teraz Twoją stronę w nowej karcie.

Jeśli jesteś zadowolony ze swojego GIF-a, możesz opublikować ten wpis lub stronę WordPress. Po prostu kliknij przycisk „Zaktualizuj” lub „Opublikuj” w edytorze bloków.

GIF pojawi się teraz na Twoim blogu WordPress.

Metoda 2: Jak dodać GIF-y z Giphy za pomocą EmbedPress

Jeśli planujesz dodać dużo GIF-ów do swojej witryny, kody osadzania mogą stać się zbyt czasochłonne.

Inną opcją jest użycie wtyczki EmbedPress. Ta wtyczka freemium pozwala osadzać GIF-y za pomocą samych adresów URL Giphy.

EmbedPress pozwala również na osadzanie treści z ponad 100 innych stron internetowych. Obejmują one osadzanie filmów z YouTube, plików PDF, plików audio i wiele innych.

Najpierw musisz zainstalować i aktywować wtyczkę EmbedPress. Użyjemy darmowej wersji, ponieważ ma ona wszystko, czego potrzebujemy do tego tutorialu.

Jeśli potrzebujesz pomocy, zapoznaj się z naszym przewodnikiem, jak zainstalować wtyczkę WordPress.

Po aktywacji przejdź do strony lub wpisu, do którego chcesz dodać GIF. Następnie możesz kliknąć ikonę „+”.

W pojawiającym się oknie wpisz „EmbedPress”, aby znaleźć odpowiedni blok. 

Po prostu kliknij ten blok, a WordPress doda blok EmbedPress do Twojej strony.

W nowej karcie przejdź do strony Giphy. Następnie możesz znaleźć GIF, którego chcesz użyć. 

Następnie po prostu skopiuj adres URL tego GIF-a. 

Teraz czas wrócić do panelu administracyjnego WordPress. 

Tutaj po prostu wklej adres URL GIF-a do pola EmbedPress. Na koniec kliknij „Osadź”.

Teraz, jeśli spojrzysz na swoją stronę internetową, zobaczysz swojego nowego GIF-a.

Jeśli nie jesteś zadowolony ze swojego GIF-a, EmbedPress ma kilka ustawień, które możesz chcieć zbadać. Obejmują one zmianę wysokości i szerokości wszystkich GIF-ów dodawanych za pomocą EmbedPress.

Aby przyjrzeć się tym ustawieniom, kliknij „EmbedPress” w bocznym pasku WordPress.

Jeśli nie jest jeszcze zaznaczone, kliknij zakładkę „Ogólne”. Możesz teraz użyć tych ustawień, aby dostosować swoje osadzenia EmbedPress. 

Pamiętaj tylko, że wszelkie zmiany wprowadzone w tym menu wpłyną na wszystkie Twoje treści EmbedPress.

Często zadawane pytania dotyczące używania GIF-ów w WordPressie

Oto odpowiedzi na niektóre z najczęściej zadawanych pytań dotyczących dodawania GIF-ów do strony WordPress.

Czy osadzanie GIF-ów z Giphy spowolni moją stronę internetową?

Korzystanie z Giphy jest zazwyczaj znacznie lepsze dla wydajności niż przesyłanie dużych plików GIF bezpośrednio do WordPressa. Ponieważ plik jest serwowany z serwerów Giphy, oszczędza to Twoją przepustowość i miejsce na dysku. Jednak nadal ładuje zewnętrzny skrypt, dlatego zalecamy używanie tylko kilku GIF-ów na stronę, aby Twoja witryna ładowała się szybko.

Czy mogę tworzyć własne GIF-y i przesyłać je do WordPressa?

Tak, absolutnie możesz przesłać własne GIF-y do biblioteki multimediów WordPress. Pamiętaj tylko, że pliki GIF są często duże i mogą zajmować miejsce na dysku oraz spowalniać Twoją witrynę, jeśli nie są zoptymalizowane. Najlepszy sposób na zrobienie tego omawiamy w naszym przewodniku jak dodać animowane GIF-y w WordPress.

Czy lepiej użyć wtyczki do osadzania GIF-ów, czy zrobić to ręcznie?

Zależy to od Twojego przepływu pracy. Ręczna metoda kodu osadzania jest idealna, jeśli planujesz dodawać GIF-y tylko okazjonalnie, ponieważ nie wymaga dodatkowych wtyczek. Jednak jeśli często używasz GIF-ów w swoich treściach, dedykowana wtyczka, taka jak EmbedPress, oszczędza czas, pozwalając na ich osadzanie za pomocą prostego adresu URL.

Jakie są najlepsze praktyki dotyczące używania GIF-ów na stronie internetowej?

Aby uzyskać najlepsze rezultaty, używaj GIF-ów, które są związane z Twoimi treściami i dodają wartości, czy to poprzez humor, czy ilustrację. Staraj się ich nie nadużywać, ponieważ jeden lub dwa dobrze umieszczone GIF-y są skuteczniejsze niż przeładowana strona. Na koniec zawsze wybieraj opcję responsywnego osadzania, aby Twoje GIF-y wyglądały świetnie na wszystkich urządzeniach.

Dalsza lektura

Mamy nadzieję, że ten artykuł pomógł Ci dowiedzieć się, jak dodawać GIF-y z Giphy w WordPressie. Możesz również zapoznać się z naszymi innymi przewodnikami dotyczącymi multimediów i wydajności WordPressa:

• Jak zoptymalizować obrazy pod kątem wydajności sieci bez utraty jakości
• Najlepsze wtyczki do przesyłania plików dla WordPressa (darmowe i płatne)
• Jak łatwo dodać interaktywne obrazy 360 stopni w WordPress
• Jak naprawić typowe problemy z obrazami w WordPress

Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube po samouczki wideo WordPress. Możesz nas również znaleźć na Twitterze i Facebooku.