Jak dodać powiększenie obrazków w WordPressie

Czy chcesz dodać powiększenie obrazów w WordPressie podobne do tego z Amazon? Powiększenie jest czymś więcej niż tylko efektowną funkcją, to przydatne narzędzie, które pozwala odwiedzającym zobaczyć drobne szczegóły na obrazach, których normalnie nie widzą. 

Gorąco polecamy dodanie funkcji powiększenia dla sklepów internetowych, gdzie klienci chcą zobaczyć teksturę i jakość przedmiotów. Jest to również pomocne w przypadku stron internetowych z fotografiami, gdzie widzowie chcą zobaczyć każdy szczegół obrazu.

Dodając powiększenie do swoich obrazów, możesz poprawić wrażenia użytkownika, utrzymać jego zainteresowanie na dłużej, a nawet zwiększyć sprzedaż.

W tym artykule pokażemy Ci, jak łatwo dodać powiększenie dla obrazów w WordPress.

Dlaczego warto dodać powiększenie lupy do obrazów?

Dodanie funkcji powiększenia na Twojej stronie WordPress pozwoli odwiedzającym na wyraźne oglądanie szczegółowych detali obrazów.

Jeśli masz stronę fotograficzną, dodanie funkcji powiększenia pozwoli użytkownikom przybliżyć Twoje fotografie, aby zobaczyć drobniejsze szczegóły.

Podobnie, jeśli prowadzisz sklep internetowy, Twoi klienci będą mogli powiększać zdjęcia produktów.

Wiele dużych witryn e-commerce już korzysta z powiększenia obrazów produktów. Pozwala to klientom na dokładne obejrzenie produktu i tworzy lepsze doświadczenie zakupowe w Twoim sklepie.

Mając to na uwadze, pokażemy Ci, jak łatwo dodać powiększenie lupy do obrazów w WordPress, korzystając z trzech różnych metod. Możesz użyć poniższych linków, aby przejść do preferowanej metody.

• Metoda 1: Dodaj powiększenie obrazów w WordPress za pomocą Envira Gallery (zalecane)
• Metoda 2: Dodaj powiększenie dla obrazów WordPress za pomocą WP Image Zoom
• Method 3: Add a Magnifying Zoom for Images in WordPress with WPCode

Metoda 1: Jak dodać powiększenie dla obrazów w WordPress za pomocą Envira Gallery (zalecane)

Envira Gallery to najlepsza wtyczka galerii dla WordPress. Możesz jej użyć do łatwego tworzenia pięknych galerii obrazów dla swojej strony internetowej WordPress. Posiada również dodatek Zoom, który pozwala na dodanie funkcji powiększenia do obrazów w galerii.

Inne potężne funkcje Envira obejmują kreator przeciągnij i upuść, gotowe motywy galerii, okna lightbox, kompresję obrazów, ochronę obrazów i inne.

Aby rozpocząć, musisz zainstalować i aktywować wtyczkę Envira Gallery. Więcej szczegółów znajdziesz w naszym poradniku jak zainstalować wtyczkę WordPress.

Po aktywacji musisz przejść do strony Envira Gallery » Settings i wprowadzić swój klucz licencyjny. Klucz licencyjny znajdziesz w obszarze konta Envira Gallery.

Następnie kliknij przycisk „Zweryfikuj klucz”.

Następnie musisz przejść do Envira Gallery » Dodatki. Stamtąd przewiń w dół, aby znaleźć Dodatek Zoom i kliknij przycisk „Zainstaluj”.

Po zainstalowaniu dodatku Zoom musisz go również aktywować, przełączając przełącznik.

Następnym krokiem jest dodanie nowej galerii. Aby to zrobić, przejdź do Envira Gallery » Dodaj nową z panelu administracyjnego WordPress.

Stąd możesz wprowadzić nazwę swojej galerii i kliknąć przycisk „Wybierz pliki z komputera”, aby przesłać obrazy do swojej galerii.

Możesz również kliknąć przycisk „Wybierz pliki z innych źródeł”, aby dodać obrazy z biblioteki multimediów WordPress do swojej galerii.

Po przesłaniu obrazów do galerii możesz je uporządkować, przeciągając i upuszczając miniatury na miejsce.

Istnieją również inne opcje dostosowywania galerii obrazów. Na przykład możesz wybrać układ galerii, dodać tytuły obrazów i tekst alternatywny, włączyć lightbox galerii, wyświetlać podpisy obrazów, edytować wymiary obrazów i wiele więcej.

Więcej informacji znajdziesz w naszym przewodniku jak tworzyć responsywne galerie obrazów za pomocą Envira.

Konfiguracja ustawień powiększenia obrazu

Aby dodać powiększenie do obrazów w galerii, kliknij zakładkę „Zoom”. Następnie zaznacz pole, aby włączyć funkcję powiększenia.

