Jak dodać tekst na górze obrazu w WordPress (3 metody)

Dodanie tekstu na górze obrazu jest popularną techniką zwiększania atrakcyjności wizualnej treści lub strony internetowej. Ponadto, jest to świetny sposób na uczynienie obrazów bardziej informacyjnymi i angażującymi.

W tym artykule znaleźliśmy trzy proste sposoby na dodanie tekstu na górze obrazu w WordPress. Niezależnie od tego, czy wolisz używać Edytora Bloków, wtyczki, czy niestandardowego kodu. Dowiedzmy się!

Dlaczego ważne jest dodanie tekstu u góry obrazów

Zanim przejdziesz do metod, musisz wiedzieć, dlaczego dodanie tekstu na górze obrazów jest ważne.

1. Przyciągnij uwagę

Jeśli użytkownicy szybko przewijają treść, dodanie samych obrazów może nie być wystarczające, aby zwrócić ich uwagę. Dlatego musisz dodać tekst na górze obrazu, aby pomóc w przyciągnięciu uwagi użytkowników i przekazaniu Twojej wiadomości bardziej efektywnie.

2. Popraw doświadczenie użytkownika

To prawda, że obrazy mogą same w sobie zapewnić wiele wartości, jednak dodanie tekstu na ich górze, takiego jak podpisy, cytaty lub inne treści oparte na tekście, może sprawić, że staną się jeszcze bardziej użyteczne. Ponadto użytkownicy mogą zrozumieć kontekst obrazu i jego związek z Twoją treścią.

3. Poprawa dostępności

Możesz również pomóc w poprawie dostępności dla użytkowników, którzy mogą mieć trudności z wyświetleniem samego obrazu. Dostarczając alternatywny tekst, możesz zapewnić, że Twoje treści są dostępne dla szerszego grona użytkowników.

4. Poprawa SEO

Dodanie odpowiednich słów kluczowych do podpisów obrazów lub tekstu alternatywnego może pomóc w poprawie pozycji witryny w wynikach wyszukiwania. Dzieje się tak, ponieważ wyszukiwarki wykorzystują te informacje do zrozumienia treści witryny i określenia, jak trafnie odpowiada ona zapytaniom użytkowników.

3 metody: Jak dodać tekst na górze obrazu w WordPress

1. Użyj edytora bloków WordPress

Najpierw przejdź do strony lub posta, na którym chcesz dodać tekst nad obrazem.

Wybierz Okładka , aby napisać tekst na obrazie.

Następnie zacznie się pojawiać na ekranie. Pokazuje domyślny obraz, ale możesz go zmienić według własnego uznania.

Możesz również zastąpić domyślny obraz swoim niestandardowym obrazem. Kliknij przycisk zamiany i następnie prześlij obraz lub po prostu wybierz z biblioteki multimediów.

Wyglądać to będzie tak, a następnie możesz napisać tekst na górze obrazu, jak chcesz.

Podwójne kliknięcie na tekście spowoduje wyświetlenie opcji edycji tekstu. Możesz dostosować rozmiar, kolor i wiele innych elementów zgodnie z wymaganiami.

Następnie kliknij przycisk aktualizacji, lub jeśli dodałeś nowy post lub stronę, kliknij przycisk publikowania.

2. Użyj CSS

Otwórz Edytor Bloków WordPress i wybierz blok obrazu , gdzie chcesz dodać tekst. W prawym panelu bocznym kliknij na Zaawansowane zakładkę.

W Dodatkowa klasa CSS pole, dodaj niestandardową klasę dla bloku obrazu.

Zapisz zmiany i opublikuj lub zaktualizuj stronę lub wpis.

