WordPress

Jak dodać powiększenie powiększające dla obrazów w WordPress

  • 16 marca, 2023
  • 5 min read
Jak dodać powiększenie powiększające dla obrazów w WordPress


Czy chcesz dodać zoom powiększający podobny do Amazon dla obrazów w WordPress?

Dodanie funkcji powiększania pozwoli użytkownikom zobaczyć szczegóły, których nie widzieliby na obrazie o normalnym rozmiarze.

W tym artykule pokażemy, jak łatwo dodać powiększenie powiększające do obrazów w WordPress.

Jak dodać powiększenie powiększające dla obrazów w WordPress

Po co dodawać powiększenie powiększające do obrazów?

Dodanie funkcji powiększania w witrynie WordPress pozwoli odwiedzającym wyraźnie zobaczyć skomplikowane szczegóły obrazów.

Jeśli masz witrynę internetową z fotografiami, dodanie funkcji powiększania umożliwi użytkownikom powiększanie zdjęć w celu wyświetlenia drobniejszych szczegółów.

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

Wiele dużych witryn eCommerce korzysta już z powiększania zdjęć produktów. Pozwala klientom zapoznać się z produktem i tworzy lepsze doświadczenia zakupowe w Twoim sklepie.

To powiedziawszy, zobaczmy, jak łatwo dodać powiększenie powiększające do obrazów w WordPress.

Jak dodać powiększenie powiększające dla obrazów w WordPress

Najpierw musisz zainstalować i aktywować wtyczkę WP Image Zoom. Aby uzyskać więcej informacji, zapoznaj się z naszym przewodnikiem krok po kroku dotyczącym instalacji wtyczki WordPress.

Po aktywacji musisz udać się do Powiększenie obrazu WP » Ustawienia powiększenia strona 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órego chcesz użyć.

Warto przeczytać!  woocommerce offtopic - nie można utworzyć atrybutu produktu (taksonomii) i dodać terminów w tym samym wykonaniu
Wybierz kształt soczewki

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

Po wybraniu preferowanego obiektywu przewiń w dół do następnego kroku, w którym możesz wyświetlić podgląd obrazu z wybranym obiektywem, aby zobaczyć, jak to działa. Wtyczka zawiera obraz podglądu, którego można użyć do przetestowania zmian.

Sprawdź podgląd obiektywu w kroku drugim

Następnie musisz przejść do zakładki „Ogólne”.

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

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

Skonfiguruj ustawienia karty Ogólne w kroku 3

Po dokonaniu odpowiednich wyborów, po prostu przejdź do zakładki „Obiektyw” od góry.

Możesz teraz 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ą”.

Ustawienia obiektywu

Jeśli wybrałeś Obiektyw okna powiększenia, musisz przejść do zakładki konfiguracji „Okno powiększenia”.

W tym miejscu możesz zmienić szerokość i wysokość okna powiększenia, położenie, odległość od głównego obrazu, kolory obramowania i nie tylko.

Ustawienia okna powiększenia

Następnie wystarczy kliknąć przycisk „Zapisz zmiany”, aby zapisać ustawienia.

Następnie wystarczy skonfigurować kilka ogólnych ustawień.

Kliknij Zapisz zmiany dla ostatniego kroku

Skonfiguruj ogólne ustawienia wtyczki

Warto przeczytać!  Zarejestruj nowe domeny za pomocą konfiguracji i integracji jednym kliknięciem w WPMU DEV

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

Stąd możesz teraz włączyć funkcje, takie jak powiększanie obrazów produktów WooCommerce, miniatur, urządzeń mobilnych, stron załączników, stron kategorii produktów i innych.

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

Przejdź do zakładki Ustawienia ogólne i zaznacz pola obok opcji, które chcesz aktywować

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

Jednak do tej funkcji potrzebna jest wersja Pro wtyczki.

Usuń opcję lightbox, zaznaczając pole

Jeśli nie zamierzasz usuwać lightbox dla obrazów, przewiń w dół do opcji „Włącz w lightbox” i zaznacz pole obok niej.

Notatka: Możesz zobaczyć obsługiwane lightboxy, aby upewnić się, że powiększenie działa dobrze w lightboxie w Twojej witrynie.

Zaznacz opcję włączania wewnątrz lightboxa

Po zakończeniu dostosowywania ustawień nie zapomnij kliknąć przycisku „Zapisz zmiany”, aby zapisać ustawienia.

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

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

Włączona funkcja Zoom w sklepie WooCommerce

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

Krok 3. Włącz powiększenie powiększające dla obrazów w Edytorze bloku

Domyślnie powiększanie nie jest włączone dla obrazów w Twoich postach i na stronach. Musisz to zrobić ręcznie po dodaniu obrazu do 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 multimediów lub komputera.

Warto przeczytać!  Jak dodać stronę mapy witryny HTML w WordPress (2 sposoby)

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

Stąd wystarczy przejść do zakładki „Style” i kliknąć przycisk „Z powiększeniem”, aby zastosować powiększenie powiększające do obrazu.

Kliknij przycisk Zoom

Następnie wystarczy kliknąć przycisk „Aktualizuj” lub „Opublikuj” u góry, aby zapisać ustawienia.

Funkcja powiększania będzie wyglądać w Twojej witrynie w następujący sposób:

Podgląd funkcji powiększenia

Notatka: Będziesz musiał powtórzyć ten krok za każdym razem, gdy chcesz dodać efekt powiększenia do pojedynczego obrazu.

Zalecamy używanie obrazów wysokiej jakości, aby funkcja powiększania wyglądała świetnie. Obrazy wysokiej jakości mają zwykle większy rozmiar pliku i ładują się dłużej, co wpływa na szybkość i wydajność witryny.

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

Mamy nadzieję, że ten artykuł pomógł ci dowiedzieć się, jak dodać powiększanie do obrazów w WordPress. Możesz także zapoznać się z naszym przewodnikiem na temat optymalizacji obrazów pod kątem wyszukiwarek oraz naszymi najlepszymi ofertami najlepszych wtyczek do kompresji obrazu.

Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube, aby zobaczyć samouczki wideo WordPress. Możesz nas również znaleźć na Świergot i Facebooka.




Źródło