Po włączeniu funkcji powiększania pojawią się ustawienia dodawania powiększenia do Twoich obrazów.

Możesz skonfigurować ustawienia, takie jak powiększenie po najechaniu myszką, efekt powiększenia, typ powiększenia, pozycję okna powiększenia, rozmiar okna powiększenia, kolor zabarwienia i inne.

Gdy będziesz zadowolony z ustawień zoomu, kliknij przycisk „Opublikuj”, aby zapisać zmiany i udostępnić tę galerię.

Osadzanie galerii obrazów z powiększeniem

Teraz, gdy Twoja galeria jest gotowa, możesz dodać ją bezpośrednio do dowolnej strony lub wpisu w WordPress.

Z edytora treści WordPress, kliknij przycisk „+”, aby dodać blok Envira Gallery. Następnie kliknij menu rozwijane w bloku Envira Gallery, aby wybrać galerię do wyświetlenia.

Następnie zobaczysz podgląd swojej galerii obrazów w edytorze bloków WordPress. Jeśli jesteś zadowolony z tego, jak wygląda, możesz opublikować post lub stronę.

Teraz możesz odwiedzić swoją witrynę, aby zobaczyć funkcję powiększenia w akcji.

Envira Gallery to świetna wtyczka do dodawania funkcji powiększenia do stron internetowych z fotografią. Ale działa również doskonale w sklepach internetowych.

Aby dowiedzieć się więcej, zapoznaj się z naszym przewodnikiem jak stworzyć galerię obrazów produktów WooCommerce.

Metoda 2: Jak dodać powiększenie obrazów w WordPress za pomocą WP Image Zoom

WP Image Zoom to darmowa wtyczka WordPress, która pozwala łatwo stworzyć lupę na Twoich obrazach.

Najpierw musisz zainstalować i aktywować wtyczkę WP Image Zoom. Więcej szczegółów znajdziesz w naszym przewodniku krok po kroku na temat jak zainstalować wtyczkę WordPress.

W tym samouczku będziemy korzystać z darmowej wersji, ale jeśli chcesz więcej opcji dostosowywania, możesz sprawdzić WP Image Zoom Pro. Więcej o wtyczce dowiesz się w naszej recenzji WP Image Zoom.

Po aktywacji musisz przejść do strony WP Image Zoom » Zoom Settings z paska bocznego administratora WordPress.

Następnie musisz skonfigurować ustawienia efektu powiększenia, przechodząc do zakładki „Ustawienia powiększenia” i wybierając kształt soczewki, której chcesz użyć.

Możesz wybierać spośród kształtów okrągłych, kwadratowych i okienek powiększenia. Możesz nawet wybrać opcję „Brak soczewki” (⨯), jeśli nie chcesz używać kształtu do efektu powiększenia.

Po wybraniu preferowanego obiektywu musisz przewinąć w dół do następnego kroku, gdzie możesz podglądnąć obraz z wybranym obiektywem, aby zobaczyć, jak działa. Wtyczka posiada obraz podglądu, którego możesz użyć do testowania zmian.

Następnie musisz przełączyć się na zakładkę „Ogólne”.

Stąd możesz wybrać typ kursora, ustawić efekt animacji, włączyć powiększenie po najechaniu myszką lub kliknięciu myszką oraz zdefiniować poziom powiększenia.

Jeśli chcesz jeszcze więcej opcji, niektóre funkcje są dostępne tylko w wersji pro wtyczki WP Image Zoom.

Po dokonaniu odpowiednich wyborów, po prostu przejdź do zakładki 'Lens' u góry.

Teraz możesz skonfigurować ustawienia, takie jak rozmiar soczewki, kolor soczewki, opcje obramowania soczewki i inne, jeśli w Kroku 1 wybrałeś soczewkę „okrągłą” lub „kwadratową”.

Jeśli wybrałeś soczewkę powiększającą (Zoom Window Lens), musisz przełączyć się na zakładkę konfiguracji „Zoom Window”.

Stąd możesz zmienić szerokość i wysokość okna powiększenia, pozycjonowanie, odległość od głównego obrazu, kolory obramowania i inne.

Następnie musisz po prostu kliknąć „Zapisz zmiany”, aby zapisać swoje ustawienia.

Następnie wszystko, co musisz zrobić, to skonfigurować kilka ogólnych ustawień.

Konfiguruj ogólne ustawienia wtyczki

Następnie musisz przejść do zakładki Ustawienia ogólne w ustawieniach wtyczki.

Stąd możesz teraz włączyć funkcje takie jak powiększenie obrazów produktów WooCommerce, miniaturki, urządzenia mobilne, strony załączników, strony kategorii produktów i inne.

Wszystko, co musisz zrobić, to zaznaczyć pola obok tych opcji.

