Generator obrazów AI dla bloków Gutenberga i Kadence!

Opublikowany: 2023-08-18

Używanie sztucznej inteligencji (AI) do generowania obrazów w edytorze bloków WordPress, znanym również jako Gutenberg, z AI Image Lab stało się właśnie łatwiejsze i bardziej zintegrowane z aktualizacją AI Image Lab 1.0.3, która wprowadza blok Gutenberga stworzony do tworzenia sztucznej inteligencji generowanie obrazu bezproblemową częścią procesu tworzenia treści! Blok obrazu AI został zaprojektowany, aby umożliwić użytkownikom szybkie generowanie szerokiej gamy niestandardowych obrazów generowanych przez sztuczną inteligencję dla stron WordPress lub postów bezpośrednio w innej treści, zamiast używania oddzielnego okna lub nakładki biblioteki multimediów w celu wybrania najlepszego obrazu poza kontekst otaczających elementów. Po znalezieniu i wybraniu idealnego obrazu blok obrazu AI można łatwo przekształcić w jeden z wielu podstawowych bloków Gutenberga lub bloków Kadence, które zapewniają dodatkowe opcje stylizacji i układu.

Szybki samouczek

Nie ma lepszego sposobu na pokazanie, co potrafi blok AI Image dla Gutenberga, niż na przykładzie! Będziemy używać bloków z wtyczki Kadence Blocks, ale proces jest taki sam w przypadku korzystania z podstawowych bloków Gutenberga.

W naszym przykładzie stworzymy podstawowy układ strony głównej dla hipotetycznej firmy zajmującej się nieruchomościami. Struktura strony będzie zawierała górny baner z nakładką tekstową, a następnie dwukolumnowy wiersz zawierający obrazy i tekst.

Aby utworzyć baner, zaczynamy od wstawienia bloku obrazu AI u góry strony. Z paska narzędzi zmieniamy ustawienie wyrównania na „Pełna szerokość”. W pasku bocznym ustawień bloku zmieniamy proporcje na „Rozmiar niestandardowy” i wpisujemy szerokość 2048 (aktualne maksimum) i wysokość 600. (Zakłada to, że używamy AI Image Lab Pro, ponieważ maksymalny wymiar w darmowa wersja to 768.)

Następnie wpisujemy opisowy tekst monitu dla obrazu w polu tekstowym pokazanym w bloku. Spróbujmy tylko jednego słowa „sąsiedztwo”. Następnie klikamy przycisk Generuj obraz i czekamy, aż blok zostanie wypełniony obrazem. Ponieważ nasz obraz jest dość szeroki, obrazy podglądu mogą być nieco rozmyte, ponieważ podglądy są renderowane w niższej rozdzielczości niż ostateczny obraz w trybie HD.

Możemy teraz używać strzałek na pasku narzędzi bloku obrazu AI, aby poruszać się po obrazach podglądu. Jeśli zbliżamy się do końca zestawu obrazów podglądu, nowy zestaw jest generowany automatycznie, więc mogą wystąpić pewne opóźnienia, jeśli szybko przeglądamy wiele obrazów podglądu. W dowolnym momencie możemy kliknąć przycisk edycji na pasku narzędzi bloku, aby zmienić tekst monitu; wszelkie zmiany, które wprowadzimy na pasku bocznym ustawień bloku, spowodują również wygenerowanie nowego zestawu obrazów. Po znalezieniu obrazu, którego chcemy użyć, klikamy ikonę znacznika wyboru na pasku narzędzi, co spowoduje pobranie obrazu w pełnej rozdzielczości na naszą stronę i zastąpienie podglądu w niskiej rozdzielczości pokazanego w bloku. Ten proces może zająć trochę czasu ze względu na wybraną przez nas wysoką rozdzielczość.

Oto obraz, którego używamy w tym przykładzie:

Ponieważ chcemy nałożyć trochę tekstu na ten obraz, a także wprowadzić inne zmiany stylistyczne, powinniśmy przekształcić blok obrazu AI w inny blok, który lepiej pasuje do naszych potrzeb. W tym przypadku użyjemy bloku Row Layout z Kadence Blocks. Po prostu kliknij ikonę AI Image po lewej stronie paska narzędzi bloku i wybierz Układ wierszy w „Przekształć w” (zakładając, że wtyczka Kadence Blocks jest aktywna). Po wyświetleniu monitu wybieramy układ pojedynczej kolumny dla wiersza.

W tym momencie może być konieczne zresetowanie wyrównania w bloku Układ wierszy do pełnej szerokości. Będziemy również chcieli ustawić górne i dolne wypełnienie na 3XL i przejść do przełącznika Ustawienia nakładki tła na karcie Styl paska bocznego ustawień bloku i włączyć czarną nakładkę o przezroczystości 60%, aby uzyskać większy kontrast między tekst i obraz tła. Następnie możemy wstawić blok „Text (Adv)” w wierszu, ustawić kolor tekstu na biały, wyrównanie do środka, znacznik HTML na „H1”, a wysokość linii na 2. Teraz dodajemy nasz tekst, który może prowadzić do następującego jako bardzo podstawowego przykładu:

W dwukolumnowym rzędzie pod banerem wstawiamy kolejny blok Row Layout, tym razem z układem 2-kolumnowym. Wstawiamy blok obrazu AI do każdej kolumny i ustawiamy współczynnik proporcji dla każdego bloku na „3:2 (poziomo)” (w tym przykładzie pozostawiliśmy domyślne wymiary w pikselach, ale w produkcji należy je ewentualnie poprawić jak również w celu uzyskania mniejszego rozmiaru pliku obrazu). W lewej kolumnie używamy tekstu podpowiedzi obrazka „budynek mieszkalny”, aw prawej kolumnie po prostu „dom”. Oto podglądy obrazów, z którymi będziemy pracować, przed ich przesłaniem i przekształceniem bloków obrazu AI:

Następnie klikamy przycisk znacznika wyboru na pasku narzędzi dla każdego bloku obrazu AI, aby przesłać obrazy, a po zakończeniu przesyłania klikamy ikonę bloku obrazu AI po lewej stronie paska narzędzi i wybieramy opcję przekształcenia każdego obrazu w informacje Blok pudełkowy z Kadence Blocks. Po dodaniu tekstu nasza strona wygląda tak:

Wniosek

Podczas gdy wtyczka AI Image Lab była kompatybilna z Gutenbergiem prawie od czasu jej pierwszej wersji beta dzięki integracji z biblioteką multimediów WordPress i selektorem multimediów, blok AI Image przenosi tę integrację na wyższy poziom, umożliwiając użytkownikom tworzenie, podgląd, i przesyłaj obrazy wygenerowane przez sztuczną inteligencję bezpośrednio w kontekście, w którym będą używane, ułatwiając wybór obrazów, które dobrze współgrają z otaczającą treścią, znalezienie odpowiedniego współczynnika proporcji i wizualizację gotowego produktu. Dzięki (opcjonalnej) kompatybilności z wbudowaną wtyczką Kadence Blocks, AI Image Lab jest potężnym narzędziem zaprojektowanym, aby umożliwić twórcom treści Gutenberga tworzenie niesamowitych wizualizacji opartych na blokach!

Z AI Image Lab można korzystać bezpłatnie, z pewnymi ograniczeniami dotyczącymi liczby obrazów, które można przesyłać do witryny w ciągu 24 godzin, jak wysokiej rozdzielczości mogą być te obrazy itp. Aby uzyskać jeszcze więcej możliwości tworzenia obrazów wysokiej jakości, sprawdź stronę Plan AI Image Lab Pro!