.custom-class { pozycja: względna; } .custom-class p { pozycja: absolutna; góra: 50%; lewo: 50%; przekształcenie: translate(-50%, -50%); rozmiar-czcionki: 24px; kolor: #ffffff; cień-tekstu: 2px 2px 2px #000000; } 

W powyższym kodzie zastąp „custom-class” niestandardową klasą dodaną do bloku obrazu. Możesz również dostosować rozmiar czcionki, kolor i inne opcje stylistyczne do swoich preferencji.

3. Użyj wtyczki WordPress

Jeśli chcesz mieć swobodę tworzenia całkowicie niestandardowych projektów stron, potrzebujesz wtyczki do tworzenia stron. Jedną z wtyczek do tworzenia stron WordPress jest SeedProd, która pozwala dodawać tekst na dowolnym obrazie w całej witrynie.

Najpierw zainstaluj i aktywuj wtyczkę SeedProd. Po aktywacji będziesz musiał wprowadzić klucz licencyjny. Zaloguj się na swoje konto SeedProd i kliknij zakładkę „Pobierz” .

Po zakończeniu skopiuj klucz w licencyjny” .

Możesz teraz wkleić ten klucz do panelu administracyjnego WordPress, przechodząc do strony SeedProd » Ustawienia.

Po przejściu tutaj wklej klucz w polu Klucz licencyjny. Następnie wystarczy kliknąć „Zweryfikuj klucz”.

Następnie przejdź do SeedProd » Strony docelowe i kliknij Dodaj nową stronę docelową.

Następnie wybierz szablon. Bez względu na to, który szablon SeedProd wybierzesz, możesz dostosować każdą część szablonu, aby idealnie pasował do Twojej strony internetowej i brandingu.

Jeśli jednak wolisz zacząć od pustego płótna, kliknij Szablon pusty.

Po znalezieniu szablonu najedź na niego kursorem myszy. Następnie kliknij ikonę podglądu.

Jeśli jesteś zadowolony z wyglądu tego szablonu, kliknij przycisk Wybierz ten szablon.

W polu Nazwa strony wpisz nazwę strony.

Jeśli chcesz zmienić automatycznie utworzony adres URL, edytuj tekst w polu URL strony .

Kliknij „Zapisz i rozpocznij edycję strony” . Spowoduje to otwarcie szablonu w edytorze „przeciągnij i upuść” SeedProd.

Na pasku bocznym po lewej stronie zobaczysz wszystkie bloki i sekcje, które możesz dodać do swojej strony metodą „przeciągnij i upuść”.

Jeśli nie korzystasz z pustego szablonu, Twoja strona SeedProd będzie już zawierać bloki i sekcje. Aby edytować dowolną z tych treści, kliknij, aby zaznaczyć blok lub sekcję.

Menu po lewej stronie SeedProd wyświetli teraz wszystkie ustawienia, których możesz użyć do dostosowania tego bloku lub sekcji.

Najprostszym sposobem dodania tekstu na obrazie jest skorzystanie z gotowych sekcji „Hero” w SeedProd.

Sekcje te mają zastępczy obraz tła o pełnej szerokości, na którym znajduje się tekst zastępczy. Możesz po prostu zastąpić domyślny obraz tła i tekst własną treścią.

Kliknij kartę „Sekcja” w menu po lewej stronie.

Następnie kliknij „Hero” , aby wyświetlić wszystkie gotowe sekcje „Hero”, które możesz dodać do swojej strony.

Aby dodać tę sekcję Hero do swojego projektu, po prostu kliknij Wybierz tę sekcję.

Kliknij obraz stockowy, aby go wybrać, jeśli chcesz zastąpić obraz z szablonu własnym.

Najedź kursorem obrazu tła , aż pojawi się ikona kosza na śmieci. Następnie możesz kliknąć tę ikonę , aby usunąć obraz zastępczy.

Następnie kliknij „ Użyj własnego obrazu”. Możesz wybrać obraz z biblioteki multimediów WordPress lub użyć obrazu stockowego.

Po dodaniu obrazu możesz zastąpić tekst zastępczy.

Kliknij, aby wybrać blok tekstowy. Następnie w polu „Tekst”wpisz tekst, którego chcesz użyć.

Niektóre szablony bohatera SeedProd zawierają dodatkową treść, taką jak przyciski wezwania do działania.

Jeśli chcesz zmienić tę treść, kliknij, aby zaznaczyć blok , a następnie wprowadź zmiany w menu po lewej stronie SeedProd.

Inną opcją jest usunięcie bloku ze szablonu hero.

Aby to zrobić, kliknij, aby wybrać blok , a następnie kliknij ikonę kosza.

Jeśli jesteś zadowolony z projektu strony, kliknij przycisk „Zapisz”.

Następnie możesz wybrać, czy chcesz opublikować stronę, czy zapisać ją jako szablon.

Wniosek

To wszystkie trzy metody dodawania tekstu na obrazie w WordPressie. Proste, prawda? Wybierz podejście, które najlepiej odpowiada Twoim umiejętnościom i preferencjom projektowym.

Co więcej, organizuj, optymalizuj i zarządzaj swoimi plikami multimedialnymi jak profesjonalista dzięki WP Media Folder. Czas pożegnać się z bałaganem w bibliotekach!