Możesz również usunąć efekt lightbox, aby użytkownicy mogli płynnie powiększać obrazy.

Jednakże, będziesz potrzebować wersji Pro wtyczki dla tej funkcji.

Jeśli nie zamierzasz usuwać lightboxa dla obrazów, musisz przewinąć w dół do opcji 'Enable inside a Lightbox' i zaznaczyć pole obok niej.

Uwaga: Możesz zobaczyć obsługiwane lightboxy, aby upewnić się, że powiększenie działa poprawnie wewnątrz lightboxa na Twojej stronie.

Po zakończeniu dostosowywania ustawień, nie zapomnij kliknąć przycisku 'Save Changes', aby zapisać swoje ustawienia.

Powiększenie będzie teraz włączone dla produktów WooCommerce.

Możesz odwiedzić swój sklep internetowy, aby sprawdzić naszą funkcję powiększenia.

Jeśli jednak chcesz włączyć powiększenie dla obrazów w postach i stronach WordPress, musisz wykonać poniższy krok.

Włącz powiększenie obrazów w edytorze bloków

Domyślnie powiększenie za pomocą lupy nie jest włączone dla obrazów na Twoich postach i stronach. Musisz to zrobić ręcznie po dodaniu obrazu do swojej treści.

Najpierw musisz otworzyć post, który chcesz edytować w edytorze bloków.

Następnie musisz przesłać obraz do tego posta z biblioteki mediów lub z komputera.

Gdy to zrobisz, po prostu kliknij obraz, aby otworzyć panel Ustawienia bloku w prawym rogu ekranu.

Stąd po prostu przejdź do zakładki „Style” i kliknij przycisk „Z powiększeniem”, aby zastosować powiększenie obrazu.

Po tym po prostu kliknij przycisk „Zaktualizuj” lub „Opublikuj” na górze, aby zapisać swoje ustawienia.

Funkcja powiększenia będzie wyglądać tak na Twojej stronie:

Uwaga: Będziesz musiał powtórzyć ten krok za każdym razem, gdy będziesz chciał dodać efekt powiększenia do poszczególnego obrazu.

Metoda 3: Jak dodać powiększenie za pomocą lupy do obrazów w WordPressie za pomocą WPCode

Możesz również dodać funkcję powiększenia za pomocą lupy do swoich obrazów w WordPressie, korzystając z darmowej wtyczki WPCode.

WPCode to najlepsza wtyczka do fragmentów kodu na rynku, pozwalająca bezpiecznie i łatwo dodawać niestandardowy kod do swojej witryny. Zawiera ponad 393 gotowe fragmenty kodu, które można dodać za pomocą kilku kliknięć, w tym lupę do obrazów.

Aby rozpocząć, musisz zainstalować i aktywować bezpłatną wtyczkę WPCode. Jeśli potrzebujesz pomocy, zapoznaj się z naszym samouczkiem jak zainstalować wtyczkę WordPress.

Po aktywacji przejdź do Fragmenty kodu » Biblioteka z panelu administratora WordPress.

To przeniesie Cię do Biblioteki Snippetów, gdzie możesz zobaczyć wszystkie różne fragmenty kodu, które możesz dodać do swojej witryny.

Stąd po prostu wyszukaj fragment „Szkło powiększające dla obrazów” w bibliotece.

Gdy go znajdziesz, najedź na niego kursorem myszy i kliknij przycisk „Użyj fragmentu”.

WPCode automatycznie doda kod za Ciebie, a także wybierze odpowiednią metodę wstawiania.

Teraz wystarczy przełączyć przełącznik z „Nieaktywny” na „Aktywny”, a następnie kliknąć przycisk „Aktualizuj”.

To wszystko! Kiedy odwiedzisz swoją stronę WordPress, zobaczysz, że wszystkie Twoje obrazy będą miały lupę, która pojawia się po najechaniu na nie kursorem.

Uwaga: Zalecamy używanie obrazów wysokiej jakości, aby funkcja zoomu wyglądała świetnie. Obrazy wysokiej jakości są zazwyczaj większe pod względem rozmiaru pliku i dłużej się ładują, co wpłynie na szybkość i wydajność Twojej witryny.

Aby rozwiązać ten problem, musisz zoptymalizować swoje obrazy pod kątem sieci przed przesłaniem ich do WordPress.

Samouczek wideo

Jeśli nie przepadasz za samouczkami pisanymi, możesz zamiast tego obejrzeć nasz samouczek wideo:

Subskrybuj WPBeginner

Mamy nadzieję, że ten artykuł pomógł Ci dowiedzieć się, jak dodać powiększenie obrazów w WordPress. Możesz również zapoznać się z naszym przewodnikiem na temat optymalizacji obrazów dla wyszukiwarek oraz naszymi najlepszymi wyborami wtyczek do kompresji obrazów.

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.